提交后的Ajax调用不会在Yii中调用正确的操作/控制器

in the following jquery script, I use 3 functions, to create, to update and to save comments. When I create a new record, the create function is called and if I click save, the record is saved. If I refresh the page and wants to update the record, it works. (update then save functions)

But when I want to update just after create/save without refreshing the page, the function save is called instead of update/save.

I probably need to unbind events, but it does not work for me. My save is triggered by click and inside it, the submit event is linked to an element.

I read somewhere that it it not a good practice but the solution I read is to trigger the submit event from click function, I tried it but it reloads the page which I want to avoid because I'm using Ajax.

EDIT

I put a trace and I can see that when I want to update after the create/save, it call the save method but does not go inside the method, it does not go into update method either. The url called contains the save but with the update call parameters.

/blog/index.php/save...

My understanding is that in MVC pattern, the controller method render the view. Since the last view rendered after create/save is done by save action controller, the submit done after that call the controller from which the view is rendered.

Any insights will be appreciate.

$(document).ready(function() {

    $("input.switch-input:radio").click(function(e) {

            var comment = $(this).data('comment');
            var val = $(this).data('val');

            if (comment.length == 0){   // New record
                $.ajax( 
                {
                    --> call url to create new record 
                });
            }
            else if(comment !== val){
                if (confirm ("change comment?")){

                    $.ajax( 
                    {
                    --> call url to update record
                    });
                } else{
                    alert('no');
                }
            } 
    })
;

   $('body').on('click','#saveComment',function(e) {
        e.preventDefault();
        var url = $(this).val();
            $("#comment-form").submit(function(e) {
                var postData = $(this).serialize();
                $.ajax( 
                {
                    --> call url to save data
                });
                e.preventDefault(); //STOP default action
                });
            $("#comment-form").submit();
            $("#comment-form").unbind('submit');
            $("#saveComment").unbind('click');
        });

});

If you're using on for your events, then the method to unbind them is off(). However, if you only want the event to be trigged once, you're better off using the .one() method instead.

I am assuming #saveComment is a submit button inside the #comment-form. That being the case, why not saving yourself the trouble of keeping track of the clicks, preventing the submit, trigger a submission by hand, etc by simply listening for the submit event in the first place?

$('body').on('submit','#comment-form',function(e) {
    e.preventDefault();
    // Code to execute after the form was submitted and submission has been prevented
}

And having said that, if you want to detach it, you can do it right there, but you can't use an anonymous function for that, you'll have to name it.

var submitHandler = function(e) {
    e.preventDefault();
    // Code to execute after the form was submitted and submission has been prevented
    alert("hello");

    // Detach event listener when suitable
    $("body").off('submit','#comment-form', submitHandler)
}

$('body').on('submit','#comment-form', submitHandler);

Working example here: http://jsfiddle.net/K3ePW/2/