How do I pass a parameter when submitting an form in javascript to a MVC controller?

Question

I have a .cshtml page with several buttons like this:

<input id="btnViewHistory" type="submit" name="postFunction" value="View History" />
<input id="btnComments" type="submit" name="postFunction" value="Comments" />

When the form is submitted, the parameter "postFunction" is passed to the controller and I can check what button was pressed:

[HttpPost]
    public ActionResult LabApprovals(ModelApproval model, int page, string postFunction)
    {
        if (postFunction == null)
        {
          ...
        }
        else if (postFunction == "View History")
        {
            ...
        }
        else if (postFunction == "Comments")
        {
            ...
        }
        else
        {
            return View(model);
        }
    }

So if you click the "View History" button, when the controller is hit postFunction="View History".

I need to submit the form from Javascript for another reason other than a button press. I have the Javascript to submit the form, but how do I pass a parameter?I'm trying to get postFunction to have a value such as "Changed Page" when the controller is reached.

    $("#txtPage").kendoNumericTextBox({
    change: function () {
        $("#formLabApprovals").submit();
    }
    });

No Refunds No Returns · Accepted Answer · 2016-06-08 20:39:30Z

4

Often one will put script-supplied values in a hidden field so they flow through to your controller but are invisible to the user. Set the field's value in your existing script.

answered Jun 8, 2016 at 20:39

No Refunds No Returns

8,4464 gold badges36 silver badges44 bronze badges

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

Comments

Community · Accepted Answer · 2017-05-23 12:18:32Z

1

You can use the .val(*value*) method to assign the value attribute programmatically.

$("#txtPage").kendoNumericTextBox({
change: function () {
    $("#formLabApprovals").val("Changed Page");
    $("#formLabApprovals").submit();
} });

jQuery(#id).val() VS getElementById(#id).value is another article with some related information about using .val().

edited May 23, 2017 at 12:18

CommunityBot

11 silver badge

answered Jun 8, 2016 at 20:59

Benjamin Smith

112 bronze badges

Comments

Community · Accepted Answer · 2017-05-23 10:29:00Z

1

This is similar to both the other answers, but I thought I'd post this as well. It's what I finally did to get it to work. I found this page that was helpful: jQuery - add additional parameters on submit (NOT ajax).

var input = $("<input>")
    .attr("type", "hidden")
    .attr("name", "postFunction").val("ChangePage");
$('#formLabApprovals').append($(input));
$("#formLabApprovals").submit();

edited May 23, 2017 at 10:29

CommunityBot

11 silver badge

answered Jun 9, 2016 at 12:15

boilers222

2,0199 gold badges40 silver badges84 bronze badges

1 Comment

Alan Over a year ago

I know it's an older post, but it still keeps on giving. Thanks for the rewrite.

Collectives™ on Stack Overflow

How do I pass a parameter when submitting an form in javascript to a MVC controller?

3 Answers 3

Comments

Comments

1 Comment

Your Answer

Linked

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

Linked

Related