Setting submit value in jQuery submit

Question

I want to use jQuery to submit my form and i can do that like so

  $('#myform_id').submit();

and thats all good but normally someone clicks a submit button than that submit button has a value so when I do the submit via jQuery I also need to set a submit value how do i do that ?

EDIT

as noted by some answers I could do this by simulating a user click but I don't want to do that I want to pass the submit value when I use the .submit() command if that is possible

ultimately the submit using ajax form

** Clarifying **

ok so I have jQuery setup to use jquery validate and has a submit handler like so

$("#myform_id").validate({
    submitHandler: function() {
        run_ajax(obj);
    }
});

then that calls I function i call run_ajax passing and object containing information about what type of ajax i want and what have you.

and ultimately runs this

obj.formitem.ajaxSubmit({
    dataType:'json',
    data: obj.pdata,
});

where

  obj.formitem == $('#myform_id');

so when the form is submit all that happens all good.

so I load the page with this form into jquery dialog and I want them to be able to click a button in the dialog that triggers the form submit and also tells the form what type of submit was requested

hopefully this is clear now sorry for confusion

That function just triggers the normal form submission. If the value is not coming over, perhaps you should trigger the click event of the submit button instead. A lot of the time with jQuery, the $.ajax/$.get/$.post functions are used rather than a normal form submission that navigates to a new page. — Fosco, Aug 20 '10 at 13:57

score 21 · Answer 1 · edited May 23 '17 at 12:26

21

https://stackoverflow.com/a/993897/215887 worked for me

Well actually I did it this way:

$('<input />').attr('type', 'hidden')
              .attr('name', 'myButton')
              .attr('value', 'MyButton')
              .appendTo('#my-form');
$('#my-form').submit();

edited May 23 '17 at 12:26

Community

1
1

answered Apr 21 '12 at 21:42

brian_d

11,190
5
47
72

This is brilliant. Works well with MVC .BeginForm constructs. Can also put the hidden field in the page or view if appropriate. – secretwep Apr 10 '19 at 01:04

score 15 · Accepted Answer · answered Aug 20 '10 at 13:56

15

One quick way would be $('#myform_id #submitButtonID').click();

answered Aug 20 '10 at 13:56

sjobe

2,817
3
24
32

4

despite not wanting to do it this way this is what I ended up doing – mcgrailm Oct 26 '11 at 16:56

score 2 · Answer 3 · edited May 23 '17 at 10:30

.submit() will get you the traditional submit that happens POST/GET with the page refresh.

For ajax, you will need to use either $.post, $.get or $.ajax -- eg:

var aaa = $("#your_form").serialize();
$.post("your_url",aaa,function(response){/*do something*/},"json");

As far as clicking of buttons is concerned, if you have multiple buttons that can possibly submit one form. You can use hidden fields as part of the form. Before you submit the form, change the hidden field according to the button that was pressed.

$(".submit_buttons").click(function(){

$("#my_hidden_input").val($(this).attr("rel"));

/* 
above serialize and ajax post code
*/

});

HTML :

<input type="button" class="submit_buttons" rel="special_button1" value="Button 1"/>
<input type="hidden" id="my_hidden_input" />

When I use this validation plugin, This is how I go about it.

$("#right_form").validate(); //To add validation to the form

validate9 = $("#right_form").validate().form(); //Check if the form validates

Then use if to check validate9 is true and submit using $.post().

Normal ajax is pretty straightforward.

A few reasons why I think you probably are using iframe to submit the form :
1) Its has to be done this way(some unchangeable requirement).
2) You want to upload some files using ajax.

Ref: JS iframe limitations.

Not sure if this helps, but, if you figure this out please post an answer to let us know how you took care of this.

nope not what I'm looking for either I know how to use ajax already doing that I'm going to edit my post I guess I need to add more details — mcgrailm, Aug 20 '10 at 14:27
read the edit, seems complicated, still can't wrap my head around what's going on. — DMin, Aug 20 '10 at 16:13
I'm thinking there isn't a way to do this what it boils down to is that I don't want to simulate a mouse click I want attach a key:value to the submit action when I run .submit() but I don't want simulate or manipulate the dom I could do that easily by adding to my obj.data property but because its running from the iframe js load and the jquery dialog is in the parent I can't set it that way so I was hoping that I would be able to pass it in the .submit() call ...follow ? — mcgrailm, Aug 20 '10 at 16:31

score 2 · Answer 4 · answered Oct 02 '11 at 03:51

   $('#myform').submit(function(event){
      /* stop form from submitting normally */
      event.preventDefault();

      // get form data and include value from submit button
      var post_data = form.serializeArray();
      post_data.push({name: event.originalEvent.explicitOriginalTarget.name,
                      value: event.originalEvent.explicitOriginalTarget.value
                     });

      // ...
   }

score 1 · Answer 5 · answered Aug 20 '10 at 14:29

The submit value is just passed as a parameter. So if you have:

<input type="submit" name="mysubmit" value="click"/>

then the request will contain a request parameter mysubmit=click .

So just add a hidden input type like this:

<input type="hidden" name="mysubmit" value="click"/>

score 0 · Answer 6 · answered Aug 20 '10 at 14:13

0

This should do the trick :

$('#form_id #submitbutton_id').val('your value');

answered Aug 20 '10 at 14:13

3rgo

3,115
7
31
44

but the point is that I want to ignore buttons as if there where no buttons – mcgrailm Aug 20 '10 at 14:16

score -1 · Answer 7 · answered Aug 20 '10 at 13:58

-1

You can add a Submit button to your form and emulate a click on the button. Doesn't it solve your purpose.

answered Aug 20 '10 at 13:58

Teja Kantamneni

17,402
12
56
86

Setting submit value in jQuery submit

7 Answers7