Question

用户更新的唯一字段是 QuantityDelivered ，然后用户点击“接受”按钮以通过Ajax更新在文本框和ShoeOrderItem中输入的数字。

@for (int i = 0; i < Model.ShoeOrderItemList.Count(); i++)
{
<tr>
    <td class="text-center">
        @Html.HiddenFor(model => Model.ShoeOrderItemList[i].ShoeOrderItemId)
        @Html.DisplayFor(model => Model.ShoeOrderItemList[i].ShoeOrderItemId)
    </td>
    <td class="text-center">
        @Html.DisplayFor(model => Model.ShoeOrderItemList[i].LineItemTotal)
    </td>
    <td class="text-center">
        @Html.DisplayFor(model => Model.ShoeOrderItemList[i].ShoeSize.Size)
    </td>
    <td class="text-center">
        @Html.DisplayFor(model => Model.ShoeOrderItemList[i].Shoe.ManufacturingCost)
    </td>
    <td class="text-center">
        @Html.DisplayFor(model => Model.ShoeOrderItemList[i].Quantity)
    </td>
    <td class="text-center">
        @Html.DisplayFor(model => Model.ShoeOrderItemList[i].QuantityOutstanding)
    </td>
    <td>
        @(Html.Bootstrap().TextBoxFor(m => m.QuantityDelivered)
          .Placeholder("Quantity Delivered ")
          .Prepend("#").Append(Html.Bootstrap()
          .Button().Text("Accept").Id("AcceptItem")))
    </td>
</tr>
}

Ajax

$("#AcceptItem").click(function() {
  var quatntity = @Html.Raw(Json.Encode(Model.QuantityDelivered))
  $.ajax({
     url: "ShoeOrder/CreateShoeDelivery",
     type: "GET",
     data: {
            shoeOrderItemId: shoeOrderItemId[i],
            quantityDelivered: quatntity,
            dataType: "html"
        }
    });
});

我只想用ActionResult调用用户在点击按钮AcceptItem时输入的值。

Answer 1

我只想使用输入的值调用ActionResult 用户点击按钮AcceptItem。

遵循此解决方案 -

说你有以下表格。请为输入字段提供正确的ID，并注意我进行了POST操作。

<script src="~/Scripts/jquery-1.10.2.min.js"></script>

<script>
    function submitForm() {

        jQuery.ajax({
            type: "POST",
            url: "@Url.Action("Submit")",
            dataType: "json",
            contentType: "application/json; charset=utf-8",
            data: JSON.stringify({ name: $("#quantity").val() }),
            success: function (data) {
                alert(data.Name);
            },
            failure: function (errMsg) {
                alert(errMsg);
            }
        });
    }
</script>

<input type="text" id="quantity"/>
<input type="button" value="Click" onclick="submitForm()" />

点击按钮会点击提交操作 -

    public ActionResult Submit(string name)
    {
        return Json(new Person() { Name = name + " Its Me" });
    }

并且操作将简单地返回Person的简单对象（我将其用于示例目的）。

public class Person
{
    public string Name { get; set; }
}

现在当你点击按钮 -

enter image description here

如果你想进行GET操作，那么JQuery代码应该是这样的 -

jQuery.ajax({
    type: "GET",
    url: "@Url.Action("Submit")" + "/" + $("#quantity").val(),
    dataType: "json",
    contentType: "application/json; charset=utf-8",
    data: "", //JSON.stringify({ name: $("#quantity").val() }),
    success: function (data) {
        alert(data.Name);
    },
    failure: function (errMsg) {
        alert(errMsg);
    }
});

}

不要忘记将AllowGet添加到JsonResponse -

    public ActionResult Submit(string id)
    {
        return Json(new Person() { Name = id + " Its Me" }, JsonRequestBehavior.AllowGet);
    }

使用ajax使用文本框中的值调用ActionResult。

1 个答案: