jQuery - add additional parameters on submit (NOT ajax)

JqueryParameter PassingForm Submit

Jquery Problem Overview


Using jQuery's 'submit' - is there a way to pass additional parameters to a form? I am NOT looking to do this with Ajax - this is normal, refresh-typical form submission.

$('#submit').click(function () {
	$('#event').submit(function () {
		data: { 
		form['attendees'] = $('#attendance').sortable('toArray').toString();
	});
});

Jquery Solutions


Solution 1 - Jquery

This one did it for me:

var input = $("<input>")
               .attr("type", "hidden")
               .attr("name", "mydata").val("bla");
$('#form1').append(input);

is based on the Daff's answer, but added the NAME attribute to let it show in the form collection and changed VALUE to VAL Also checked the ID of the FORM (form1 in my case)

used the Firefox firebug to check whether the element was inserted.

Hidden elements do get posted back in the form collection, only read-only fields are discarded.

Michel

Solution 2 - Jquery

In your case it should suffice to just add another hidden field to your form dynamically.

var input = $("<input>").attr("type", "hidden").val("Bla");
$('#form').append($(input));

Solution 3 - Jquery

You can even use this one. worked well for me

$("#registerform").attr("action", "register.php?btnsubmit=Save") 
$('#registerform').submit();

this will submit btnsubmit =Save as GET value to register.php form.

Solution 4 - Jquery

You don't need to bind the submit event on the click of the submit button just bind the submit event and it will capture the submit event no mater how it gets triggered.

Think what you are wanting is to submit the sortable like you would via ajax. Try doing something like this:

var form = $('#event').submit(function () {
	$.each($('#attendance').sortable('toArray'),function(i, value){
		$("<input>").attr({
			'type':'hidden',
			'name':'attendace['+i+']'
		}).val(value).appendTo(form);
	});
});

Solution 5 - Jquery

You could write a jQuery function which allowed you to add hidden fields to a form:

// This must be applied to a form (or an object inside a form).
jQuery.fn.addHidden = function (name, value) {
    return this.each(function () {
        var input = $("<input>").attr("type", "hidden").attr("name", name).val(value);
        $(this).append($(input));
    });
};

And then add the hidden field before you submit:

var frm = $("#form").addHidden('SaveAndReturn', 'Save and Return')
                    .submit();

Solution 6 - Jquery

Similar answer, but I just wanted to make it available for an easy/quick test.

var input = $("<input>")
               .attr("name", "mydata").val("go Rafa!");

$('#easy_test').append(input);

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.3/jquery.min.js"></script>



<form id="easy_test">
  
</form>

Attributions

All content for this solution is sourced from the original question on Stackoverflow.

The content on this page is licensed under the Attribution-ShareAlike 4.0 International (CC BY-SA 4.0) license.

Content TypeOriginal AuthorOriginal Content on Stackoverflow
QuestionCielView Question on Stackoverflow
Solution 1 - JqueryMichelView Answer on Stackoverflow
Solution 2 - JqueryDaffView Answer on Stackoverflow
Solution 3 - JqueryParagView Answer on Stackoverflow
Solution 4 - JqueryPetersenDidItView Answer on Stackoverflow
Solution 5 - JqueryJonathanView Answer on Stackoverflow
Solution 6 - JqueryCacho SantaView Answer on Stackoverflow