Yii and Javascript form submission

Question

I'm using Yii as a PHP framework for my site. Additionally, my site uses some js/jquery like, say, a jQuery UI Dialog widget (except for those dialogs, the rest of the code is pure normal html form components and jQuery code for the event handlers).

In the Yii side, I use CForms to build my forms from specifications file.

When I test if the form was submitted, I must do it for a certain button. This is not only forced, but I also take advantage of it.

if ($myCFormInstance->submitted('approve')) {
    //process approval code
} else if ($myCFormInstance->submitted('reject')) {
    //process rejection code
}

The actual problem I have is a bit conceptual one, since -fortunately- I know what's going on with my code and -again, fortunately- know the problem root:

Somewhere in My code I intercept the submit button's click event:

$(function(){
    $(".critical-action").click(function(e){
        var form = $(this).closest("form");
        e.preventDefault();
        e.stopImmediatePropagation();
        confirmDialog("¿Continuar?", "#critical-action-dialog", function(){
            form.submit();
        });
    });
});

Say the .critical-action classed elements are always a submit button in a form.

The intention of the code: cancel the form submission, and perform it only if the user -in the dialog- clicks the "Yes, Continue" (i.e. confirming the action) button.

This code works as expected, and have no problems at a javascript level BUT -and here goes my issue- when doing form.submit(), the button is not sent as part of the form. This is obvious: I'm sending the form without specifying any button. In the case of Approve and Reject, which have two buttons, the example explains itself: if the form.submit() call could send their buttons ¿which of them should send?.

Question: So, since form.submit() doesn't send any button, but I actually need buttons ¿how can I send the form "with the corresponding button" -i.e. a button I choose to specify, which should correspond to this in the click handler function context- automatically via javascript? The button NEEDS to be identified by Yii in order to process the form (specially with the Approve and Reject case).

Perhaps it'd be a good idea. It was a fallback idea since i thought it'd exist a cleaner one. Please expand it as an answer, with an explanation and example for the community. — Luis Masuelli
Maybe this could also be an issue from using preventDefault and stopImmediatePropegation. — Quentin Skousen
No, the issue had nothing to do with them. I explained the issue: form.submit() doesn't send any button (I also explained why such behavior could be even harmful to my site) and I looked for a workaround to "add that button" by javascript (actually, without doing an ajax query). @kkhugs was right and I took his suggestion. I'm just waiting until he puts it as an answer since it worked well. — Luis Masuelli

Quentin Skousen Quentin Skousen · Accepted Answer · 2014-05-15T14:54:25

If you added a hidden input to the form, you can modify the input value with jQuery before you submit the form, like this:

$("#inputID").val('approve');

If you want to set the value to the value of the clicked button via $(this).val(), be aware of the issue that could result in an IE browser, explain here. The second answer (by postpostmodern) has a solution to this issue.

Yii and Javascript form submission

1 Answers