AJAX发布到视图中的更新列表

时间:2013-11-14 23:12:52

标签: ajax list

我的模型中有一个List。视图与模型绑定。我试图通过ajax填充List。然后我在表单上有一个“提交”按钮,应该提交整个模型。在提交整个模型时,列表值为“null”??

我通过Json从控制器获取响应数据。响应数据未绑定到模型。

<table id="tblTable" style="border-width:1px;border-style:solid" >
        <tr style="border-width:1px;border-style:solid">
            <th>
                @Html.Label("Col1")
            </th>
            <th>
                @Html.Label("Col2")
            </th>
        </tr>
        <tbody>
        @if (Model != null && Model.Operations!= null && Model.Operations.Count > 0)
        {
            foreach (var item in Model.Operations)
            {
                <tr style="border-width:1px;border-style:solid">
                    <td style="border-width:1px;border-style:solid">
                        @Html.DisplayFor(modelItem => item.Col1)
                    </td>
                    <td style="border-width:1px;border-style:solid">
                        @Html.DisplayFor(modelItem => item.Col2)
                    </td>
                </tr>
            }
        }
       </tbody>
    </table>

我的控制器响应了ajax请求:

[HttpPost]
    public JsonResult UploadFile(HttpPostedFileBase file, Model model)
    {
         //extract file contents into the operations list
    model.Operations = new List<Operations>();
    model.Operations.Add(blah..blah)
      return Json(model);
    }

问题是,我必须通过ajax填充列表,但是发布完整的模型以及ajax检索的数据。

更新:JS CODE:

$(document).ready(function(){

    $('#fileupload').fileupload({

        dataType: 'json',
        url: '/Summary/UploadFile',
        autoUpload: true,

        done: function (e, data) {
            var operations = data.result.Operations;
            var tbl = $('#tblTable');
            $.each(operations, function (key, val) {                                    
                $('<tr><td>' + val.col1 + '</td>' + '<td>' +               
                  val.col2 + '</td><tr>').appendTo(tbl);
            });          
        }
    }).on('fileuploadprogressall', function (e, data) {
        var progress = parseInt(data.loaded / data.total * 100, 10);
        $('.progress .progress-bar').css('width', progress + '%');
    });
});

0 个答案:

没有答案