Javascript 使用Jquery ajax调用Controller中的ActionResult方法并返回数据
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/33201617/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Using Jquery ajax to call ActionResult method in Controller and return data
提问by Mikkel
I'm trying to understand how the Jquery Ajax methods works. Right now, I have some problems calling the ActionResult method in the controller that will return a PartialView.
我试图了解 Jquery Ajax 方法的工作原理。现在，我在调用将返回 PartialView 的控制器中的 ActionResult 方法时遇到了一些问题。
Have created an button which I will use to get new data in from the server (Ajax call should run)
创建了一个按钮，我将使用它从服务器获取新数据（应该运行 Ajax 调用）
Code: (ActionResult in Home controller)
代码：（Home 控制器中的 ActionResult）
public ActionResult All()
{
List<Student> model = db.Students.ToList();
return PartialView("_Student", model);
}
This method is the one I'm trying to call when I press the button in the main Index view.
当我在主索引视图中按下按钮时，我试图调用这个方法。
Code: (Index view)
代码：（索引视图）
<div class="row">
<div class="small-12 column sbw-travel">
<h2>Travel</h2>
<div class="row">
<div class="small-12 columns">
<button id="button1" class="sbw-travel-button">Search</button>
</div>
</div>
<div class="small-12 sbw-travel-box" id="rooms">
</div>
</div>
</div>
When the user hit the button, an Ajax call should run, and the list will appear in the section with id=rooms.
当用户点击按钮时，应该运行一个 Ajax 调用，并且列表将出现在 id=rooms 的部分中。
Script: (Ajax code)
脚本：（Ajax 代码）
$(document).ready(function () {
$('#button1').click(function () {
$.ajax({
type: 'GET',
url: @Url.Action("All", "Home"),
datatype: "html",
success: function () {
$('#rooms').html(???);
}
});
return false;
});
});
Can any of you see if I have forgot something to make this run like I have described?
你们中的任何人都可以看看我是否忘记了像我描述的那样运行的东西吗？
回答by P. Frank
The result is on the succes event. Try:
结果是在成功事件上。尝试：
$(document).ready(function () {
$('#button1').click(function () {
$.ajax({
type: 'GET',
url: @Url.Action("All", "Home"),
datatype: "html",
success: function (data) {
$('#rooms').html(data);
}
});
return false;
}); });
回答by hughjidette
I would suggest loading firebug when you click the button (enable the console), make sure the requested URI is responding with valid HTML data on the click event.
我建议您在单击按钮时加载 firebug（启用控制台），确保请求的 URI 正在响应单击事件的有效 HTML 数据。
I also generally find using something like:
我通常也发现使用类似的东西：
$('#button1').on('click', function () { ...
usually yields better results, see here: Difference between .on('click') vs .click()
通常会产生更好的结果，请参见此处：Difference between .on('click') vs .click()
