CODEWITHSUNDEEP
javascriptc#jqueryajaxasp.net-mvc
Dinkar Veer
Dinkar Veer

Reputation: 69

Ajax success function not receive data

Below is webmethod of my web form which is returning a List of data and it works fine:

[WebMethod]
public static List<SalesInvoiceFinalCalculationEntity> salesInvoiceFinalCalculaiton(string InvoiceNo)
{
    List<SalesInvoiceFinalCalculationEntity> list = new List<SalesInvoiceFinalCalculationEntity>();
    list = SalesInvoiceManager1.salesInvoiceFinalCalculaiton(InvoiceNo);
    return list;
}

But in below Ajax function, I can't retrieve the data. When I bind data to textbox in ajax success function, it displays Undefined text in Html textBox.

function salesInvoiceFinalCalculaiton() {        

    var InvoiceNo = $("#txt_InvoiceNo").val();
    $.ajax({
        async: false,
        type: "POST",
        contentType: "application/json; charset=utf-8",
        url: "/AjaxRequestToServer.aspx/salesInvoiceFinalCalculaiton", //URI   
        data: "{InvoiceNo:'" + InvoiceNo + "'}",
        dataType: "json",
        success: function (data) {

            document.getElementById("txtinvoicevalue").value=(data.totalprice);
            document.getElementById("txtTotalDiscount").value = data.discountamt;
            document.getElementById("txtTotalTaxableValue").value = data.taxableamt;
            document.getElementById("txtTotalCGST").value = data.cgstamt;
            document.getElementById("txtTotalSGST").value = data.sgstamt;
            document.getElementById("txtGrandTotal").value = data.grandtotal;

        },
        error: function (xhr) {
            if (xhr.statusText == "Invalid Request") {
                sessionStorage.clear();
            }
        }
    });
}

Here is Data Layer and the stored procedure:

 public static List<SalesInvoiceFinalCalculationEntity> salesInvoiceFinalCalculaiton(string InvoiceNo)
        {
            try
            {


                List<SalesInvoiceFinalCalculationEntity> SalesInvoiceFinalCalculation = new List<SalesInvoiceFinalCalculationEntity>();

                DataSet ds = SqlHelper.ExecuteDataset(Util.ConnectionString, CommandType.StoredProcedure, "sp_salesInvoiceFinalCalculaiton",
                    new SqlParameter("@InvoiceNo", InvoiceNo));

                foreach (DataRow dr in ds.Tables[0].Rows)
                {
                    SalesInvoiceFinalCalculationEntity list = new SalesInvoiceFinalCalculationEntity(dr);
                    SalesInvoiceFinalCalculation.Add(list);
                }
                return SalesInvoiceFinalCalculation;
            }
            catch (Exception ex)
            {
                throw ex;
            }
        }

And this is my entity Class:

public class SalesInvoiceFinalCalculationEntity
    {
        public int InvoiceNo { get; set; }
        float totalprice { get; set; }
        float discountamt { get; set; }
        float taxableamt { get; set; }
        float cgstamt { get; set; }
        float sgstamt { get; set; }
        float grandtotal { get; set; }
        public SalesInvoiceFinalCalculationEntity() { }
        public SalesInvoiceFinalCalculationEntity(DataRow dr)
        {
            InvoiceNo = Convert.ToInt32(dr["InvoiceNo"]);
            totalprice = float.Parse(dr["totalprice"].ToString());
            discountamt = float.Parse(dr["discountamt"].ToString());
            taxableamt = float.Parse(dr["taxableamt"].ToString());
            cgstamt = float.Parse(dr["cgstamt"].ToString());
            sgstamt = float.Parse(dr["sgstamt"].ToString());
            grandtotal = float.Parse(dr["grandtotal"].ToString());
        }
    }

why is data is not received in success function!

Upvotes: 2

Views: 2785

Answers (5)

Dinkar Veer
Dinkar Veer

Reputation: 69

Finally resolved it. I forgot to mentioned

Public

in

SalesInvoiceFinalCalculationEntity

entity all variables and document.getElementById("txtinvoicevalue").value=(data.d[0].totalprice); this should be instead of

document.getElementById("txtinvoicevalue").value=(data.totalprice);

Upvotes: 1

Sean T
Sean T

Reputation: 2494

Try success: function (data.d) rather than success: function (data). If I recall when using webmethods the return object is within data.d and not simply data.

Also, despite what other answers say. When using the [webmethod] attribute and jquery ajax, you do not have to convert your response object to json. It will do so automatically.

Upvotes: 0

Mihai Alexandru-Ionut
Mihai Alexandru-Ionut

Reputation: 48337

First of all, using async: false it is a bad practice because it's freeze your window during to your request. Don't use it.

The issue is that you have to return a json object from your server-side method in order to receive response in success callback function of your ajax method.

[WebMethod]
public static string salesInvoiceFinalCalculaiton(string InvoiceNo)
{
        List<SalesInvoiceFinalCalculationEntity> list = new List<SalesInvoiceFinalCalculationEntity>();
        list = SalesInvoiceManager1.salesInvoiceFinalCalculaiton(InvoiceNo);
        return JsonConvert.SerializeObject(list);
}

Web requests work with json format.

Upvotes: 1

Marco Salerno
Marco Salerno

Reputation: 5203

Use this:

https://www.newtonsoft.com/json

Serialize your list and return it as a string.

Then, in your javascript:

success: function (data) {
    data = JSON.parse(data);
    document.getElementById("txtinvoicevalue").value=(data.totalprice);
    document.getElementById("txtTotalDiscount").value = data.discountamt;
    document.getElementById("txtTotalTaxableValue").value = data.taxableamt;
    document.getElementById("txtTotalCGST").value = data.cgstamt;
    document.getElementById("txtTotalSGST").value = data.sgstamt;
    document.getElementById("txtGrandTotal").value = data.grandtotal;

},

Upvotes: 0

Washipp
Washipp

Reputation: 1

I think the problem is, that you're trying to send a Java Class to your JavaScript file. You can only send simple data types numbers, letters. As I understand, you're trying to access the member variables of SalesInvoiceFinalCalculationEntity.

If that's the case, you need to send it as a JSON object and get the data like this and then parse it.

The idea behind AJAX is to make the experience for the user better by not freezing the website using asynchronous requests. By calling the AJAX call with

async: false

removes the idea behind AJAX. You could then simply make a normal call to the server.

Upvotes: 0

Related Questions