onclick功能出现问题

Question

Hi I have written a GSP and Javascript code to perform on click remove file functionality.

JavaScript code

function remove(attachmentId) {
    $(document).ready(function(){
            $('.glyphicon-remove').click ( function(e){
                e.preventDefault();
                $(this).parent().parent().remove();

                $.ajax({
                           url: "${g.createLink(controller: "landing", action: "deleteSelectedFile")}",
                            data: {
                                    attachmentId: attachmentId
                            },
                            success: function(data){
                                    alert("Success");
                            }

                       });

                 });
            });

        }

GSP Code

               <g:each in="${fileList}" var="file">
                    <div>
                        <a href="#" onclick="remove('${file.attachmentId}')"> 
                        <span class="glyphicon glyphicon-remove"></span></a> 
                        <a href="/forms/landing/attachment/${file.attachmentId}" >${file.name}</a> 
                        </br>
                    </div>
                </g:each>

Groovy Code

def deleteSelectedFile() {
        String attachmentId= params.attachmentId
        activitiService.deleteAttachemnt(attachmentId)
    }

I am not getting why exactly it is taking double click for deleting the first record.

Please help me.

Note: Application is running in Internet Explorer.

Answer 1

I think removing the $(document).ready(function() {...}) part as well as $('.glypeicon-remove') part from the remove function but keeping the stuff happening inside of these untouched, should fix your problem.

So your code should look like:

JavaScript:

function remove(attachmentId) {
    $(this).parent().parent().remove();
    $.ajax({
        url: '${g.createLink(controller: '
        landing ', action: '
        deleteSelectedFile ')}',
        data: { attachmentId: attachmentId },
        success: function (data) { alert('Success'); }
    });
}

Hope this helps.