HEEN
HEEN

Reputation: 4727

Jquery ajax code is going in error part

I have called an javascript function, Inside which I am using an ajax. But I have no idea why it is always going in else part. Below is the code

function BindHTMLTable() {
        var structureName = $('#<%=ddlFacilityId.ClientID %>').val();
        var facilityID = $('#<%=ddlFacilityId.ClientID %> :selected').text();

        $.ajax({
            url: "UBRDashboard.aspx/GETSTRUCTUREINFO",
            dataType: "json",
            type: "POST",
            contentType: 'application/json; charset=utf-8',
            data: JSON.stringify({ facilityID: facilityID, structureName: structureName }),
            async: true,
            processData: false,
            cache: false,
            success: function (r) {
                alert('page loaded');
            },
            error: function (xhr) {
                alert('Error while selecting list..!!');
            }
        })
    }

And the server side function

public static string GETSTRUCTUREINFO(string facilityID, string structureName)
    {
        string strStructure = "";
        try
        {
            DataTable dtStructureInfo = CommonDB.GET_STRUCTURE_DETAILS(facilityID, structureName);                
        }
        catch (Exception ex)
        {                
            throw ex;
        }
        return strStructure;
    }

Upvotes: 3

Views: 145

Answers (1)

xxxmatko
xxxmatko

Reputation: 4142

Add this decoration to your server side method

[System.Web.Services.WebMethod()]

Than you can create the resulting html table like this:

$("button").click(function() {
  var data = [
   {"RJ_NETWORK_ENTITY_ID":"INUESTPRISMLTW0001ENBRRH003","EQUIPMENT_NAME":"RAN:RR::577569"},
   {"RJ_NETWORK_ENTITY_ID":"INUESTPRISMLTW0001ENBRRH002","EQUIPMENT_NAME":"RAN:RRU::577571"}
  ];

  // Just get handle for the existing table
  var table = $("#tblData");

	// Clear table
  table.empty();

  // Create header row
  var header = $("<tr><th>RJ Network Entity ID</th><th>Equipment Name</th></tr>");
  table.append(header);

  // Create rows
  data.forEach(function(dataRow) {
    var tr = $("<tr>");
    $.each(dataRow, function(key,value) {
      tr.append("<td>" + value + "</td>");
    });
    table.append(tr);
  });
});
table, td, th {
  border: 1px solid red;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<table id="tblData"></table>

<button>
fill table
</button>

Upvotes: 2

Related Questions