Question

我使用以下代码来实现排序：

<button type="button" class="btn btn-default @(Model.SortOrder.Trim().ToUpper().Equals("NAME") ? "active" : "")">
    @Ajax.ActionLink("Name", "Cause", "Search", new { query = Model.Query, category = Model.Category, pageNumber = 0, sortOrder = "NAME", sortDirection = "ASCENDING" }, new AjaxOptions() { UpdateTargetId = "SearchCauseSelfWidgetContent", InsertionMode = InsertionMode.Replace, OnSuccess = "PostAjaxLoad()" })
</button>

正如您所料，当我单击按钮内的文本时，它可以正常工作，但如果我点击其他任何地方（按钮边界和文本之间的填充），它就不会做任何事情。

由于ajax方法似乎没有Url.帮助器，并且没有Ajax.ButtonLink，所以我对如何在此ajax调用中包装整个按钮感到有点迷失。< / p>

Answer 1

我很厚。在这种情况下（使用Bootstrap类）我只需要将class es "btn btn-default"按钮添加到我的ActionLink的{{1}}：

@class

Answer 2

拉出ajax呼叫并将其绑定到按钮上

$('.btn-default').on('click', function () {
    $.ajax({
        type: 'POST',
        url: '@Url.Action("Action", "Controller")',
        data: {
            query: '@Model.Query',
            category: '@Model.Category',
            etc...
        },
        cache: false,
        async: true,
        success: function (data) { 
            $('#SearchCauseSelfWidgetContent').html(data);
        }


    });
});

将整个按钮链接到它包含的Ajax.ActionLink

2 个答案: