get response from aspx page in json format instead of plain html

Question

I want to make an ajax call to server. I need to fetch the html of page say foo.aspx: Foo.aspx html:

<form>
<div>foo</div>
</form>

I am calling this page from remote page like:

         $.ajax({
             url: '/foo.aspx',
             data: {},
             contentType: 'application/json; charset=utf-8',
             dataType: 'json',
             success: function (response) {

             }
         });

I need the html of this page BUT my requirement is that the response from this page should be JSON format. ie.

{"myresponse": {
  "id": "123",
  "html":<HTML of foo.aspx>,

}}

I need the html as a json property because I need to set other properties too from foo.aspx code behind? How can I get response from aspx page in json format instead of plain html? What is the other approach to get HTML of remote page + other properties too in json format from server? Should I go for HTTPHandlers? If yes, how can I get the html of foo.aspx in that HTTPHandler?

so where is the problem? Have you tried doing what you just said? It should work like a charm — Jibi Abraham, Apr 03 '12 at 12:36
You can make use of [WebMethod] for that...Please check http://stackoverflow.com/questions/348689/jquery-ajax-with-asp-net-webmethod-returning-entire-page — Flowerking, Apr 03 '12 at 12:37

jbl · Accepted Answer · 2012-04-04T00:51:42.453

You may want to try overriding the render method of your page :

    protected override void Render(HtmlTextWriter writer)
    {
        var sw = new System.IO.StringWriter();
        var tw = new HtmlTextWriter(sw);
        base.Render(tw);

        Response.Write(String.Format("{{\"myresponse\": {{  \"id": \"123",\"html\":\"{0}\"}}}}"
        , Server.HtmlEncode(sw.ToString()).Replace("\n"," "));
        Response.Flush();
        Response.End();
    }

Sorry for any syntax error, and for the basic handling of carriage returns. I guess it will be better to buffer the output during page_load (Response.BufferOutput = true)

score 0 · Answer 2 · answered Sep 29 '15 at 08:44

I changed jbl's example of overriding the Render method a little bit, this worked perfectly for me. I didn't need the HTML-encoding, just needed to apply some formatting and include the content-type

            protected override void Render(HtmlTextWriter writer)
            {
                var sw = new System.IO.StringWriter();
                var tw = new HtmlTextWriter(sw);
                base.Render(tw);

                var html = sw.ToString();            
                html = html.Replace("\n", " ");
                html = html.Replace("\r", " ");
                html = html.Replace("\t", " ");
                var data = html.Replace("\"", "\\\"");
                data = data.Replace("/", "\\/");
                var json = String.Format("{{\"html\":\"{0}\"}}", data);

                Response.ContentType = "application/json";
                Response.Write(json);
                Response.Flush();
                Response.End();
            }

score 0 · Answer 3 · answered Apr 03 '12 at 13:06

If you need HTML then change the datatype to html. The success event will then return html as the response.

Something like:

$.ajax({
     url: '/foo.aspx',
     dataType: 'html',
     success: function (data, textStatus, jqXHR) {
            alert(data); //data is html. 
     }
 });

score 0 · Answer 4 · answered Apr 03 '12 at 13:08

Basically You have to create an HTTPHandler that wraps Foo.aspx output into your JSON evenlope. HAving that said, JS call would be to url '/MyWebHandler?page=foo.aspx' instead of just /foo.aspx. Within the handler all you need is just to query your page and dump its output.

get response from aspx page in json format instead of plain html

4 Answers4