从javascript访问具有相同名称的HTML表单元素

Question

I am using the following solution ( How to best implement Save | Save and Close | Cancel form actions in ASP.NET MVC 3 RC ) of multiple submit buttons to allow cancel and save from my MVC form:

<form action="Xxxx" method="post" onsubmit="return validatePost()">
...
<input type="submit" name="actionType" value="Save" />
<input type="submit" name="actionType" value="Cancel" />
</form>

With javascript called onsubmit:

function validatePost() {
    if(Blah blah){
        return true;
    }
}

I only want to do this javascript validation if 'Save' is clicked, but cannot tell which button was clicked from the javascript.

I tried getting the actionType value using document.forms[0].elements["actionType"].value but could not, as there is more than one item named actionType on the form.

Can anyone help?

Thanks

Answer 1

You can use id ( http://jsfiddle.net/7p5N5/ )

<form method="post">
<input id="save" type="submit" name="actionType" value="Save" />
<input type="submit" name="actionType" value="Cancel" />
</form>

function validate() {
    alert('Validate');
    return false; // cancel click, true will submit
}

$("#save").click(function () {
    return validate();
});

If you don't want to use id , you can use $('input[name="actionType"][value="Save"]') to select the Save button

Answer 2

Are you able to listen to the onclick event of only the 'Save' input and have it use your validatePost function.

Then you could have a different function for the onclick of 'Cancel' to do appropriate action.