Changing the form action, when a submit button is pressed using JavaScript

Question

I have a submit button like as follows.

<input type="submit" 
       name="btnDelete" 
       id="btnDelete" 
       value="Delete" 
       onclick="this.form.action='${pageContext.request.contextPath}/Country/DeleteMany'"/>

I causes the form action to change, when it is pressed.

I however, need to invoke another function before this action is changed. This another function returns a boolean value based on a confirm dialog of JavaScript.

I have tried the following.

onclick="return confirmDeleteMuliple(); this.form.action='${pageContext.request.contextPath}/Country/DeleteMany'"

The action however, did not change on submit (when confirmDeleteMuliple() returns true).

I have tried placing the code that changes the action in a separate JavaScript function like as follows.

function deleteManyAction()
{
    document.dataForm.action='${pageContext.request.contextPath}/Country/DeleteMany';
}

And the onclick attribute is changed as follows.

onclick="return confirmDeleteMuliple();deleteManyAction();"

The deleteManyAction() function however, never invoked. It works only when the function confirmDeleteMuliple() is removed from onclick.

How to invoke these two functions in the defined sequence?

_{The expression ${pageContext.request.contextPath} evaluates to a context path of the application on load time like /Example (when this file (JSP) is parsed).}

It seems you are looking for onsubmit event of javascript.. — Mr_Green
– Mr_Green, Commented Feb 10, 2014 at 14:56
Anyway, the action should be changed after confirmation (after confirmDeleteMuliple() returns true. Otherwise, nothing should happen). — Tiny
– Tiny, Commented Feb 10, 2014 at 14:58
Then you should call the next function in confirmDeleteMultiple function when it is returning true. — Mr_Green
– Mr_Green, Commented Feb 10, 2014 at 15:00

Seraphithan · Accepted Answer · 2014-02-10 15:24:53Z

1

Code placed after a return will never be reached. The return basically means stop working and give me what you have.

This should do what you want:

onclick="return submit();"

function submit(){
   if(confirmDeleteMuliple()){
       deleteManyAction();
       return true;
   }else{
       return false; //Otherwise the form will be submitted anyway.
   }
}

answered Feb 10, 2014 at 15:24

Seraphithan

4191 gold badge5 silver badges14 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

BergBrains · Accepted Answer · 2014-02-10 15:29:07Z

1

Try to keep code (JS) out of your presentation layer (HTML). I assign all of my event handlers in my JS files. Try this approach, which I think will make your code :

$("#btnDelete").click(function() {
    if ( confirmDeleteMuliple() ) {
       this.closest("form").attr("action", 
                                 ${pageContext.request.contextPath} + '/Country/DeleteMany');
       # Here, returning true will allow the form submission to complete with the new
       return true;
    } else {
       # This will stop the form from being submitted
       return false;
    }
});

answered Feb 10, 2014 at 15:29

BergBrains

3022 silver badges4 bronze badges

Collectives™ on Stack Overflow

Changing the form action, when a submit button is pressed using JavaScript

2 Answers 2

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related