Razib
Razib

Reputation: 11163

Detecting the appropriate button with javascript

I have a form with two buttons -

<form:form id="reviewApprvDisapprvForm" modelAttribute="updateProofingForm" method="post">
    <input id="approveButton" onclick="submitForm()" type="image" src="/images/buttons/samplesApprovedButton.png" />
    <br />
    <input id="disapproveButton" onclick="submitForm()" type="image" src="/images/buttons/samplesNotApprovedButton.png" />
</form>

Here one button is for approve and another button for disapprove. I have a Javascript function "submitForm()" which is called "onclick" of these button. The function is like this

function submitForm(){
            //if('approvedButton' is clicked){
               $("#reviewApprvDisapprvForm").attr("action","/secure/userMgmt/roleBasedProofing/updateProofingConfirmMVC.do");
            //}

            $("#reviewApprvDisapprvForm").submit();
        }

In this function I have set the action with javascript. Here, I am trying to find for which button click the "submitForm()" method is called. There are two buttons - "approveButton" and "disapproveButton". How can I do this, can anyone help me?

Thanks in advance

Upvotes: 0

Views: 85

Answers (2)

VeldMuijz
VeldMuijz

Reputation: 615

I would do it like this: Remove the onclick="" from the HTML, set the image inside the input element, add the action to the form directly:

<form:form id="reviewApprvDisapprvForm" action="/secure/userMgmt/roleBasedProofing/updateProofingConfirmMVC.do" modelAttribute="updateProofingForm" method="post">
    <input id="approveButton" type="submit"><img src="/images/buttons/samplesApprovedButton.png"/></input>
    <br />
    <input id="disapproveButton" type="image" src="/images/buttons/samplesNotApprovedButton.png" />
</form>

$(document).ready(function() {
    $('#disapproveButton').click(function(){
       //your disapprove logic here

    });
});

Upvotes: 1

Biswas
Biswas

Reputation: 598

This can help

<form:form id="reviewApprvDisapprvForm" modelAttribute="updateProofingForm" method="post">
    <input id="approveButton" onclick="submitForm('approve')" type="image" src="/images/buttons/samplesApprovedButton.png" />
    <br />
    <input id="disapproveButton" onclick="submitForm('notApprove')" type="image" src="/images/buttons/samplesNotApprovedButton.png" />
</form>

and then

function submitForm(buttonVal){
            if(buttonVal=='approve'){
               $("#reviewApprvDisapprvForm").attr("action","/secure/userMgmt/roleBasedProofing/updateProofingConfirmMVC.do");
            }
           $("#reviewApprvDisapprvForm").submit();

        }

Thanks

Upvotes: 0

Related Questions