So erhalten Sie ein JSON-Objekt vom Razor Model-Objekt in Javascript

78

Im viewmodel-Objekt ist unten die Eigenschaft:

  public IList<CollegeInformationDTO> CollegeInformationlist { get; set; }

In VIEW lautet Javascript wie folgt:

   var obj = JSON.stringify('@Model.CollegeInformationlist');
   alert(obj[1].State);  //NOT WORKING, giving string char

      $.each('@Model.CollegeInformationlist', function (i, item) {
    var obj = JSON.stringify(item);
    var r = $.parseJSON(obj);
    alert(r.State);    //just giving undefined.
    });

Bitte führen Sie hier, wie ich JSON-Objekt in Javascript bekommen kann.

dsi
quelle
Ihr Javascript weiß nicht, wie Ihre CollegeInformationDTO-Klasse aussieht. Bei meinem letzten Job haben wir ein Objekt im Skript mit derselben Struktur wie das Modell definiert und dann eine jquery .map erstellt, um das Modell dem Javascript-Objekt zuzuordnen. Stellen Sie außerdem sicher, dass Sie eine JSON-Zeichenfolge an die Ansicht übergeben
Matt Bodily,
Sie müssen Ihr Model-Objekt in JSON serialisieren. Sie sollten eine Methode (oder Eigenschaft) erstellen, die dieses Ergebnis zurückgibt.
Musefan
Können Sie mir bitte ein paar Dinge mitteilen, um dies zu tun? Hier, var obj = JSON.stringify('@Model.CollegeInformationlist');so schrieb ich , sollte es in ein JSON-Objekt konvertiert werden und in der Lage sein, Ergebnisse zu liefern, wenn explizit .StateEigenschaften geschrieben werden, aber es funktioniert nicht wie ein Weg. Es sieht so aus, als ob OBJECT in einen String-Typ konvertiert wurde.
dsi

Antworten:

170

Sie könnten Folgendes verwenden:

var json = @Html.Raw(Json.Encode(@Model.CollegeInformationlist));

Dies würde Folgendes ausgeben (ohne Ihr Modell zu sehen, habe ich nur ein Feld eingefügt):

<script>
    var json = [{"State":"a state"}];   
</script>

Geige arbeiten

AspNetCore

AspNetCore verwendet Json.Serializeintead vonJson.Encode

var json = @Html.Raw(Json.Serialize(@Model.CollegeInformationlist));

MVC 5/6

Sie können Newtonsoft dafür verwenden:

    @Html.Raw(Newtonsoft.Json.JsonConvert.SerializeObject(Model, 
Newtonsoft.Json.Formatting.Indented))

Dies gibt Ihnen mehr Kontrolle über die JSON-Formatierung, dh Einrücken wie oben, Camelcasing usw.

Hutchonoid
quelle
1
@ Dhaval Kein Problem. :)
Hutchonoid
15
Für jeden, der AspNetCore verwendet, wird dies Json.Serializeanstelle von verwendet Json.Encode.
TrueWill
5
Für neuere Versionen von MVC 5/6 @Html.Raw(Newtonsoft.Json.JsonConvert.SerializeObject(Model, Newtonsoft.Json.Formatting.Indented))
Lord Darth Vader
1
@ R2D2 ein zusätzlicher Dreh zu Ihrem Vorschlag: JsonConvert.SerializeObject(Model, Newtonsoft.Json.Formatting.Indented, new JsonSerializerSettings { ContractResolver = new CamelCasePropertyNamesContractResolver() })Dies stellt auch die richtige JavaScript-CamelCase (oder ich sollte sagen camelCase) für den serialisierten JSON sicher .
Al Dass
1
@ Html.Raw (Newtonsoft.Json.JsonConvert.SerializeObject (Model, Newtonsoft.Json.Formatting.Indented)) arbeitete für mich
smj
9

In ASP.NET Core wird IJsonHelper.Serialize () zurückgegeben, IHtmlContentsodass Sie es nicht mit einem Aufruf von abschließen müssen Html.Raw().

Es sollte so einfach sein wie:

<script>
  var json = @Json.Serialize(Model.CollegeInformationlist);
</script>
Rob Mensching
quelle
2

Nach Gebrauch Codevar json = @Html.Raw(Json.Encode(@Model.CollegeInformationlist));

Sie müssen verwenden JSON.parse(JSON.stringify(json));

Frederico Martins
quelle
Kleine Sache, aber Sie sollten Ihr Codesegment in der zweiten Zeile formatieren. Es ist zu klein für eine Bearbeitung, sodass ich es nicht tun kann.
Michael
Warum würdest du JSON.stringifyund JSON.parserichtig nacheinander? Es wäre nicht nötig und würde die Ressourcen verschwenden.
Peter Ivan
Sinn ergeben. Ich muss testen, ob ich ohne JSON.stringify arbeite. Ich denke das JSON.parse(@Html.Raw(Json.Encode(@Model.CollegeInformationlist)))sollte einfach funktionieren. Jemand kann testen und uns Bescheid geben. Aber jetzt benutze ich diesen Weg und arbeite für mich.
Frederico Martins
1

Wenn Sie ein JSON-Objekt aus Ihrem Modell erstellen möchten, gehen Sie wie folgt vor:

  foreach (var item in Persons)
   {
    var jsonObj=["FirstName":"@item.FirstName"]
   }

Oder verwenden Sie Json.Net , um json aus Ihrem Modell zu erstellen :

string json = JsonConvert.SerializeObject(person);
M. Azad
quelle
1

Übergeben Sie das Objekt vom Controller zur Ansicht, konvertieren Sie es in Markup ohne Codierung und analysieren Sie es in json.

@model IEnumerable<CollegeInformationDTO>

@section Scripts{
    <script>
          var jsArray = JSON.parse('@Html.Raw(Json.Encode(@Model))');
    </script>
}
Arischer Firouzian
quelle
Warum sollten Sie das Ergebnis in Anführungszeichen und JSON.parsenacheinander setzen? Es wäre nicht nötig und würde die Ressourcen verschwenden.
Peter Ivan