Wysyłanie obiektu JSON do interfejsu API WWW

Question

Próbuję dowiedzieć się, jak wysłać pewne informacje z formularza do działania interfejsu Web API. Jest to jQuery/AJAX Próbuję użyć:

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 }); 
     } 
    }); 

Oto mój model

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

Oto mój widok

<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" /> 

Oto moje działania kontroler

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

Czego mi brakuje? teraz, gdy debuguję i przechodzę przez to, kiedy żądanie ajax uderza w działanie kontrolera, nic nie jest przekazywane do paramu modelu.

Answer 1

Spróbuj tego:

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 }); 
      } 
     }); 
    }); 

Kontroler

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

Zobacz

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

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

Teraz po kliknięciu „Add” po wypełnieniu pola tekstowego The controller będą pluć powrotem, co napisałeś w polu PartNumber w pogotowiu.

Answer 2

wierzę trzeba cytaty całym model:

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

Answer 3

Zmiana:

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

Do:

:

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

aw kontrolerze to zrobić 10

Jeśli url użyć w jQuery jest /api/PartSourceAPI to nazwa kontrolera musi być api i działania (metoda) powinny być PartSourceAPI

Answer 4

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}" 

dane jest coś takiego "{" model ": "id": 0" ProductID ": 6" Kem ": 7" VendorID ": 8}}" kontroler api internetowa nie może powiąż go ze swoim modelem