Ng-Click not being fired

Question

I have made a code snippet which I use in multiple partial views. In all views it seems to work except one. There is nothing special about this particular partial view, and the code snippet is the same on every view.

However, am I not seeing something?

The real problem:

Ng-click on the form submit is not fired. The form is submitted however.

$scope.submitNewNoteForm = function () {
        alert("HI");
    $("#new_noteform").on("submit", function (e) {
        alert("yo");

        var formObj = $("#new_noteform");
        var formURL = formObj.attr("action");
        var formData = new FormData(this);
        $.ajax({
            url: formURL,
            type: 'POST',
            data: formData,
            mimeType: "multipart/form-data",
            contentType: false,
            cache: false,
            processData: false,
            success: function (data, textStatus, jqXHR)
            {
                $('#new_noteform')[0].reset();
                $('#new_note').modal('toggle');
            },
            error: function (jqXHR, textStatus, errorThrown)
            {
                alert(textStatus);
            }
        });
        //Prevent Default action. 
        e.preventDefault();
        e.unbind();
    }
    );
};

Ng-Click method:

Snippet:

 
                
                    
                        
                            
                        
                    
                
                
                    
                        {{note.title}}
                    
                
                
                    
                        
                            
                                
                                {{selnote.title}}
                            
                            
                                
                                    
                                
                                
                                    
                                     
                                
                            

                        
                    
                
                
                    
                        
                            
                                
                                Nieuwe notitie
                            
                            

                                
                                
                                
                                    
                                        
                                    
                                    
                                        
                                            Urgentie
                                            
                                                
                                                !
                                            
                                                
                                                !!
                                            
                                                
                                                !!!

soywod · Accepted Answer

You should use ng-submit on your form instead of ng-click on the submit button (doc here) :

In your controller, you don't need to listen to submit event, it's handled by angular and your function in ng-submit :

$scope.submitNewNoteForm = function (e) {
    // To put at the top level
    e.preventDefault();

    alert("yo");

    var formObj = $("#new_noteform");
    var formURL = formObj.attr("action");
    var formData = new FormData(this);
    $.ajax({
        url: formURL,
        type: 'POST',
        data: formData,
        mimeType: "multipart/form-data",
        contentType: false,
        cache: false,
        processData: false,
        success: function (data, textStatus, jqXHR)
        {
            $('#new_noteform')[0].reset();
            $('#new_note').modal('toggle');
        },
        error: function (jqXHR, textStatus, errorThrown)
        {
            alert(textStatus);
        }
    });
}

Ng-Click not being fired

Answers (1)

Related Questions