Question

我试图了解Jquery Ajax方法的工作原理。现在，我在控制器中调用ActionResult方法时会遇到一些问题，该方法将返回PartialView。

创建了一个按钮，我将使用该按钮从服务器获取新数据（应运行Ajax调用）

代码:(家庭控制器中的ActionResult）

public ActionResult All()
    {
        List<Student> model = db.Students.ToList();

        return PartialView("_Student", model);
    }

当我在主索引视图中按下按钮时，我正试图调用此方法。

代码:(索引视图）

<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>

当用户点击按钮时，应运行Ajax调用，列表将显示在id = rooms的部分中。

脚本:( Ajax代码）

 $(document).ready(function () {
    $('#button1').click(function () {
        $.ajax({
            type: 'GET',
            url: @Url.Action("All", "Home"),
            datatype: "html",
            success: function () { 
                $('#rooms').html(???);
            }
        });
        return false;
    });
});

你们有没有人能够看到我是否忘记了像我所描述的这样的运动？

Answer 1

结果是成功事件。尝试：

$(document).ready(function () {
$('#button1').click(function () {
    $.ajax({
        type: 'GET',
        url: @Url.Action("All", "Home"),
        datatype: "html",
        success: function (data) { 
            $('#rooms').html(data);
        }
    });
    return false;
}); });

Answer 2

我建议您在单击按钮（启用控制台）时加载firebug，确保请求的URI响应click事件上的有效HTML数据。

我通常也会发现使用类似的东西：

$('#button1').on('click', function () { ...

通常会产生更好的效果，请参见此处：Difference between .on('click') vs .click()

使用Jquery ajax在Controller中调用ActionResult方法并返回数据

2 个答案: