I've got a javascript document where I'm getting a json object and I want to create div's because I can have more than an instance on the json array. I'm creating an article , changing his innerHTML and adding it to the body but it doesn't get added.
$.ajax({
url: 'myURL',
type: "GET",
data: query,
dataType: 'json',
success: function (data) {
alert(data);
for (var i = 0; i < data.length; i++)
{
var _body = document.getElementsByTagName('body') [0];
alert(_body.innerHTML);
var article = document.createElement('article');
article.id = 'invoiceno'+i;
article.innerHTML = '<div id="client"></div><table class="cabecalho"><tr><th><span>Invoice #</span></th><td id="invoiceno"><span>invoiceno</span></td></tr><tr><th><span>Date</span></th><td id="invoicedate"><span>invoicedate</span></td></tr></table><table class="total"><tr><th><span >Total</span></th><td><span data-prefix>€</span><span id="tots">(TotalAPagar)</span></td></tr></table>';
alert(article.innerHTML);
_body.appendChild(article);
$("#invoiceno"+i).html(data[i].InvoiceNo);
$("#invoicedate"+i).html(data[i].InvoiceDate);
$("#client"+i).html(data[i].CompanyName);
$("#tots"+i).html(data[i].GrossTotal);
}
}
});
Related
I have the data generated as follows using javascript.
<script>
$.ajax({
type: 'GET',
url: 'http://127.0.0.1:5000/api/v1/profiledatanew',
data: {},
dataType: 'json',
success: function(data) {
$("#id").text(data.id)
$("#name").text(data.name)
$("#relationship_status").text(data.relationship_status);
$("#gender").text(data.gender)
$("#hometown").text(data.hometown.name);
var list = $("#checkinslist");
for (var i = 0; i < data.tagged_places.data.length; i++) {
for (obj in data.tagged_places.data[i]) {
list.append("<li>" + data.tagged_places.data[i].place.name + "</li>");
}
}
}
});
</script>
And I have the excel sheet which I have prepared before as in the following format:
How to add the data I generate to this excel file? I went on several examples but none of those worked out.
I am trying to implement a comment feature on my page. I have an itemID 123. on that page, I would like to display the comments that people have posted about itemID 123. However as of now, I am unable to display these comments on my page. There are no errors in the console.
Javascript:
function mywall() {
var url = serverURL() + "/viewwall.php"; //execute viewwall.php in the server
itemID = decodeURIComponent(getUrlVars()["itemID"]);
var JSONObject = {
"itemID": decodeURIComponent(getUrlVars()["itemID"])
};
$.ajax({
url: url,
type: 'GET',
data: JSONObject,
dataType: 'json',
contentType: "application/json; charset=utf-8",
success: function (arr) {
_mywallresult(arr); //success. execute _mywallresult()
},
error: function () {
validationMsg();
}
});
}
function _mywallresult(arr) {
var i;
//for all the shouts returned by the server
for (i = 0; i < arr.length; i++) {
//append the following:
//<b>
//time of posting </b>
//<br/>
//the message
//<br>
//userid
$("#wallcontentset").append("<b>" + arr[i].timeofposting + "</b><br/>" + arr[i].message + "<hr>" + arr[i].userid);
}
}
HTML:
<div data-role="content" class="ui-content" id="wallcontentset"></div>
Try the following :
success: function (response) {
_mywallresult(response.arr);
},
I am building a chat application with JQuery and PHP. The PHP writes the chat input to the data.txt file and the JQuery is used to append the div where I want the chat to be printed. My output prints the username of the person who sent the chat, however the message is never added to the div. Please help!
JQuery Code:
function updateChat() {
if(!instanse){
instanse = true;
/* define AJAX function */
$.ajax({
type: "POST",
url: "ajax.php",
data: {'function': 'update','state': state,'file': file},
dataType: "json",
success: function(data) {
if(data.text){
/* manage data */
for (var i = 0; i < data.text.length; i++) {
alert(data.text[i]);
$('#chat-row').append($(""+ data.text[i] +""));
}
}
/* manage position of current chat */
document.getElementById('chat-row').scrollTop = document.getElementById('chat-row').scrollHeight;
instanse = false;
state = data.state;
}
});
}
else {
setTimeout(updateChat, 1000);
}
}
.append( content [, content ] ), where content is DOM element, text node, array of elements and text nodes, HTML string, or jQuery object to insert at the end of each element in the set of matched elements.
I think $(""+ data.text[i] +"") == [Object, oblect]
function updateChat() {
if(!instanse){
instanse = true;
/* define AJAX function */
$.ajax({
type: "POST",
url: "ajax.php",
data: {'function': 'update','state': state,'file': file},
dataType: "json",
success: function(data) {
if(data.text){
/* manage data */
for (var i = 0; i < data.text.length; i++) {
alert(data.text[i]);
$('#chat-row').append($(data.text[i]));
}
}
/* manage position of current chat */
document.getElementById('chat-row').scrollTop = document.getElementById('chat-row').scrollHeight;
instanse = false;
state = data.state;
}
});
} else {
setTimeout(updateChat, 1000);
}
}
I managed to solve this problem by replacing this:
success: function(data) {
if(data.text){
/* manage data */
for (var i = 0; i < data.text.length; i++) {
alert(data.text[i]);
$('#chat-row').append($(data.text[i]));
}
}
with this:
success: $('#chat-row').load('data.txt')
I am trying to populate a dropdownbox with data from a JSON page.
Here is the code I am using:
<script type="text/javascript" charset="utf-8">
$(document).ready(function () {
$.ajax({
url: "json/wcf.svc/GetTax",
dataType: 'json',
data: data
});
$($.parseJSON(data.msg)).map(function () {
return $('<option>').val(this.value).text(this.label);
}).appendTo('#taxList');
});
</script>
And here is what the json data returns:
{"d":"{\"16\":\"hello\",\"17\":\"world\"}"}
I am getting an error that "data is undefined." Do I have to somehow tell JQ how to read the json data?
Firstly, the data variable you are passing to the ajax call is not defined (well, not in the code sample you provided), and secondly the ajax call is happening asynchornously, so you need to do something with the returned data, i.e. via a success callback. Example:
$(document).ready(function () {
var data = //define here
$.ajax({
url: "json/wcf.svc/GetTax",
dataType: 'json',
data: data, // pass it in here
success: function(data)
{
$(data.msg).map(function () {
return $('<option>').val(this.value).text(this.label);
}).appendTo('#taxList');
}
});
});
also you shouldn't need to parse the data returned from the ajax call, as jQuery will automatically parse the JSON for you, ( should need the $.parseJSON(data.msg))
EDIT
Based on the interesting format of the JSON, and assuming that it cannot be changed, this should work (ugly though)
$(document).ready(function () {
var data = //define here
$.ajax({
url: "json/wcf.svc/GetTax",
dataType: 'json',
data: data, // pass it in here
success: function(data)
{
data = data.d.replace(/{/g, '').replace(/}/g, '').split(',');
var obj = [];
for (var i = 0; i < data.length; i++) {
obj[i] = {
value: data[i].split(':')[0].replace(/"/g, '').replace('\\', ''),
label: data[i].split(':')[1].replace(/"/g, '')
};
}
var htmlToAppend = "";
for (var j = 0; j < obj.length; j++) {
htmlToAppend += '<option value="' +
obj[j].value +
'">' + obj[j].label +
'</option>';
}
$('#taxList').append(htmlToAppend);
}
});
});
You need to use the success option to return the data.
<script type="text/javascript" charset="utf-8">
$(document).ready(function () {
$.ajax({
url: "json/wcf.svc/GetTax",
dataType: 'json',
success: function(data){
$(data.msg).map(function () {
return $('<option>').val(this.value).text(this.label);
}).appendTo('#taxList');
}
});
});
</script>
I have an ajax for retrieving names from the database, when the names are more than one, i split them then clone the first class so that i can have the other name(second) in the cloned class. It seems not to work, What am i missing?
$.ajax({
type: "POST",
url: base_url + "c_transfer/viewTransfer/" + transfer_id,
dataType: "json",
success: function (data) {
var all_transferors = data[0]['Transferor_Name'];
var sole_transferors = all_transferors.split(',');
for (transferor_counter = 0; transferor_counter < sole_transferors.length; transferor_counter++) {
if (transferor_counter > 0) {
$('.clone').relCopy({});
$("#transferor_name").val(sole_transferors[transferor_counter]);
} else {
$("#transferor_name").val(sole_transferors[transferor_counter]);
console.log(sole_transferors[transferor_counter]);
}
// console.log(sole_transferors[transferor_counter]);
}
Are you trying to do this?
$("#transferor_name").val(sole_transferors[transferor_counter].val());
You need to use .val() at the end?