Title: MVC Form with PartialViewResult on submit, doesn't post the data in the PartialViewResult
Tags: model-view-controller;submit
Question: I am learning mvc and jquery. Requirmeent => There are "Categroies". Each categories can have a list of "Tasks".  User should be able to resort the "Tasks" as he wishes by drag-drop and save to the db.

The form that I am working on contains the following


A list of Categories displayed in a  element. When the user selects a list item
an ajax request is made to get the list of "Tasks"
A list of Tasks displayed in a  list.
A button to save the changes


I am able to implement all of the functionality including displaying categories, getting tasks and resorting. But the Save part is not working. When the form posts, I don't see the data for the Tasks in the FormCollection.

Here is the html.

```@using (Html.BeginForm("Settings", "Settings", FormMethod.Post, new { id = "formSettings" }))
{
<div style="width: 100%; background-color: Aqua; vertical-align: top"&gt;
    <div style="width: 50%; text-align: right; vertical-align: top; float: left; display: block;
        height: 300px;"&gt;
        <select id="listSettings"  name="listSettings" style="width:200px;height:280px;text-align:left;" size="@Model.Categories.Count()"  data-tasks="@Url.Action("GetTasks", "Settings", new { })"&gt;
            @foreach (string category in @Model.Categories)
            {
                <option title="category"  value="@category"&gt;@category</option&gt;
            }
        </select&gt;
    </div&gt;
    <div id="taskListId" style="display: block; width: 30%; float: left; height: 300px;"&gt;
        This will be replaced
    </div&gt;
</div&gt;
<div style="text-align: center; width: 100%"&gt;
    <input type="submit" id="btnSubmit" title="Save" value="Save" /&gt;
</div&gt;
} 
```

The ```<div id="taskListId".../&gt;``` above will be replace by ajax call to the server. Here is the partialviewresult html

```<div id="taskListId" style="display: block; width: 30%; float: left; height: 300px;"&gt;
    <ul id="sortable" style="height: 280px;"&gt;
        @foreach (string s in Model)
        {
            <li class="ui-state-default"&gt;<span class="ui-icon ui-icon-arrowthick-2-n-s"&gt;</span&gt;@s</li&gt;
        }
    </ul&gt;
</div&gt;
```

When the form is submitted, why is it the FormCollection contain just 1 key "listSettings", but not the "sortable"? 

Please let me know if I am doing something wrong.

Thanks,
Ravi.



Here is another answer: I figured a way to do that. Actually form post will not have ```<ul&gt;``` data in it.  ```<ul&gt;``` doesn't have a name attribute attached to it. so I wont find in form post data.

I solved the issue by using jquery to find the ```<ul&gt;``` and ```<li&gt;``` items and attaching them as name value pair to the form post data. Then I posted the data using ajax.


{'source': 'StackExchangeDataset', 'subset': 'stackoverflow.com', 'metadata': {'AnswerCount': 1, 'CommentCount': 0, 'ContentLicense': 'CC BY-SA 3.0', 'CreationDate': '2012:00:01/17/12', 'FavoriteCount': None, 'PostTypeId': 1, 'Tags': '<model-view-controller><submit>', 'Title': "MVC Form with PartialViewResult on submit, doesn't post the data in the PartialViewResult", 'ViewCount': 354, 'id': 8895776, 'user_AboutMe': None, 'user_AccountId': 382844.0, 'user_DisplayName': 'user738338', 'user_Reputation': 33.0, 'user_Views': 12.0, 'user_id': 738338.0}}