CODEWITHSUNDEEP
javascriptphpjqueryformsform-submit
Zulfakar Zukri
Zulfakar Zukri

Reputation: 173

Set the Form action after the form has been submit jQuery

How do i "SET" the action(not changing) AFTER the form has been submit?

<form id="serialize" action="newjob.php?serialize=newjob" method="post">
<button id="jobsearch" name="jobsearch">GET FROM DB</button>
</form>

AFTER the form has been submit and showing the value i need from db, SET the new action for the form, example after submit how do i get like this one so i can add the value to db?

<form id="serialize" action="newjob.php?faulty=newjob" method="post">
<button id="jobsearch" name="jobsearch">ADD TO DB</button>
</form>

as far as i know by search on the net this jquery only CHANGING(onsubmit) and not after submit

$(function(){
$('#serialize').submit(function (event)
{
    var newaction = 'newjob.php?faulty=newjob';
    $(this).attr('action', newaction);
});
});

it is possible to had AFTER form has been submit then set the new form action for the same form? the only thing i need to accomplish this is because i cant have a form inside a form(nested)

Upvotes: 2

Views: 3287

Answers (2)

Artur Filipiak
Artur Filipiak

Reputation: 9157

You can't modify form attributes inside .submit() event handler since it has been submitted using a typical submit method.
After the from has been submitted, the new document is loaded and any submit event set for the form is not catched yet.

You have two options to solve the problem.

  1. AJAX request instead of traditional form submition (recommended);
    You should handle server response (data sent back from PHP) on the original page, like so (without modifying your HTML):

    $('#serialize').submit(function (event){
    // prevent typical submit method:
    event.preventDefault();
    var that = $(this), newaction;
    $.ajax({
        url     : that.attr('action'),
        method  : 'GET',
        data    : that.serialize(),
        // dataType : set accordingly to the type of data received from PHP,
        success : function(data_received_from_php){
            if(that.attr('action') === 'newjob.php?faulty=newjob'){
                newaction = 'newjob.php?serialize=newjob';
                // do something with "data_received_from_php" for that specific "action" ...
            }else{
                newaction = 'newjob.php?faulty=newjob';
                // do something with "data_received_from_php" for that specific "action" ...
            }
            // set the new action attribute:
            that.attr('action', newaction);
        },
        error   : function(){
            // handle errors ...
        }
    });
});

  1. Simply check whether url contains specific string, and based on that modify the action attr of the form (I'd treat it as a workaround since these days, AJAX is much more "user friendly" in submitting forms):

    if (window.location.href.indexOf("?serialize=newjob") > -1) {
    $('#serialize').attr('action', 'newjob.php?faulty=newjob');
}

Upvotes: 2

Louis Loudog Trottier
Louis Loudog Trottier

Reputation: 1377

From what i see you are using jQuery and i've done something similar before.

The trick is to change your Submit button by a regular button that trigger a function to do what you have to do and finally submit the form using .sumbit()

Something like this:

<form id='changingForm' .... >
<button onclick='changingFunction()' ...>
</form>

function changingFunction(){
    var newaction = 'newjob.php?faulty=newjob#tabs-2';
    $('#changingForm').attr('action', newaction);
    $('#changingForm).submit();
}

This code probally won't work AS IS for your case scenario but i'm sure you can fingure the logic behind it. jQuery is too far behind me to give you an absolute answer.

Hope it helps.

Upvotes: 1

Related Questions