Comment utiliser Ajax.BeginForm MVC helper avec le résultat JSON?

Question

J'essaie d'utiliser l'assistant ASP.NET MVC Ajax.BeginForm mais je ne souhaite pas utiliser les options d'insertion de contenu existantes lorsque l'appel est terminé. Au lieu de cela, je souhaite utiliser une fonction JavaScript personnalisée comme rappel.

Cela fonctionne, mais le résultat que je veux doit être retourné en tant que JSON. Malheureusement, le framework ne traite que les données sous forme de chaîne. Voici le code client. Le code serveur renvoie simplement un JsonResult avec un champ, UppercaseName.

<script type='text/javascript'> 
    function onTestComplete(content) { 
     var result = content.get_data(); 
     alert(result.UppercaseName); 
    } 
</script> 

<% using (Ajax.BeginForm("JsonTest", new AjaxOptions() {OnComplete = "onTestComplete" })) { %> 
    <%= Html.TextBox("name") %><br /> 
    <input type="submit" /> 
<%} %> 

Au lieu d'afficher le résultat en majuscules, il affiche à la place undefined. content.get_data() semble contenir le JSON, mais seulement sous forme de chaîne. Comment puis-je convertir cela en objet?

Tout cela semble vraiment un peu compliqué. Existe-t-il un meilleur moyen d'obtenir le contenu résultant en utilisant Ajax.BeginForm? Si c'est si difficile, je peux complètement ignorer Ajax.BeginForm et utiliser la bibliothèque de formulaires jQuery.

Answer 1

Essayez ceci:

var json_data = content.get_response().get_object(); 

cela vous donnera résultat au format JSON et vous pouvez utiliser json_data[0] pour obtenir le premier enregistrement

Answer 2

Essayez d'utiliser le code ci-dessous:

<script type='text/javascript'> 
    function onTestComplete(content) { 
     var result = eval('(' + content.get_data() + ')'); 
     alert(result.UppercaseName); 
    } 
</script> 

Answer 3

Marque Assurez-vous d'avoir inclus MicrosoftAjax.js et MicrosoftMvcAjax.js. Utilisez ensuite les appels suivants sur le contexte renvoyé pour extraire un objet json de la déclaration.

var json = context.get_data(); 
var data = Sys.Serialization.JavaScriptSerializer.deserialize(json); 

Answer 4

Vous pouvez utiliser OnFailure et OnSuccess au lieu de OnComplete; OnSuccess vous donne les données en tant qu'objet JSON approprié. Vous pouvez trouver les signatures de méthode de rappel enterrées dans ~/Scripts/jquery.unobtrusive-ajax.min.js que vous devez charger sur votre page.

Dans votre Ajax.BeginForm:

new AjaxOptions 
    { 
     OnFailure = "onTestFailure", 
     OnSuccess = "onTestSuccess" 
    } 

bloc Script:

<script> 
//<![CDATA[ 

    function onTestFailure(xhr, status, error) { 

     console.log("Ajax form submission", "onTestFailure"); 
     console.log("xhr", xhr); 
     console.log("status", status); 
     console.log("error", error); 

     // TODO: make me pretty 
     alert(error); 
    } 

    function onTestSuccess(data, status, xhr) { 

     console.log("Ajax form submission", "onTestSuccess"); 
     console.log("data", data); 
     console.log("status", status); 
     console.log("xhr", xhr); 

     // Here's where you use the JSON object 
     //doSomethingUseful(data); 
    } 

//]]> 
</script> 

Ces signatures success and error callbacks in $.ajax(...) correspondance, ce qui pourrait ne pas être une surprise après tout.

Ceci a été testé en utilisant asp.net-mvc-3 avec jquery 1.6.3 et 1.7.2.

Answer 5

J'utilise:

function onTestComplete(data, status, xhr) { 
     var data2 = JSON.parse(data.responseText); 
     //data2 is your object 
    }