I'm having trouble handling a JSON object that I'm getting back from an AJAX request.
It's a simple flat JSON object, and all I want to do is write the responses back onto the page.
Can anyone point out how to loop over these objects and output the values? I just keep getting [undefined] or [object] written
Code here:
$.ajax({
type: "POST",
url: "func/chatResponse.php",
data: dataString,
success: function() {
$.getJSON('func/chatResponse.php?a=jsonLatest', function(data) {
$.each(data, function(index) {
//items.push('<li id="' + key + '">' + val + '</li>');
$('body').append('<li id="' + data.user + '">' + data.user + '</li>');
alert(data);
});
});
alert("done");
}
});
JSON sample here
[
{"user":"someguy","message":"my message","timestamp":"2011-04-19 17:26:09"},
{"user":"Cheyne","message":"Hey There ... Nice site","timestamp":"2011-04-19 17:26:09"}
]
data is the array, while you want the items inside the array.
$.each doesn't change data to become the items, instead it passes individual items as the second parameter to the function you supply:
$.each(data, function (index, item) {
// Use item in here
$('body').append('<li id="' + item.user + '">' + item.user + '</li>');
});
Alternatively, you can use data[index]:
$.each(data, function (index) {
// use data[index] in here
$('body').append('<li id="' + data[index].user + '">' + data[index].user + '</li>');
});
By the way, avoid ugly string concatenation with:
$('<li>', {id: item.user, text: item.user}).appendTo('body');
What you want is
$.each(data, function(index) {
//items.push('<li id="' + key + '">' + val + '</li>');
$('body').append('<li id="' + data[index].user + '">' + data[index].user + '</li>');
alert(data);
});
Related
I have a string of JSON
msg = {d: "[{"ID":1,"IndentDate":"30/07/2018","EmpCode":"4000…er":"sef"}]
I wish to append my table but its showing row is undefined
$.each(msg, function(i, row) {
$("#autoTable").append("<tr><td>" + row['IndentDate'] + "</td><td>" + row['EmpCode'] + "</td></tr>");
})
I tried
$.each(json, function (i, msg) {
$("#autoTable").append("<tr><td>" + msg.IndentDate + "</td><td>" + msg.EmpCode + "</td></tr>");
})
too.please help
this thing worked..hope it helps others too..thanks for the help guys
var jsonString = JSON.parse(msg.d);
jsonString.forEach(function (row) {
$("#autoTable").append("" + row.IndentDate + "" + row.EmpCode + " ");
});
I have a jquery foreach appended list in a table. What I want is to pass the full object that I am getting from an ajax success function. But when I try to pass the Object as a parameter to a different JS function, the parameter gets unexpected end of input.
This is my appended table:
$.ajax({
type: "post",
url: "#Url.Content("~/Estimate/GetOffsetLetterHeadCost")",
data: $('#OffLetterHeadForm').serialize(),
datatype: "json",
traditional: true,
success: function(data) {
var Json = data;
$.each(Json, function(index, obj) {
var row = '<tr>' + '<td><b>' + obj.VendorName + '</b></td>'
+ '<td><label id="machineId' + index + '">'
+ obj.MachineName + ' </label></td>'
+ '<td><input type="button" value="Order" id="btn'
+ index + '"onclick="SaveOffsetOrder('
+ JSON.stringify(obj) + ')"/></td></tr>';
$("#AllVendorsList").append(row);
});
}
});
<table id="AllVendorsList"></table>
function SaveOffsetOrder(obj) {
// do something with obj
}
At input close I am getting unexpexted end of input. Please help. I am new to javascript
enter image description here
Problem is that JSON.stringify(obj) doesn't escape quotes like this \" and the result is invalid html.
I suggest using jQuery onclick binding, so you don't have to stringify obj and then parse it.
Solution: https://jsfiddle.net/xpvt214o/452188/
var Json = [{
VendorName: 'kia',
MachineName: 'ceed'
}, {
VendorName: 'dacia',
MachineName: 'logan'
}];
$.each(Json, function(index, obj) {
var row = '<tr>' + '<td> <b>' + obj.VendorName + '</b></td>' + '<td><label id="machineId' + index + '">' + obj.MachineName + '</label></td>' + '<td><input type="button" value="Order" id="btn' + index + '"/></td></tr >';
$("#AllVendorsList").append(row);
$("#btn" + index).on('click', $.proxy(SaveOffsetOrder, this, obj));
});
function SaveOffsetOrder(obj) {
console.info(obj);
}
<table id="AllVendorsList"></table>
there are a lot of syntax problem. First of all, It's not clear where you have putted your js functions. If it's an .html file, your code should be:
<table id="AllVendorsList"></table>
<script type="text/javascript">
$.ajax({
type: "post",
url: "#Url.Content("~/Estimate/GetOffsetLetterHeadCost
")",
data: $('#OffLetterHeadForm').serialize(),
datatype: "json",
traditional: true,
success: function(data) {
var Json = data;
$.each(Json, function(index, obj) {
var row = '<tr>' + '<td> <b>' + obj.VendorName + '</b> </td> ' +
'<td><label id="machineId' + index + '">' + obj.MachineName + '
< / label > < /td > ' + '<td> <input type="button" value="Order"
id="btn' + index + '"onclick ="SaveOffsetOrder(' +
JSON.stringify(obj) + ')" / > < /td></tr > ';
$("#AllVendorsList").append(row);
});
}
});
function SaveOffsetOrder(obj) {
// do something with obj
}
</script>
So your error is related to syntax problems.
$(document).ready(function(){
$.ajaxSetup ({
cache: false
});
setTimeout(getData, 5000);
});
/* call the php that has the php array which is json_encoded */
function getData(){
$.getJSON('api.php', function(data) {
$('ul').empty();
/* data will hold the php array as a javascript object */
$.each(data, function(key, val) {
$('ul').append('<li id="' + key + '">' + val.date + ' ' + val.event + ' ' + val.region + ' ' + val.host + ' '+ val.type + ' ' + val.info + '</li>');
});
setTimeout(getData, 5000);
});
}
Output:
2016-09-09 09:12:18 WARN MRP SIU05 [main] Started, locked port 7075
How to replace (val.event) the occurrence of WARN on WARN2?
Please try below
//Here value is val.event
//value = val.event
var value = 'WARN2';
value = value.replace(value,'WARN');
console.log(value);
I have the rss titles going into a dropdown box and they change when each one is clicked on but i want about 4 rss feeds showing on the page so i dont need the dropdown box.
$(document).ready(function()
{
$.ajax({
type: "GET",
url: "rss_warriors.php",
dataType: "xml",
cache: false,
success: parse_rss
});
function parse_rss(rss_feed)
{
console.log(rss_feed);
$('#output').append('<select>');
$(rss_feed).find("item").each(function()
{
$('select').append('<option value="' +
$(this).find('title').text() + '">' +
$(this).find('title').text() + '</option>');
});
line_record(0,rss_feed);
$("select").on("change", function(evt)
{
line_record( $("select option:selected").index(),rss_feed)
});
}
function line_record(sel_index,rss_feed)
{
var local_index = sel_index;
var image_url;
var item_title;
var item_description;
var item_pubDate;
image_url = $(rss_feed).find("item").eq(local_index).find("thumbnail").last().attr("url");
item_title = $(rss_feed).find("item").eq(local_index).find("title").text();
item_description = $(rss_feed).find("item").eq(local_index).find("description").text();
item_pubDate = $(rss_feed).find("item").eq(local_index).find("pubDate").text();
$("#img_warriors").empty();
$("#txt_warriors").empty();
$("#img_warriors").append("<img src='" + image_url + "'>");
$("#txt_warriors").append("<span class='title_large'>" + item_title + "</span>");
$("#txt_warriors").append("<p>" + item_description + "</p>");
$("#txt_warriors").append("<p>" + item_pubDate + "</p>");
}
});
Not sure if it is what you mean, but what about :
$(rss_feed).find("item").each(function(i) {
if (i <=3) {
$('select').append('<option value="' +
$(this).find('title').text() + '">' +
$(this).find('title').text() + '</option>');
}
});
I convert my php code to json with json_encoded function.
After I write ajax code to display my data in ajax but when running don't display my data.
My json code:
[
{"Name":"fasher","Description":"2500 kg","Namyandegi":"20,500,000","Bazar":"22,410,000"}
,
{"Name":"shob","Description":"1000 kg","Namyandegi":"10,400,000","Bazar":"12,220,000"}
]
and ajax file:
<script type='text/javascript'>
$(document).ready(function(){
$.getJSON('saipa.php', function(data) {
$.each(data, function(key, val) {
$('ul').append('<li id="shoker">' + val.Name + ' ' + val.Description + ' ' + val.Namyandegi + ' ' + val.Bazar + '</li>');
});
});
});
</script>
<body>
<ul><li id="shoker"></li></ul>
</body>
Use the index overload $.each()
$.each(data, function(index) {
$('ul').append('<li id="shoker">' + data[index].Name + ' ' +
data[index].Description + ' ' +
data[index].Namyandegi + ' ' +
data[index].Bazar + '</li>'
);
});