asp.net-mvc - 如何在ajax调用后更改特定按钮值

Question

我有一个项目列表，每个项目上都有按钮。当我单击该按钮时，我会进行服务器调用，在调用之后我需要更改按钮文本。所以我写这个函数来ajaxify调用:

$('.form').ajaxForm({
            beforeSubmit: function () {                
            },
            success: function (result) {
                $('.itemHoverBox').attr('value', 'Confirmed');
            },
            error: function (xhr, textStatus, errorThrown) {           
            }
        });

这是操作按钮:

@using (Html.BeginForm("Confirm", "Products", new { productId = @t.ProductId }, FormMethod.Post, new { @class="form"}))
{
<input style="width: 60px;" class="itemHoverBox button white" type="submit" value="Confirm" />
}

但这会更改页面上的所有itemHoverBox，而我正在尝试的只是更改我单击的按钮。就像您在 stackoverflow 上单击最喜欢的问题星号时一样。
我的操作方法暂时返回 void:

[HttpPost]
        public void CollectTicket(int ticketId)
        {
            ...           
        }

Answer 1

您可以在闭包中捕获表单:

$('.form').each(function() {
    var form = $(this);
    form.ajaxForm({
        success: function (result) {
            form.find('.itemHoverBox').attr('value', 'Confirmed');
        }
    });
});

或者使用context参数甚至更简洁:

$('.form').each(function() {
    var form = $(this);
    form.ajaxForm({
        context: form,
        success: function (result) {
            // Here this will equal to the context object we specified
            this.find('.itemHoverBox').attr('value', 'Confirmed');
        }
    });
});