在提交时传递 ajax 表单 ID

Question

我在页面上有多个包含相同元素的 ajax 表单，我有 jquery 函数来搜索表单和更新的子元素，但我需要以某种方式传递向控制器发送请求的表单的 ID 以及其他值从形式来看，最好的方法是什么？也许将隐藏字段添加到表单并在页面加载时获取 parentid 并使用 jQuery 将其放在此字段中。但我不知道 jquery 能很好地做到这一点。

@using (Ajax.BeginForm("Index", "Controller",new AjaxOptions { OnFailure = "error", OnSuccess ="sucess" }))
           {
                <input type="submit" name="value" class="up" value="1" />
                <span class="result">0</span>
                <input type="submit" name="value" class="down" value="-1" />
           }


 public ActionResult Index(int value ,string formID)
        {
           //do something
        }

function sucess(arg) {

        var json = $.parseJSON(arg.responseText);

        var form = $("form#" + json.FormID);

        var up = form.children('input.up');

        var down = form.children('input.down');

        form.children('span.result').replaceWith(json.Result);

        if (json.Result == 1) {

            up.addClass('active');

        }

        if (json.Result == -1) {

            down.addClass('active');

        }
    }

更新：这是加载 n 次的部分视图，因此在页面在浏览器中呈现之前我无法找到 formID。

Answer 1

你可以给你的表单一个唯一的 id 并将这个 id 传递给回调：

@{
    var formId = Guid.NewGuid().ToString();
}
@using (Ajax.BeginForm("Index", "Controller", null, new AjaxOptions { OnFailure = "error", OnSuccess = string.Format("success(data, '{0}')", formId) }, new { id = formId }))
{
    <input type="submit" name="value" class="up" value="1" />
    <span class="result">1</span>
    <input type="submit" name="value" class="down" value="-1" />
}

现在在 success 函数中，您将能够获取服务器返回的 JSON 结果和表单的 id：

function success(json, formId) {
    // Remark you don't need to call $.parseJSON here.
    // inside the success callback the first argument will already
    // represent a parsed object that you can use directly. This obviously
    // assumes that your controller action returns JSON:
    // return Json(new { Result = 1 });

    var form = $("#" + formId);
    var up = form.children('input.up');
    var down = form.children('input.down');
    form.children('span.result').replaceWith(json.Result);
    if (json.Result == 1) {
        up.addClass('active');
    }
    if (json.Result == -1) {
        down.addClass('inactive');
    }
}