CODEWITHSUNDEEP
c#jqueryasp.net-mvc-3
InfoLearner
InfoLearner

Reputation: 15598

JQuery MVC3 How do I pass a parameter from a button submit and get the action result back

I have a form that has a combo box and a div underneath it. It has show and delete buttons next to combo box.

When someone selects an item in the combo box and then click on the Show button, I want the button to call an action in the controller and pass the selected value of combo box to the action. I then want it to load the view in the viewDiv div.

For example:

<input type="submit" value="Show" onclick="alert($('#SelectedId').val(););" />
<div id="viewDiv"/>

I want onclick to call a action in controller and pass the Id = $('#SelectedId').val(); and then populate the viewDiv with the contents of the view.

Please guide as I am very stuck

Upvotes: 0

Views: 475

Answers (2)

JBoothUA
JBoothUA

Reputation: 3149

There are a lot of different ways you can accomplish this.

I would recommend wrapping all of your fields in a form. Then if you submit the form, your action can be called and any data on the form can be returned.

@using (Html.BeginForm("Login", "Account")

In MVC talk, you can use something like this to call a Login action on an Account controller. This is the equivalent to

<form action="/Account/Login">
</form>

Now you can submit this form with jQuery or with a input type=submit button, etc.

The key to getting your variable to the action function would be to just name the combo box id the exact same name as the variable.

You can also return the entire model that's on the page by having the model's class as the class you are expecting

 public ActionResult Login(LoginModel model);

You can also pass in custom variables:

@using (Html.BeginForm("Login", "Account", new { ReturnUrl = ViewBag.ReturnUrl }

and 

public ActionResult Login(string returnUrl);

Upvotes: 0

epignosisx
epignosisx

Reputation: 6192

Try this. Assuming your submit button has an id = "btn" this should work:

$("#btn").bind("click", function(e){
    e.preventDefault();
    $("#viewDiv").load("yoururl", { id = $("#SelectedId").val() });
});

Upvotes: 1

Related Questions