Question

首先抱歉我的英语。

我不知道如何使用AJAX从模型上传元素（var nameData in）。我问了一个提示，这是代码：

查看：

<tbody>
    @foreach (var item in (Model.files))
    {

        <tr>
            <td>
                <h4>@item</h4>
            </td>
            <td>
                <input type="button" id="sendCodesToDB" class="btn btn-success" value="Insert codes in DB" />
            </td>
        </tr>
    }
</tbody>

和脚本：

<script>
$('#sendCodesToDB').on('click', function () {

    var nameData = //Here I am trying to put: @item.Name;

    $.ajax({
        url: '/Home/Foo',
        type: 'POST',
        dataType: 'json',
        cache: false,
        data: nameData,
        success: function (dataFromAction) {
            $('#idTextu').val(dataFromAction);
        }
    });
});
</script>

更新

我现在尝试应用您的提示，我的代码：

控制器：

    [HttpPost]
    public ActionResult InsertCodesToDB(string name)
    {
        cl.InsertCodesToDB(name);
        fl.MoveCodeFileToAccept(name);

        string response = "Test";
        return Content(response, "application/json");  
    }

查看：

<input type="button" class="btn btn-success sendCodesToDB" value="Insert Codes in DB" data-value="@item.Name"/>

脚本：

$('.sendCodesToDB').on('click', function () {

    var name = $(this).data("value");

    $.ajax({
        url: '/ActualCodes/InsertCodesToDB',
        type: 'POST',
        dataType: 'json',
        cache: false,
        data: name,
        success: function (response) {
             @(ViewBag.MessageOK) = response;
        },
        error: function () {
            onBegin;
        }
    });
});

但不幸的是，当前按下的按钮sendCodesToDB不起作用。我陷入了控制器并且没有调用Action。哪里有问题？

Answer 1

首先，你不应该在循环中使用相同的id。删除id属性并将id设为类，如下所示：

<input type="button" class="btn btn-success sendCodesToDB" value="Insert codes in DB" />

并改变你的javascript代码：

<script>
$('.sendCodesToDB').on('click', function () {

var nameData = $(this).parent().prev().text();

$.ajax({
    url: '/Home/Foo',
    type: 'POST',
    dataType: 'json',
    cache: false,
    data: JSON.stringify( { nameData :  nameData}),
    success: function (dataFromAction) {
        $('#idTextu').val(dataFromAction);
    }
   });
});
</script>

Answer 2

您可以创建隐藏的输入或数据属性，并从中获取值。

<input id="itemname" type="hidden" value="@item.name">

或

<div id="itemname" data-name="@item.name"></div>

你可以通过JQuery获得它的价值。

var nameData = $("#itemname").val();

使用data-atribute

var nameData = $("#itemname").data("name");

Answer 3

这样做的一种简单方法是将值（item.Name）作为数据属性添加到输入中。

<input type="button" id="sendCodesToDB" class="btn btn-success" value="Insert codes in DB" data-value="@item.Name" />

然后在jQuery中

var nameData = $(this).data("value");

我还建议在输入上使用类，因为具有相同Id的元素将无法正常工作。即。

<input class="sendCodesToDb" />

jQuery

$(".sendCodesToDb").on("click", function(){ ... });

Answer 4

您可以为此案例使用hidden输入并将其放在按钮之前，现在您将能够使用$(this).prev('.item_name').val()获取该隐藏输入的值：

＆＃13;

$('.sendCodesToDB').on('click', function () {

    var nameData = $(this).prev('.item_name').val();

    $.ajax({
        url: '/Home/Foo',
        type: 'POST',
        dataType: 'json',
        cache: false,
        data: nameData,
        success: function (dataFromAction) {
            $('#idTextu').val(dataFromAction);
        }
    });
});

＆＃13;

<tbody>
    @foreach (var item in (Model.files))
    {

        <tr>
            <td>
                <h4>@item</h4>
            </td>
            <td>
                <input class='item_name' type='hidden' value='@item.Name'>
                <input type="button" class="sendCodesToDB btn btn-success" value="Insert codes in DB" />
            </td>
        </tr>
    }
</tbody>

＆＃13;

此外，ID必须是唯一的，现在您的按钮上没有唯一的ID，我建议您在其上添加一个类并在单击时定位。我稍微改了你的代码来修复这个部分。

Answer 5

在jQuery Ajax调用

中传递数据时，应始终使用stringify

$。AJAX（{

    type: post or get,
    contentType: "application/json; charset=utf-8",
    url: strURL,
    async: false,
    data: JSON.stringify({ DocumentIDs: DocumentIDList, IsShowLayers: isShowLayers }),
    success: function (data) {},
    error: FailureCallBack
});

如何在ajax post请求中传递模型中的元素？

5 个答案: