22

我试图弄清楚如何将一些信息从表单发送到 Web API 操作。这是我正在尝试使用的 jQuery/AJAX：

var source = { 
        'ID': 0, 
        'ProductID': $('#ID').val(), 
        'PartNumber': $('#part-number').val(),
        'VendorID': $('#Vendors').val()
    }

    $.ajax({
        type: "POST",
        dataType: "json",
        url: "/api/PartSourceAPI/",
        data: JSON.stringify({ model: source }),
        success: function (data) {
            alert('success');
        },
        error: function (error) {
            jsonValue = jQuery.parseJSON(error.responseText);
            jError('An error has occurred while saving the new part source: ' + jsonValue, { TimeShown: 3000 });
        }
    });

这是我的模型

public class PartSourceModel
{
    public int ID { get; set; }
    public int ProductID { get; set; }
    public int VendorID { get; set; }
    public string PartNumber { get; set; }
}

这是我的看法

<div id="part-sources">
    @foreach (SmallHorse.ProductSource source in Model.Sources)
    {
        @source.ItemNumber <br />
    }
</div>
<label>Part Number</label>
<input type="text" id="part-number" name="part-number" />

<input type="submit" id="save-source" name="save-source" value="Add" />

这是我的控制器动作

// POST api/partsourceapi
public void Post(PartSourceModel model)
{
    // currently no values are being passed into model param
}

我错过了什么？现在，当我在 ajax 请求命中控制器操作时调试并逐步执行此操作时，没有任何内容传递到模型参数中。

4

4 回答 4

30

尝试这个：

jQuery

    $('#save-source').click(function (e) {
        e.preventDefault();
        var source = {
            'ID': 0,
            //'ProductID': $('#ID').val(),
            'PartNumber': $('#part-number').val(),
            //'VendorID': $('#Vendors').val()
        }
        $.ajax({
            type: "POST",
            dataType: "json",
            url: "/api/PartSourceAPI",
            data: source,
            success: function (data) {
                alert(data);
            },
            error: function (error) {
                jsonValue = jQuery.parseJSON(error.responseText);
                //jError('An error has occurred while saving the new part source: ' + jsonValue, { TimeShown: 3000 });
            }
        });
    });

控制器

    public string Post(PartSourceModel model)
    {
        return model.PartNumber;
    }

看法

<label>Part Number</label>
<input type="text" id="part-number" name="part-number" />

<input type="submit" id="save-source" name="save-source" value="Add" />

Add现在，当您在填写文本框后单击“ ”时，将在警报中controller吐出您在框中所写的内容。PartNumber

于 2012-12-14T01:15:38.887 回答
6

改变：

 data: JSON.stringify({ model: source })

至：

 data: {model: JSON.stringify(source)}

在你的控制器中你这样做：

public void PartSourceAPI(string model)
{
       System.Web.Script.Serialization.JavaScriptSerializer js = new System.Web.Script.Serialization.JavaScriptSerializer();

   var result = js.Deserialize<PartSourceModel>(model);
}

如果您在 jquery 中使用的 url 是，/api/PartSourceAPI那么控制器名称必须是api并且操作（方法）应该是PartSourceAPI

于 2012-12-14T00:08:45.700 回答
3 
var model = JSON.stringify({ 
    'ID': 0, 
    'ProductID': $('#ID').val(), 
    'PartNumber': $('#part-number').val(),
    'VendorID': $('#Vendors').val()
})

$.ajax({
    type: "POST",
    dataType: "json",
    contentType: "application/json",
    url: "/api/PartSourceAPI/",
    data: model,
    success: function (data) {
        alert('success');
    },
    error: function (error) {
        jsonValue = jQuery.parseJSON(error.responseText);
        jError('An error has occurred while saving the new part source: ' + jsonValue, { TimeShown: 3000 });
    }
});

var model = JSON.stringify({      'ID': 0,     ...': 5,      'PartNumber': 6,     'VendorID': 7 }) // output is "{"ID":0,"ProductID":5,"PartNumber":6,"VendorID":7}"

您的数据是这样的 "{"model": "ID":0,"ProductID":6,"PartNumber":7,"VendorID":8}}" web api 控制器无法将其绑定到您的模型

于 2012-12-14T13:56:24.630 回答
-4

我相信您需要以下引号model：

JSON.stringify({ "model": source })
于 2012-12-13T23:15:19.217 回答