Question

我正在开发一个MVC应用程序，我ActionLink edit将特定行转换为文本框，而save ActionLink则显示为Edit在那一行上，但是当我进行更改并点击save时数据未保存在数据库中时，我只看到旧数据。

jQuery代码：

<script type="text/javascript">
    $(document).ready(function () {
        function toggleEditability() {
            $(this).closest('tr')
                   .find('a.Edit, a.Save, .displayText, input[type=text]')
                   .toggle(); 
        }

        $('a.Edit').click(toggleEditability);

        $('a.Save').click(function () {
            toggleEditability.call(this);
            var url = $(this).attr('href');
            $(this).load(url);
        });
    });
</script>

chtml代码：

<table>
        <tr>
            @*<th>
                @Html.Label("ID")
            </th>*@
            <th>
                @Html.Label("Name")
            </th>
            <th>
                @Html.Label("Description")
            </th>
            <th>
                 @Html.Label("Date")
            </th>
            <th></th>
        </tr>

    @foreach (var item in Model)
    {
        if (Convert.ToDateTime(item.Holiday_date).Year.ToString() == DateTime.Now.Year.ToString())
        {
            <tr>
           @* <td>
                @Html.TextBoxFor(modelItem => item.Holiday_Id, new { style = "display: none; width:170px; height:15px" })
                <div class="displaytext">
                    @Html.DisplayFor(modelItem => item.Holiday_Id)
                </div>
            </td>*@
            <td>
                @Html.TextBoxFor(modelItem => item.Holiday_Name, new { style = "display: none; width:170px; height:15px" })
                <div class="displaytext">
                    @Html.DisplayFor(modelItem => item.Holiday_Name)
                </div>
            </td>
            <td>
                @Html.TextBoxFor(modelItem => item.Holiday_Description, new { style = "display: none; width:170px; height:15px" })
                <div class="displaytext">
                    @Html.DisplayFor(modelItem => item.Holiday_Description)
                </div>
            </td>
            <td>
                @Html.TextBoxFor(modelItem => item.Holiday_date, new { style = "display: none; width:170px; height:15px" })
                <div class="displaytext">
                    @Html.DisplayFor(modelItem => item.Holiday_date)
                </div>
            </td>
            <td>
               @Html.ActionLink("Edit", "Edit", new { id = item.Holiday_Id }, new { @class = "Edit", Href="#" })
               @Html.ActionLink("Save", "Save", new { id = item.Holiday_Id}, new { @class = "Save", Href = "#", style = "display:none" } ) |
               @Html.ActionLink("Delete", "Delete", new { id = item.Holiday_Id }, new { @class = "lnkDelete" })
               @Html.ActionLink("Cancel", "Cancel", new { id = item.Holiday_Id}, new { @class = "Cancel", Href = "#", style = "display:none" } )
            </td>
        </tr>
        }

    }

    </table>

编辑控制器代码：

[HttpGet]
        public ActionResult Edit(int id = 0)
        {
            tbl_HolidayList tbl_holidaylist = db.tbl_HolidayList.Find(id);
            if (tbl_holidaylist == null)
            {
                return HttpNotFound();
            }
            return PartialView(tbl_holidaylist);
        }

        //
        // POST: /Holiday/Edit/5

        [HttpPost]
        public ActionResult Edit(tbl_HolidayList tbl_holidaylist)
        {
            if (ModelState.IsValid)
            {
                db.Entry(tbl_holidaylist).State = EntityState.Modified;
                db.SaveChanges();
                TempData["Msg"] = "Data has been updated succeessfully";
                return RedirectToAction("Index");
            }
            return PartialView(tbl_holidaylist);
        }

有谁能告诉我我在哪里犯错误或者我必须在哪里做出改变？

Answer 1

发表评论：您正在使用GET向服务器发出.load个请求。这不会发送任何变化。您需要使用$.ajax POST请求（同时发送相应的data属性）发送更改。

e.g。像这样的东西（不是确切的，但给你的想法）：

    $('a.Save').click(function () {
        toggleEditability.call(this);
        // Remember the element clicked
        var $element  $(this);
        // Get all the data from the nearest form
        var data = $(this).closest('form').serialize();
        // Get the URL from the form
        var url = $(this).attr('href');
        $.ajax({
            url: url,             // Url to send request to
            data: data,           // Send the data to the server
            type: "POST",         // Make it a POST request
            dataType: "html",     // Expect back HTML
            success: function(html){
                $(element).html(html);       // On success put the HTML "somewhere" (not sure where at this point)
            });
        });
    });

另一个问题是您的观点。您无法使用foreach循环渲染包含重复项的表单。这没有为EditorFor类型方法提供足够的信息来呈现索引（允许它唯一地命名项）。您需要使用简单的for循环：

例如

  for (int i = 0; i < Mode.Length; i++){
  {
       @Html.TextBoxFor(modelItem => Model[i].Holiday_Id, new { style = "display: none; width:170px; height:15px" })
       [snip]
  }

使用jQuery更新数据 - MVC

1 个答案: