Comment retourner du HTML depuis un appel ASP.Net WebMethod en utilisant Jquery?

Utiliser Asp.Net 4.0 Web Forms and Jquery 1.6.2. Je souhaite effectuer un appel Ajax à un WebMethod sur une page et le renvoyer au format HTML. Sur le côté serveur, WebMethod ressemble à ceci.

[WebMethod] public static ssortingng GetOrders() { return theMethodThatGeneratesHtml(); } 

et voici la fonction appelante Ajax.

 function GetOrders() { $.ajax({ type: 'POST', contentType: "application/json", url: "Orders.aspx/GetOrders", data: "{}", success: function (data) { $('#content').html(data); }, dataType: "text" }); } 

Les données renvoyées par WebMethod sont toujours regroupées sous la forme d’un object json qui commence comme ceci.

 {"d":"\u003ctable\u003e\r\n ........ 

Comment obtenir que WebMethod renvoie simplement HTML?

Indépendamment de ce que j’ai défini sur dataType, il retourne toujours un object Json entouré d’un “d” ( voici une explication de la raison pour laquelle les données renvoyées sont toujours entourées d’une annonce). Mais l’object Json “d” ne fait que Unicode échappé html que je cherche, donc tout ce que je dois faire est de changer l’appel de Jquery Ajax à cette

 function GetOrders() { $.ajax({ type: 'POST', contentType: "application/json", url: "Orders.aspx/GetOrders", data: "{}", success: function (data) { $('#content').html(data.d); }, dataType: "json" }); } 

et cela fonctionne comme prévu.

Il est probable que WebMethod renvoie JSON par défaut, car la méthode .ajax () de jQuery utilise par défaut une proposition intelligente du type de données renvoyé.

Heureusement, le paramètre dataType de la méthode .ajax vous permet de lui indiquer le type à renvoyer:

dataType: “html”

Une remarque sur le paramètre dans la documentation indique que jQuery peut convertir le type de données renvoyé sur l’en-tête Content-Type de la réponse en un autre type, si vous le souhaitez. Dans ce cas, si le type de contenu de la réponse est JSON, vous pouvez le convertir en utilisant:

dataType: “json html”

http://api.jquery.com/jQuery.ajax/

J’ai été confronté au même scénario en intégrant jquery mobile dans un formulaire Web ASP.Net en raison du résultat HTML complexe que je renvoie. J’ai pu fournir un correctif en renvoyant un code HTML codé à partir du serveur. Le code HTML codé est en outre codé au format utf8. Ce résultat sera finalement décodé pour une sortie dans une div ou tout contrôle de choix. C’est le pseudo-code:

ASP.NET (style vb, utilisez n’importe quelle langue de votre choix). La sortie doit être renvoyée avec

 dim Result as ssortingng=Server.HTMLEncode(htmlouput) return Result 

De la section javascript avec jquery

 $('#<%=btn.ClientID %>').click(function() {///begin $.ajax({ type: "POST", url: "page.aspx/staticmethod", data: "{}", contentType: "application/json; charset=utf-8", dataType: "html", success: function(html) { try { var out = encode_utf8(html); $('#result').html(htmlDecode(encode_utf8(html))); } catch (ex) { alert(ex); } }, error: function(msg) { //alert error } }) return false; }); //ends //decode html function htmlDecode(value) { if (value) { return $('
').html(value).text(); } else { return ''; } } //remove the 'd' encapsulator and other unwanted characters function removedencapsulator(value) { return value.replace('{"d":"', '').replace('"}', '').replace(/(?:\s+)? <(?:\s+)?/g, '<').replace(/(?:\s+)?>(?:\s+)?/g, '>').replace(/\s+/g, ' '); } ////replace the quote ssortingng in the return query function replacequote(value) { return value.replace('\u0027', ''); } //unescape the utf-8 code function encode_utf8(s) { var normalizedData = replacequote( removedencapsulator(s)); return unescape(encodeURIComponent(normalizedData.toSsortingng())); }

J’espère que cela résout la question.

La réponse est un simple changement d’une ligne:

  success: function (data) { var decoded = $('
').html(data.d).text(); //here you go $('#content').html(decoded); }

Définit le innerHTML d’un nouvel élément qui n’est pas ajouté à la page, ce qui permettra à jQuery de le décoder en HTML, extrait avec .text ()

.