how to display json data in div from webservice through jquery

Question

I have made a getdata webmethod which returns the data

    function GetService() {
       debugger;
//        var prod = $('#txt_num1').val();
//        var price = $('#txt_num2').val();
//        var active = $('#txt_num3').val();

        $.ajax({
            type: "POST",
            url: "WebService1.asmx/getdata",
            data: "{}",
            contentType: "application/json; charset=utf-8",
            dataType: "json",
            success: OnSuccess,
            error: OnError,
        });

        function OnSuccess(data, status) {
            $("#lblResult").removeClass("loading");
            $("#lblResult").html($.parseJSON(data.d));
        }

        function OnError(request, status, error) {
            $("#lblResult").removeClass("loading");
            $("#lblResult").html(request.statusText);

        }
    }

Where am I going wrong? How can i display data from the webservice through jquery in div?

not need use $.parseJSON(data.d) because dataType: "json" already parse json, data is js object, just $("#lblResult").html(data.d); — Андрей Петров
– Андрей Петров, Commented Jul 26, 2013 at 9:33

Cristi Pufu · Accepted Answer · 2013-07-26 12:20:29Z

1

Serialize your response:

            [WebMethod]
            public HttpResponseMessage getdata()
            {
                string conn = "Data Source=.\\sqlexpress; initial catalog=Test; user id=sa; pwd=manager;"; 
                SqlConnection connection = new SqlConnection(conn); 
                connection.Open(); 
                SqlDataAdapter da = new SqlDataAdapter("Select * from PRODUCT", connection); 
                DataSet dt = new DataSet(); 
                da.Fill(dt); 
                connection.Close();

                var resp = new HttpResponseMessage()
                {
                    Content = new StringContent(new JavaScriptSerializer().Serialize(dt))
                };
                resp.Content.Headers.ContentType = new MediaTypeHeaderValue("application/json");

                return resp;
            }

JS:

function OnSuccess(data) {
            console.log(data);
        }

function OnError(request, status, error) {
            console.trace();
        }

function GetService() {

        $.ajax({
            type: "POST",
            url: "WebService1.asmx/getdata",
            data: "{}",
            contentType: "application/json; charset=utf-8",
            dataType: "json",
            success: OnSuccess,
            error: OnError,
        });
}

answered Jul 26, 2013 at 12:20

Cristi Pufu

9,1253 gold badges39 silver badges43 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

user2431114 Over a year ago

and how can i send it in xml ?

Collectives™ on Stack Overflow

how to display json data in div from webservice through jquery

1 Answer 1

1 Comment

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

1 Comment

Your Answer

Sign up or log in

Post as a guest

Linked

Related