Mehrere Parameter in Ajax Call mit Razor übergeben

Question

Also im Wesentlichen, ich baue eine Web-API, und ich versuche, Ajax zu verwenden, um einen Web-Service abzufragen, der zwei Argumente akzeptiert. Ich muss eine Liste von Stichen (SSNs) übergeben und ich muss eine einzelne Zeichenfolge übergeben, um zu bestimmen, welche Umgebung es abfragt. ("a" für die Akzeptanz und "i" für die Integration).

Ich benutze cshtml mit Rasierer. Und bis jetzt gibt mir dieser Abschnitt erfolgreich, was ich von den divs will.

var pInputSssns = document.GetElementById(“SSNinput”).value; 
var pTestRegion = document.GetElementById(“testRegion’).value; 

Allerdings knapp darunter. Ich versuche, diese beiden Parameter in einen Ajax-Aufruf einzufügen.

$.ajax({ 
     type: 'GET', 
     contentType: "application/json; charset=utf-8" 
     url: "myurl", 
     data:"{}", 
     success: function (data) { 
      // populate a table 
     } 
    }); 

Ich habe mehrere Meinungen darüber gehört, wie das gemacht werden kann. Kann ich sie beide als JSON serialisieren und dann zwei JSON-Objekte in den Datenparameter einfügen? Ich habe auch gehört, dass ich ein cis-Objekt übergeben kann, aber wenn ich das versuche, kann ich nicht auf die html-Variable zugreifen, während ich im Razor-Code bin.

@{ AjaxParam ap = new AjaxParam(); ap.pInputSsns = pInputSsns;} 

Gibt es eine gute Möglichkeit, beide dort drin zu übergeben? Als Referenz, hier ist der Controller:

[ScriptMethod (ResponseFormat = Response Format.Json)] 
[System.Web.Http.HttpGet] 
public JArray GetSSNAssociations([FromUri] List <string> pInputSsns, string pTestRegion) 
{ 
\\ do something 
} 

Schätzen Sie es alle.

Answer 1

Erstellen Sie zuerst eine DTO-Klasse für die Daten, die Sie senden möchten.

public class SearchRequest 
{ 
    public List<string> SsnList { set; get; } 
    public string Environment { set; get; } 
} 

Jetzt in Ihrem WebAPI Controllers Post-Methode wird diese Klasse als Parameter haben, so dass, wenn der Client eine Anforderung sendet, wird das Standardmodell Bindemittel in der Lage sein, die Anforderungswerte zu den Eigenschaften eines Objekts von dieser zur Karte Klasse.

public class ProductsController : ApiController 
{ 
    public HttpResponseMessage Post([FromBody]SearchRequest req) 
    { 
     // I am simply returning the same object back. But you can do whatever you want 
     // Check req.SsnList and req.Environment properties and do something useful. 
     return Request.CreateResponse(HttpStatusCode.OK, req); 
    } 
} 

nun von dem Client-Seite Code können Sie ein JavaScript-Objekt bauen, die die Struktur unserer DTO-Klasse resemebles und es mit jQuery Ajax senden.

var model = { Environment: "I", SssList: ["375329567", "3583345"] }; 
var url="../api/products"; 
$.ajax({ 
    type: "POST", 
    data: JSON.stringify(model), 
    url: url, 
    contentType: "application/json" 
}).done(function (res) { 
    console.log('res', res); 
    // Do something with the result :) 
}); 

Here ist ein Beitrag der verschiedenen Optionen zu erklären Clientseite Daten auf dem Web-api im Detail zu senden.

Ich habe den Wert der URL-Variable fest codiert. Sie sollten die Html-Hilfsmethoden wie Url.Action verwenden, um den korrekten relativen Pfad zu Ihrem App-Endpunkt zu generieren, wie in this post erläutert.