MVC 3表单提交通过JQuery重新加载提交视图没有查看返回的控制器

我是新来的MVC/Jquery和我有问题。我有一个包含WebGrid的表单，每行都有编辑/删除锚点。当用户点击编辑时，我需要运行一些脚本来加载控制器需要的json对象，然后再返回编辑视图。使用提交按钮可以正常工作，但是当我尝试通过Ajax发布时，编辑视图永远不会出现，网格中的表单会重新加载。MVC 3表单提交通过JQuery重新加载提交视图没有查看返回的控制器

形式

@using (Html.BeginForm(null, null, FormMethod.Post, new { id = "shopform" })) 
{ 
    <div id="grid" class="gridWrapper1"> 
    </div> 
}

脚本

 function EditShop(id) { 
       idShop = id; // save id for json scraper later 
       $("#shopform").submit(); 
       return 0; 
     } 

     $(document).ready(function() { 
      $("#shopform").submit(function(){ 
       var jsonData = GetJsonModel(); // grabs various fields including idShop 
       $.ajax({ 
        type:'POST', 
        url:'/Admin/Shops/Edit/', 
        data: jsonData, 
        contentType: 'application/json; charset=uft-8', 
        error: ajaxError, 
////// edit with solution here 
        success: function(data) { 
         $(document)[0].body.innerHTML = data; // contains View returned by 
        }           // controller action 
       }); 
       return false; 
      }); 
     });

控制器代码建立与编辑网格列/删除锚标签：

grid.Column(format: (item) => 
    { 
     return new HtmlString(
      "<a href='JavaScript:void(0)' name='editShop' value='" + 
       item.ShopID.ToString() + 
       "' class='linkbutton' " + "onclick='EditShop(" + item.ShopID.ToString() + 
       ");'>Edit</a>&nbsp;&nbsp;&nbsp;" + 
      "<a href='JavaScript:void(0)' name='delShop' value='" + 
       item.ShopID.ToString() + 
       "' class='linkbutton' onclick='DelShop(" + 
       item.ShopID.ToString() + ");'>Remove</a>" 
     ); 
}),

终于为PRG控制器行动编辑：

[HttpPost] 
[ActionName("Edit")] 
[ViewModelFilter(Param = "model", JsonDataType = typeof(ShopsViewModel))] 
public ActionResult EditViaPost(ShopsViewModel model) 
{ 
    int nid = model.ShopID; 
    ShopViewModel shop = new ShopViewModel(nid); 
    Session["model"] = (object) model; 
    return RedirectToAction("Edit", new RouteValueDictionary(new { shop.Name })); 
} 

[HttpGet] 
[ActionName("Edit")] 
public ActionResult EditViaGet(string slug) //, string curPage, string rowsPerPage) 
{ 
    ShopsViewModel model = (ShopsViewModel)Session["model"]; 
    ShopViewModel shop = null; 
    if (model != null) 
    { 
     int nID = model.ShopID; 
     ShopViewModel shop = new ShopViewModel(nID); 
    } ... // create empty shop omitted for brevity 

    return View("Edit", shop); <--- THIS DOES NOT LOAD IF SUBMITTING VIA AJAX 
}

如果我将控制器/操作添加到表单声明并使用按钮提交，编辑视图会呈现，所以我怀疑我没有正确处理$ .post的返回值，但我需要返回的不仅仅是这就是为什么我使用JSON的ID。

来源

2011-06-13 StuTheDog

当你使用AJAX后，会发生什么？哪个控制器操作受到影响？什么是动作参数？它们是你期望它们是什么？ – 2011-06-13 15:29:48

@ NickLarsen - 后操作被击中，参数是由ViewModelFilter构建的模型。然后控制转到get操作，它返回View（“Edit”，），但该视图不加载，而是调用视图保持不变。 – StuTheDog 2011-06-13 15:38:36

找到它 - .post在成功电话中收到新视图，请参阅上面的编辑 – StuTheDog 2011-06-13 16:11:49

没有任何事情发生，因为您没有在Ajax调用中定义的成功回调来处理控制器返回的数据。您的视图将在成功处理程序中返回。

$("#shopform").submit(function(){ 
    var jsonData = GetJsonModel(); // grabs various fields including idShop 
    $.ajax({ 
     type:'POST', 
     url:'/Admin/Shops/Edit/', 
     data: jsonData, 
     contentType: 'application/json; charset=uft-8', 
     success: function(yourView) { 
      alert(yourView); 
     }, 
     error: ajaxError 
    }); 
    return false; 
});

来源

2011-06-13 16:10:52

您在Craig发现了，我发现了同样的事情，并且在您发布以下内容时回复我的帖子:-)。 – StuTheDog 2011-06-13 16:21:47

为了简化克雷格M的答案 -

$('#shopForm').submit(function(){ 
var jsonData = GetJsonModel(); // grabs various fields including idShop 
$('#shopform).load('Admin/Shops/Edit #shopform' 
,jsonData 
,function(responseText, textStatus, XMLHttpRequest) { 
      if(textStatus == "error") ajaxError(); 
}

来源

2011-06-13 16:20:29

MVC 3表单提交通过JQuery重新加载提交视图没有查看返回的控制器

回答

相关问题