Jquery UI Dialog Post to ASP.Net MVC Controller Action

Question

I have an MVC view that contains a JQuery UI dialog that can be opened and populated with data.

<div id="dialog">
.... Table of phone numbers
</div>
<div id="personData">
... Person model data
</div>

I am attempting to pass the data from the JQuery UI dialog along with the rest of the MVC View data to a controller action.

public ActionResult Save(Person person, List<PhoneNumber> phoneNumbers)
{
}

In this example the Person type is not part of the dialog and is posted fine. The phone numbers is in the div of the JQuery UI dialog and does not post.

The elements in the dialog are defined in the View and can be seen in the DOM but for some reason something is preventing the data to post along with the rest of the View data. If I remove the .dialog() declaration from the the "dialog" div (now the div is visible on the form), the data (phoneNumbers) will post.

So my question is how do you post the JQuery UI dialog data along with the View data from the form to a controller action? (I know how to post the UI dialog data using a button within the dialog, but I need to post it alongside my main View because of the state issues around this data).

Please put line breaks in your question and provide some code of what you've done and what your html page looks like. — Omar
– Omar, Commented Nov 18, 2009 at 4:35

stimms · Accepted Answer · 2009-11-18 06:18:48Z

4

Chances are the dialog box moves the div outside of the form so the fields aren't submitted. You might just link the fields to hidden ones outside of the div or increase the span of the form.

answered Nov 18, 2009 at 6:18

stimms

44.3k31 gold badges103 silver badges154 bronze badges

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

Comments

Chaddeus · Accepted Answer · 2009-11-18 06:47:32Z

2

Just as stimms said, you will need to put the data into some fields inside the form you'll be submitting to the action.

Do something like this inside the dialog click function (using jQuery .val())

$("#formFieldName").val() = $("#dialogFieldName").val();

Repeat this for each field.

After that, the fields (probably hidden fields) inside your form will contain the data when you submit the form.

answered Nov 18, 2009 at 6:47

Chaddeus

13.4k30 gold badges109 silver badges167 bronze badges

Collectives™ on Stack Overflow

Jquery UI Dialog Post to ASP.Net MVC Controller Action

2 Answers 2

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related