Click here to Skip to main content
14,639,623 members
Rate this:
Please Sign up or sign in to vote.
i got json data in asp.net. i want to display the json data in html page using jquery.
my json data below

{"NewsByIdResult":[{"CompanyLegalName":"TCS BUSINESS INFORMATION","IndstryName":"Building Materials","Industry":83,"NewsCompId":7,"NewsID":4,"NewsTopic":"Sick Units"}]}


but couldn't read property 'query'.Please help me sir...

What I have tried:

<script>
$(document).ready(function () {
debugger;
$.ajax({
url: 'http://localhost:25012/NewsRestService.svc/WrappedNewsById/4',
data: "{}",
contentType: "application/json; charset=utf-8",
dataType: "json",
cache: false,
}).success(function (data) {
alert(data);
$('#data').append(JSON.stringify(data));
});
})
</script>

Another Type of Code:

<script type="text/javascript">
debugger;
var service = 'http://localhost:25012/NewsRestService.svc/NewsById/';
$(document).ready(function () {
jQuery.support.cors = true;
$.ajax(
{
type: "GET",
url: service + '4',
data: "{}",
contentType: "application/json; charset=utf-8",
dataType: "json",
cache: false,
success: function (data) {
alert(data);
var trHTML = '';
$.each(data.newsid, function (i, item) {
''

' + listvalues.newsid[0].NewsTopic + '

'
});
$('#blog-post-content-desc').append(trHTML);
},
error: function (msg) {
alert(msg.responseText);
}
});
});
</script>
Posted
Updated 21-Jun-16 2:26am
v4
Comments
F-ES Sitecore 21-Jun-16 7:52am
   
Does your ajax call happen? Does the url get called? Does it return the data you want? Does the success event fire? Does your alert show? If so what is in the alert box? Does your append show anything on the screen? What do you want it to show on screen?
Karthik_Mahalingam 21-Jun-16 7:53am
   
post the WrappedNewsById() code
Thiyagu Arockiasamy 21-Jun-16 8:22am
   
I'm working in asp.net wcf rest service. below code is my service

public List<newss> NewsById(string NewsID)
{
string Status = TokenHelper.IsValidateToken();
using (DbConnection con = db.CreateConnection())
try
{
con.Open();List<newss> Lstnews = new List<newss>();
DbCommand cmd = db.GetStoredProcCommand("spNews_GetValues", NewsID);
cmd.CommandTimeout = int.MaxValue;
SqlDataReader objnewsRead = (SqlDataReader)db.ExecuteReader(cmd);
while (objnewsRead.Read())
{
Lstnews.Add(new Newss()
{
NewsID = objnewsRead.GetInt32(objnewsRead.GetOrdinal("NewsID")),
NewsCompId = objnewsRead.GetInt32(objnewsRead.GetOrdinal("NewsCompId")),
CompanyId = objnewsRead.GetInt32(objnewsRead.GetOrdinal("CompanyIds")),
CompanyLegalName = objnewsRead.GetString(objnewsRead.GetOrdinal("CompanyLegalName")),
});
}

return Lstnews;
}
finally
{
con.Close();
}
}

IService code:

[OperationContract]
[WebGet(UriTemplate = "WrappedNewsById/{NewsID}", ResponseFormat = WebMessageFormat.Json, BodyStyle = WebMessageBodyStyle.Wrapped)]
List<newss> NewsById(string NewsID);
Karthik_Mahalingam 21-Jun-16 8:24am
   
ok fine,
what is the value you are getting in alert(data);
Thiyagu Arockiasamy 21-Jun-16 8:27am
   
does not read it. not getting
Karthik_Mahalingam 21-Jun-16 8:27am
   
so the problem is in the wcf method

http://localhost:25012/NewsRestService.svc/NewsById/4
type this url in browser and see what result you are getting..

and one thing you will have to serialise the data to json.

does the error method is called? if so what is the error message ?
Thiyagu Arockiasamy 21-Jun-16 8:33am
   
Uncaught TypeError: Cannot read property 'toLowerCase' of undefined

its my error message. yes i serialised json format.i got output http://localhost:25012/NewsRestService.svc/NewsById/4 but i did not read in url using jquery.,
Karthik_Mahalingam 21-Jun-16 8:42am
   
Post your complete Ajax code
Thiyagu Arockiasamy 21-Jun-16 8:47am
   
<script type="text/javascript">
$(document).ready(function () {
debugger;
$.ajax({
type: "GET",
url: 'http://localhost:25012/NewsRestService.svc/WrappedNewsById/4',
data: "{}",
contentType: "application/json; charset=utf-8",
dataType: "json",
cache: false,
}).success(function (data) {
$('#data').append(JSON.parse(data));
alert(data);
});
})
</script>

Another Type of Code is:

<script type="text/javascript">
debugger;
var service = 'http://localhost:25012/NewsRestService.svc/NewsById/';
$(document).ready(function () {
jQuery.support.cors = true;
$.ajax(
{
type: "GET",
url: service + '4',
data: "{}",
contentType: "application/json; charset=utf-8",
dataType: "json",
cache: false,
success: function (data) {
alert(data);
var trHTML = '';
$.each(data.newsid, function (i, item) {
'<div class="blog-post-content-desc">'
+ '<div class="blog-post-content">'
+ '

' + listvalues.newsid[0].NewsTopic + '

'
});
$('#blog-post-content-desc').append(trHTML);
},
error: function (msg) {
alert(msg.responseText);
}
});
});
</script>
Karthik_Mahalingam 21-Jun-16 8:51am
   
Does Ajax Call hits the service method?
Thiyagu Arockiasamy 21-Jun-16 9:10am
   
i'm use in this method

<script type="text/javascript">
$(document).ready(function () {
debugger;
$.ajax({
type: "GET",
url: 'http://localhost:25012/NewsRestService.svc/WrappedNewsById/4',
data: "{}",
contentType: "application/json; charset=utf-8",
dataType: "json",
cache: false,
}).success(function (data) {
$('#data').append(JSON.parse(data));
alert(data);
});
})
</script>

please tell me ajax call service method . i'm struggle
Karthik_Mahalingam 21-Jun-16 9:23am
   
keep a break point at this method WrappedNewsById
and try to call via ajax and check if it hits the breakpoint.
Thiyagu Arockiasamy 21-Jun-16 9:27am
   
berakpoint does not read(go) in ajax. its only read function()
Karthik_Mahalingam 21-Jun-16 9:38am
   
enna thala prachaney?
gmailku vanga
Thiyagu Arockiasamy 22-Jun-16 1:22am
   
mail id ? thala
Karthik_Mahalingam 22-Jun-16 1:34am
   
ippo mudiyadhu, officela iruken..
Thiyagu Arockiasamy 22-Jun-16 2:03am
   
okay mail id tharalame .
Thiyagu Arockiasamy 22-Jun-16 2:10am
   
thala mail id thanga . i would like to asked some questions on jquery ji.
Karthik_Mahalingam 22-Jun-16 2:21am
   
ok
Thiyagu Arockiasamy 22-Jun-16 2:52am
   
thanks thala
Karthik_Mahalingam 22-Jun-16 2:54am
   
team viewer iruka?
Thiyagu Arockiasamy 22-Jun-16 3:05am
   
iruku
Karthik_Mahalingam 22-Jun-16 3:06am
   
ok evening vanga, 5maniku mela
gmailku ping pnaunga
Thiyagu Arockiasamy 22-Jun-16 3:08am
   
unga mail id enaku neenga tharave illa
Karthik_Mahalingam 22-Jun-16 3:09am
   
note panuga boss
Thiyagu Arockiasamy 22-Jun-16 4:03am
   
ok boss thanks
Thiyagu Arockiasamy 22-Jun-16 3:06am
   
.
Karthik_Mahalingam 22-Jun-16 8:45am
   
ji online varengala

1 solution

Rate this:
Please Sign up or sign in to vote.

Solution 1

Your data is already in string notation, there is no need to stringify it anymore. That is why you get the error. (For this error, go to the fiddle I have provided, change the parse function call to stringify and then check the error in console.) What you need to do is, you need to parse it to an object. For that, you need to do the following,

// JSON
{
   "NewsByIdResult": [
        {
            "CompanyLegalName":"TCS BUSINESS INFORMATION",
            "IndstryName":"Building Materials",
            "Industry":83,
            "NewsCompId":7,
            "NewsID":4,
            "NewsTopic":"Sick Units"
        }
   ]
}

var obj = JSON.parse(data); // Parsed!

Now you can use the obj object to get the properties. Such as like this,
alert(obj.NewsByIdResult[0].CompanyLegalName);

// Should show TCS BUSINESS INFORMATION

And it just does, test it here, Edit fiddle - JSFiddle[^]

For more on JSON parsing, please read: JSON.parse() - JavaScript | MDN[^].

Stay tuned, my next article on JSON is also coming out... If you're interested. :-)
   
v2

This content, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)




CodeProject, 503-250 Ferrand Drive Toronto Ontario, M3C 3G8 Canada +1 416-849-8900 x 100