How to save data from a JavaScript variable outside the form in PHP/AJAX/jQuery?

Question

PHP newbie here. I want to save a variable (from jQuery) in PHP/MySQL, but this variable is outside the form. The values from the form elements inside the form is being saved fine though. The variable name in this case is 'mode', and I want the 'mode' to be sent to PHP.

Here's code :

HTML form;

<form action="submit.php" method="post" id="myform">
 <textarea id="source1" name="source1"></textarea>
<textarea id="source2" name="source2"></textarea>
 <input type="image" src="images/save.png" name="submit" id="submit" title="Save"  class="save-button"/>    
</form>

jQuery / AJAX:

mode = 1;  // This value needs to be stored/saved

// AJAX form save
$("form#myform").submit( function () {    
$.post(
'submit.php',
$(this).serialize(),
function(data){
....
}
);

PHP:

$submit_time = date('Y/m/d H:i:s');
$content1 = $_POST['source1'];
$content2 = $_POST['source2'];
$mode = $_POST['mode'];  // This value needs to be stored/saved

Is the solution to create a hidden form field inside the form?

Are you trying to submit the form, or send it with ajax. If you're OK with submitting the form and redirecting the page, a hidden input is the way to go. — adeneo
– adeneo, Commented Nov 23, 2013 at 21:22

D.J. · Accepted Answer · 2013-11-23 21:22:17Z

2

If the variable is not inside the form it doesn't get send to the server.

The solution is to put the variable into hidden field inside the form

answered Nov 23, 2013 at 21:22

D.J.

1,2153 gold badges16 silver badges31 bronze badges

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

Comments

adeneo · Accepted Answer · 2013-11-23 21:33:32Z

2

jQuery's serialize() serializes the form into a querystring, so you really just have to add to that string :

mode = 1;

$("form#myform").submit( function (e) {    
    e.preventDefault();
    var data = $(this).serialize() + '&mode=' + mode;
    $.post('submit.php', data, function(data){

    });
});

or to submit the form with a hidden input:

$("form#myform").submit( function (e) {  
    e.preventDefault();
    $(this).append( $('<input />', {type:'hidden', name:'mode', value:mode}) );
    this.submit();
});

edited Nov 23, 2013 at 21:33

answered Nov 23, 2013 at 21:25

adeneo

319k29 gold badges410 silver badges392 bronze badges

Comments

christian.thomas · Accepted Answer · 2013-11-23 21:23:26Z

1

Try:

// AJAX form save
$("form#myform").submit( function () {    
    $.post('submit.php', $.extend($(this).serializeArray(), { mode: mode }), function(data){
        ....
    });
});

answered Nov 23, 2013 at 21:23

christian.thomas

1,1221 gold badge8 silver badges19 bronze badges

1 Comment

kirugan Over a year ago

Why serialize? Maybe serializeArray ?

Collectives™ on Stack Overflow

How to save data from a JavaScript variable outside the form in PHP/AJAX/jQuery?

3 Answers 3

Comments

Comments

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

Comments

Comments

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related