如何将json对象从jquery传递到mvc视图

目前，我有一个列表视图中显示的所有待办事项列表项的列表。我还为列表中的每一行放置了Edit超链接。当我点击编辑时，我使用jquery异步调用编辑操作，并希望显示带有在列表视图页面底部选择的编辑视图。如何将json对象从jquery传递到mvc视图

下面是List.cshtml代码 -

@using MvcToDoListItemsDemo.ViewModels 
@model TodoListViewModel 

<table> 
<thead> 
    <tr> 
     <th></th> 
     <th></th>   
     <th>TodoItem</th> 
     <th>Is Completed?</th> 
     <th>Target Date</th> 
     <th>Created Date</th> 
     <th>Completed Date</th> 
    </tr> 
</thead> 
<tbody>   
    @foreach (var item in Model.TodoListItems) 
    { 
     <tr>     
      <td>@Html.ActionLink("Edit", "Edit", new { id = item.Id }, new { @class = "edit", @id=item.Id })</td> 
      <td>@Html.ActionLink("Delete", "Delete", new { id = item.Id }, new { @class="delete", @id=item.Id })</td>     
      <td>@item.ActivityDescription </td> 
      <td>@item.IsCompleted </td> 
      <td>@item.ActivityDeadLine </td> 
      <td>@item.CreatedDate </td> 
      <td>@item.CompletionDate </td> 
     </tr>    
    }     
</tbody>  
</table>  
}

下面是编辑动作 -

public class TodoListController : Controller 
{ 
    [HttpGet] 
    public JsonResult Edit(int Id = 0) 
    {    
     var Item = _dbContext.TodoList.Find(Id); 
     if (Item == null) 
     { 
      return Json("No Data Found", JsonRequestBehavior.AllowGet); 
     } 
     else 
     {     
      return Json(Item,JsonRequestBehavior.AllowGet); 
     }    
    } 

    [HttpPost] 
    [ValidateAntiForgeryToken]   
    public ActionResult Edit(TodoListModel listItem) 
    {    
     TryUpdateModel(listItem); 
     if (ModelState.IsValid) 
     { 
      _dbContext.Entry<TodoListModel>(listItem).State = System.Data.EntityState.Modified; 
      _dbContext.SaveChanges(); 
      return RedirectToAction("Index"); 
     } 
     else return View(listItem);    
    } 
}

下面是将调用上述[HTTPGET]编辑动作asynchornously

的JavaScript

function OnEditClick(e) { 
var Id = e.target.id; 
if (Id != null) { 
    $.ajax({ 
     url: '/TodoList/Edit', 
     type: 'GET', 
     data: {Id: Id}, 
     dataType: 'json', 
     contentType: 'application/json; charset=utf-8', 
     success: function (result) {     
      //How to pass Json result to below Edit View. 
     }, 
     error: function() { alert('Error!'); } 
    }); 
} 
}

以下是Edit.cshtml局部视图

<h2>Edit</h2> 

<fieldset> 
    <legend>TodoListModel</legend> 

    @Html.LabelFor(model => model.ActivityDescription) 
    @Html.EditorFor(model => model.ActivityDescription) 

    @Html.LabelFor(model => model.IsCompleted) 
    @Html.CheckBoxFor(model => model.IsCompleted) 

    @Html.LabelFor(model => model.ActivityDeadLine) 
    @Html.EditorFor(model => model.ActivityDeadLine) 

    <p> 
     <input type="submit" value="Save" /> 
    </p> 
    </fieldset>

所以我的问题是 - 我们如何通过将异步调用[HttpGet] Edit动作获得的Json结果传递给Edit.cshtml？

请指教。可能吗？

来源

2014-12-13 ram sudheer

真的不明确你想要的响应数据做什么 – charlietfl 2014-12-13 13:43:26

你的AJAX请求返回JSON到'$ .ajax'回调，这是罚款。所以如果你设法调用Edit.cshtml，你想用生成的HTML做什么？您可能想要忘掉JSON并执行类似'return PartialView（“Edit”，Item）;'所以您可以在ajax响应中获得HTML并使用它来填充'div'或其他东西。 – Rhumborl 2014-12-13 13:43:41

我的观点是我想重用Edit.cshtml。如果我们在javascript函数内部对html进行硬编码，那么它不能在我的项目中的其他任何地方重用。那么，是否可以将JSON结果转换为C＃Model，并将Model对象从Jquery本身传递给Edit action？ – 2014-12-13 13:50:51

我已经使用下面的代码解决了它。

@Ajax.ActionLink("Edit", "Edit", "TodoList", new { Id = item.Id }, new AjaxOptions 
      { 
       UpdateTargetId = "EditView", 
       HttpMethod = "Get"     
      }) 

and return PartialView("Item"); from the controller action.

来源

2014-12-13 23:50:24

如何将json对象从jquery传递到mvc视图

回答

相关问题