Embed rohe Daten in HTML zum Analysieren in jQuery

Question

Ich habe die meiste Zeit meiner Karriere in der Desktop-Welt gelebt, so verzeihen Sie mir für eine solche grundlegende Frage, aber ich bin nicht ganz sicher, wo ich anfangen soll.

Ich möchte einige Rohdaten zusammen mit meinem HTML zurückgeben und die Daten mit jQuery parsen und anzeigen, sobald der HTML-Code fertig ist. Ich weiß ungefähr, wie mein js-Code aussehen sollte, aber ich bin nicht sicher, wie ich die rohen Daten in meinem HTML einbetten sollte.

Ich könnte $ .getJSON() verwenden, aber es wäre besser, wenn ich die Daten in meinem HTML haben könnte.

Ich denke, entweder Json oder XML würde funktionieren, aber was ist der richtige Weg zu entkommen/einbetten/einbetten diese, wenn sie in HTML eingebettet sind?

Vielen Dank im Voraus.

Answer 1

Sie können die JSON-Daten in ein verstecktes Div setzen, dann dekodieren und von jQuery aus verwenden.

Zum Beispiel wir nehmen:

{"foo":"apple","bar":"orange"} 

Flucht es und in einem div setzen:

<div id="data">%7B%22foo%22%3A%22apple%22%2C%22bar%22%3A%22orange%22%7D</div> 

Dann von jQuery, können wir die Daten verwenden:

var data = jQuery.parseJSON(unescape($("#data").html())); 

So rufen alert(data.foo) wird uns apple geben.

Here's a working example.

Answer 2

Wie gesagt, du es wahrscheinlich am besten ist es über Ajax zu erhalten mit $ .post oder $ .get oder $ (Element) .load() etc ...

Aber wenn Sie es auf der Seite speichern müssen Es ist üblich, in einem versteckten Feld zu speichern. Asp.net speichert Dinge in versteckten Feldern mit binärer Serialisierung und Base64, aber Sie können es als JSON-String speichern und dann in Ihrem JS verwenden.

Answer 3

Wo und wann möchten Sie diese Daten?

Wenn Sie es Ihrer Ansicht nach wollen, geben Sie einfach die Daten der Ansicht

Action/Controller:

public ActionResult MyAction() 
{ 
    ViewData["MyData"] = "this is a sample data of type string"; 
    return View(); 
} 

Und dann irgendwo in der Ansicht:

<script> 
    var data = '<%= ViewData["MyData"] %>'; 
    $(document).ready(){ 
     alert(data); 
    } 
</script> 
<h1><%: ViewData["MyData"] %></h1> 

Of Natürlich, wenn Sie mit einem List<string> oder `string [] 'arbeiten, müssten Sie es auf das richtige JavaScript für jQuery formatieren, um es zu verstehen.

<script> 
    var dataArray = [ 

    <% foreach(string s in (string[])ViewData["MyDataArray"]){ %> 
     <%= s %>, 
    <% } %> 
    ]; 
</script> 

Es wäre Getter, wenn Sie die richtige JavaScript in Aktion statt der Ansicht erzeugen hässlichen Markup in Ihrer Ansicht zu vermeiden:

public ActionResult MyAction() 
{ 
    string[] myArray = new string[]{ "hello", "wolrd" }; 
    ViewData["MyData"] = myArray; 
    ViewData["JavaScriptArray"] = "[" + myArray.Aggregate((current,next) => string.Format("'{0}','{1}',", current, next).TrimEnd(new char[] { ','})) + "]"; 
    // or you can use your favorite JavaScript serialize 
    return View(); 
} 

Jetzt können Sie Ihre Ansicht nach Folgendes tun:

<script> 
    var dataArray = <%= ViewData["MyJavaScriptArray"] %>; 
    alert(dataArray[0]); // alerts 'hello' 
</script>