Thanks Pops.
I ended up generating the HTML in my PHP code, then just doing a
.load(). (yeah, lazy way out, I know, but... :)
I'll keep your tip in mind though. I'll be doing a lot of Ajax with
this app and will likely see this again soon.
Shawn
Pops wrote:
> Note, in my example url: "json-data.wct" it is my equivalent to your
> "PHP" for our web server. In this case, json-data-wct, is simply a
> dump of:
>
> MyJSON({"items": [
> { id: "111", organization: "open2space",
> start: new Date("2007-09-24 20:13:00"),
> end: new Date("2007-09-24 16:13:00"),
> duration: "2", work_type: "Programming",
> project: "simpleTracker",
> description: "Test 8" },
> { id: "112", organization: "open2space",
> start: new Date("2007-09-24 19:14:00"),
> end: new Date("2007-09-24 22:14:00"), duration: "3",
> work_type: "Programming", project: "simpleTracker",
> description: "Test 9" },
> { id: "113", organization: "open2space",
> start: new Date("2007-09-24 19:14:00"),
> end: new Date("2007-09-24 22:14:00"),
> duration: "3",
> work_type: "Programming",
> project: "simpleTracker",
> description: "Test 9" },
> { id: "114",
> organization: "open2space",
> start: new Date("2007-09-24 18:14:00"),
> end: new Date("2007-09-24 22:14:00"),
> duration: "4",
> work_type: "Programming",
> project: "simpleTracker",
> description: "Tst 10" }
> ]});
>
> jsonp (note the p) works by you creating a function (in this case
> MyJSON) that will handle the data. The response is essentially a
> "javascript" that jQuery Ajax will "eval-uate". The javascript is a
> callback to this function with the parameter being your actual JSON
> data.
>
> --
> HLS
>
> On Sep 25, 9:20 am, Pops <[EMAIL PROTECTED]> wrote:
>> I did the following to make it work:
>>
>> I wrapped the data as such:
>>
>> MyJSON({
>> items: [
>> your items here
>> ]
>>
>> });
>>
>> then I created a function:
>>
>> Function MyJSON(data)
>> {
>> var json = data.items;
>> var tbl = "<table border='1' class=\"tblTimeCards\">";
>> tbl += "<thead><tr>";
>> tbl += "<th>Id</th>";
>> tbl += "<th>Client</th>";
>> tbl += "<th>Project</th>";
>> tbl += "<th>Start</th>";
>> tbl += "<th>End</th>";
>> tbl += "<th>Duration</th>";
>> tbl += "<th>Description</th>";
>> tbl += "</tr></thead>";
>> tbl += "<tbody>";
>> for (var x = 0; x < json.length; x++) {
>> tbl += "<tr>";
>> tbl += "<td class=\"tcID\">" + json[x].id + "</td>";
>> tbl += "<td class=\"tcClient\">" + json[x].organization + "</td>";
>> tbl += "<td class=\"tcProject\">" + json[x].project + "</td>";
>> tbl += "<td class=\"tcStart\">" + json[x].start + "</td>";
>> tbl += "<td class=\"tcEnd\">" + json[x].end + "</td>";
>> tbl += "<td class=\"tcDuration\">" + json[x].duration + "</td>";
>> tbl += "<td class=\"tcDesc\">" + json[x].description + "</td>";
>> tbl += "</tr>";
>> }
>> tbl += "<tbody>";
>> $(".tcList").html(tbl);
>>
>> }
>>
>> then I changed the ajax call to this:
>>
>> var xhr = $.ajax({
>> type: "get",
>> url: "json-data.wct",
>> dataType: "jsonp",
>> error: function (a,b,c) {
>> alert("Error retrieving recent records\n\nstatus: " +
>> a.status +"\n\n" + a.responseText);
>> }
>> });
>>
>> Note the "jsonp".
>>
>> This worked.
>>
>> --
>> HLS
>>
>> On Sep 25, 1:38 am, sgrover <[EMAIL PROTECTED]> wrote:
>>
>>> I'm dong an Ajax call to retrieve some JSON and build a table from this.
>>> (code posted below.) The Ajax call is never firing the "success"
>>> function, but if I include an "error" function, that is called. Yet in
>>> that error function, checking the status code shows a "200" and the
>>> response text is my JSON code. The page in question loads just fine on
>>> it's own and the JSON looks fine. So I'm not sure why the error
>>> condition is being called. I'm sure it's something stupid, but I can't
>>> see it. Any tips? I've tried both jQuery 1.1.4 and 1.2.1.
>>> Shawn
>>> CODE:
>>> $.ajax({
>>> type: "get",
>>> url: "xhr/tc_recent.php",
>>> dataType: "json",
>>> success: function (json) {
>>> alert(json.length);
>>> var tbl = "<table class=\"tblTimeCards\">";
>>> tbl += "<thead><tr>";
>>> tbl += "<th>Id</th>";
>>> tbl += "<th>Client</th>";
>>> tbl += "<th>Project</th>";
>>> tbl += "<th>Start</th>";
>>> tbl += "<th>End</th>";
>>> tbl += "<th>Duration</th>";
>>> tbl += "<th>Description</th>";
>>> tbl += "</tr></thead>";
>>> tbl += "<tbody>";
>>> for (var x = 0; x < json.length; x++) {
>>> tbl += "<tr>";
>>> tbl += "<td class=\"tcID\">" + json[x].id + "</td>";
>>> tbl += "<td class=\"tcClient\">" + json[x].organization + "</td>";
>>> tbl += "<td class=\"tcProject\">" + json[x].project + "</td>";
>>> tbl += "<td class=\"tcStart\">" + json[x].start + "</td>";
>>> tbl += "<td class=\"tcEnd\">" + json[x].end + "</td>";
>>> tbl += "<td class=\"tcDuration\">" + json[x].duration + "</td>";
>>> tbl += "<td class=\"tcDesc\">" + json[x].description + "</td>";
>>> tbl += "</tr>";
>>> }
>>> tbl += "<tbody>";
>>> $(".tcList").html(tbl);
>>> },
>>> error: function (a,b,c) {
>>> alert("Error retrieving recent records\n\nstatus: " + a.status +
>>> "\n\n" + a.responseText);
>>> }
>>> });
>>> SAMPLE OF RETRIEVED JSON
>>> [
>>> { id: "111", organization: "open2space", start: new Date("2007-09-24
>>> 20:13:00"), end: new Date("2007-09-24 16:13:00"), duration: "2",
>>> work_type: "Programming", project: "simpleTracker", description: "Test
>>> 8" },
>>> { id: "112", organization: "open2space", start: new Date("2007-09-24
>>> 19:14:00"), end: new Date("2007-09-24 22:14:00"), duration: "3",
>>> work_type: "Programming", project: "simpleTracker", description: "Test
>>> 9" },
>>> { id: "113", organization: "open2space", start: new Date("2007-09-24
>>> 19:14:00"), end: new Date("2007-09-24 22:14:00"), duration: "3",
>>> work_type: "Programming", project: "simpleTracker", description: "Test
>>> 9" },
>>> { id: "114", organization: "open2space", start: new Date("2007-09-24
>>> 18:14:00"), end: new Date("2007-09-24 22:14:00"), duration: "4",
>>> work_type: "Programming", project: "simpleTracker", description: "Tst 10" }
>>> ]
>
