Question

所以我在这里面临一个问题。我有一个按钮，我想要一个方法运行。我在那里看到我在这里使用Ajax的例子是我的代码。

这是我第一次尝试

<button type="button" class="btn-xs btn-link reputation-buttons votes_manager increase" onclick="location.href='@Url.Action("MessageReputationUp", "Forum", new { groupId = Model.GroupId, threadId = Model.ThreadId, messageId = Model.Id })';return false;" disabled>
                        <span class="glyphicon glyphicon-arrow-up"></span>
                    </button>

问题是这是一个URL，它会重定向我不想要的东西。所以我想出了这个。

<button type="button" class="btn-xs btn-link reputation-buttons votes_manager decrease" onclick="location.href='@Ajax.ActionLink(" " , "MessageReputationDown", "Forum", new { groupId = Model.GroupId, threadId = Model.ThreadId, messageId = Model.Id }, new AjaxOptions { HttpMethod = "POST" })';return false;">
                        <span class="glyphicon glyphicon-arrow-down"></span>
                    </button>

但它开始给我一些奇怪的文字。它会告诉我：＆＃34; ＆＃34;＆GT;什么都没有。我想要做的是在控制器中运行一个方法。没有页面做任何事情。因此，没有重新加载也没有重定向。

修改

也许我可以为声誉系统的代码提供更多的上下文。它看起来像这样：

    <button type="button" class="btn-xs btn-link reputation-buttons votes_manager increase" onclick="location.href='@Url.Action("MessageReputationUp", "Forum", new { groupId = Model.GroupId, threadId = Model.ThreadId, messageId = Model.Id })';return false;" disabled>
                        <span class="glyphicon glyphicon-arrow-up"></span>
                    </button>
                    <div style="padding-left:9px;" class="displayer">@Model.Reputation.ToString()</div>
                    <button type="button" class="btn-xs btn-link reputation-buttons votes_manager decrease" onclick="location.href='@Ajax.ActionLink(" " , "MessageReputationDown", "Forum", new { groupId = Model.GroupId, threadId = Model.ThreadId, messageId = Model.Id }, new AjaxOptions { HttpMethod = "POST" })';return false;" disabled>
                        <span class="glyphicon glyphicon-arrow-down"></span>
                    </button>

这段代码不是很多次复制的代码，而且已经有一些jquery脚本了

$(function () {

$(document).on('click', '.votes_manager', function () {
    var elem = $(this).parent().parent().children('.displayer');
    var value = parseInt(elem.text());
    if ($(this).hasClass('increase')) {
        ++value;
    }
    else {
        --value;
    }
    elem.text(value);
});

}）;

$（function（）{

$(document).on('click', '.votes_manager', function () {
    var elem1 = $(this).parent().parent().children('.increase');
    var elem2 = $(this).parent().parent().children('.decrease');
    elem1.prop('disabled', true);
    elem2.prop('disabled', true);
});

}）;

$（＆＃34; #credit＆＃34;）。点击（功能（e）{

e.preventDefault();
$.ajax({

    url: $(this).attr("href"), // comma here instead of semicolon   
    success: function () {
        alert("Value Added");  // or any other indication if you want to show
    }

});

}）;

Answer 1

您可以通过ajax重新加载您想要的部分，例如：

@using (Ajax.BeginForm("MessageReputationUp", "Forum", new { groupId = Model.GroupId, threadId = Model.ThreadId, messageId = Model.Id },
new AjaxOptions
{
    HttpMethod = "post",
    InsertionMode = InsertionMode.Replace, // this will substitute in way async ajax way (without refresh) 
    UpdateTargetId = "ElementToBeSubstituted" // like a table or div
}))
{
    <button type="submit" class="btn-xs btn-link reputation-buttons votes_manager increase">
        <span class="glyphicon glyphicon-arrow-up"></span>
    </button>    
}

我希望它有所帮助。

在你的控制器中你应该把它放在：

if (Request.IsAjaxRequest())
 {
    return PartialView("_EmployeeTable", model);
 }

此部分视图将是您的元素将被替换的内容。

Answer 2

尝试将模型值传递给javascript变量，然后使用Jquery ajax调用作为Querystring将值传递给控制器，如下所示。

<button type="button" class="btn-xs btn-link reputation-buttons votes_manager decrease" onclick="javascript: callController();return false;">
<span class="glyphicon glyphicon-arrow-down"></span></button>

<script>
var groupId ='@Model.GroupId';
var threadId ='@Model.ThreadId';
var messageId ='@Model.Id';

function callController(){
//call to controller
    $.ajax({
        type: "POST",
        url: '/Forum/MessageReputationDown?groupId='+groupId+'&threadId='+threadId+'&messageId='+messageId,
        dataType: 'html',
        contentType: false,
        processData: false,
        success: function (response) {
            alert(response);
        },
        error: function (error) {
           alert(error);
        }
    });
}
</script>

控制器

public class ForumController : Controller
{
    public ActionResult MessageReputationDown(string groupId,string threadId, string messageId)
    {
        return Json("success");
    }
}

使用按钮mvc调用方法而不重新设置

2 个答案: