Re: [jQuery] [*Possible SPAM*] Re: rewriting generic ajax jQuery style

[Jim Wharton]

certainly:
 
<?xml version="1.0" 
encoding="utf-8"?><catagories><item><item_id>659</item_id><item_name>3 Gal 
Beverage
 Igloo Cooler</item_name></item><item><item_id>660</item_id><item_name>5 Gal 
Beverage Igloo Cooler</item_name
></item><item><item_id>661</item_id><item_name>10 Gal Beverage Igloo 
>Cooler</item_name></item><item>
<item_id>662</item_id><item_name>3 Gal Iced Tea 
Dispenser</item_name></item><item><item_id>663</item_id
><item_name>120 Qt. Ice 
>Sheet</item_name></item><item><item_id>664</item_id><item_name>Party Cooler<
/item_name></item><item><item_id>665</item_id><item_name>Keg 
Cooler</item_name></item></catagories>
I'm sorry that's not indented for viewability.... I just copied it out of 
firebug.
-Jim

-----Original Message-----
From: [EMAIL PROTECTED] [mailto:[EMAIL PROTECTED] Behalf Of Jake McGraw
Sent: Monday, March 05, 2007 5:07 PM
To: jQuery Discussion.
Subject: [*Possible SPAM*] Re: [jQuery] rewriting generic ajax jQuery style


Jim,  could you post a version of the XML data you'd expect?

- jake


On 3/5/07, Jim Wharton < [EMAIL PROTECTED]  <mailto:[EMAIL PROTECTED]> > wrote: 

Hi, I'm trying to change a bunch of handwritten Ajax stuff to use jQuery's 
methods. (I figure, if I'm already including the jquery.js file, I may as well 
use the heck out of it.)

My current code sends a request to a php page and gets back an xml result I do 
the standard way of creating a request object(try/catch for MSXML vs XHR)

here is the code to create my request and callback:

var http =  createRequestObject(); //this just references that object I just 
created.

function ajax ( url, callback )
{
        http.open ( 'get', url, true ); 
        http.onreadystatechange = callback;
        http.send(null);
}

function sendRequest() {
        var url = "getItems.php?cat_id=" + idsource;
        ajax( url, handleInfo );
}

my handleInfo function does a nice for loop based on an array(object) and 
generates table html for each "record":

function handleInfo() {
        if (http.readyState == 1) {
                //document.getElementById("itemtable" +idsource).innerHTML = 
'<h1>Loading...</h1>' 
        }
        if (http.readyState == 4) {
                if (http.status == 200) {
                                var xmlDoc = http.responseXML.documentElement;
                                var output; 
                                output = '<table><thead><tr><th>Items 
Available</th></tr></thead><tbody>';
                                // Create table rows for each record 
                                for (var i=0; i < xmlDoc.childNodes.length; i++)
                                {
                                        var linkId = 
xmlDoc.getElementsByTagName('item_id').item(i).firstChild.data; 
                                        output += '<tr>';
                                        output += '<td>'+linkId;
                                        output += '<td><a href=" 
itemdetail.php?item_id='+linkId+'" 
>'+xmlDoc.getElementsByTagName('item_name').item(i).firstChild.data+'</a></td>';
                                        output += '</tr>'; 
                                }
                                        output += '</tbody></table>';
                                        document.getElementById("itemtable" 
+idsource).innerHTML = output; 
                }
        }
}

Ok, fairly generic routine stuff. Only problem is, I can't bend my mind around 
the way to do it in jQuery!!! I have started playing around with the .get 
method:

$(document).ready(function() { 
                $('#resultcontainer').accordion();
                                $("dt").click(function(){
                                        idsource = $(this).attr("id");
                                        $.get("getItems.php", {cat_id: 
idsource}, function(xml){
                                                //build a table from xml 
results.
                                                var output = 
'<table><thead><tr><th>Items Available</th></tr></thead><tbody>'; 
                                                var xmlDoc = 
xml.documentElement;
                                                //create rows for each result.
                                                for (var i=0; i< 
xmlDoc.childNodes.length; i++)
                                                {
                                                        var linkId = 
$("item_id", xmlDoc).item(i).firstChild.data;
                                                        output += '<tr>'; 
                                                        output += 
'<td>'+linkId+'</td>';
                                                        output += '</tr>';
                                                } 
                                                output += '</tbody></table>';
                                                
$('#itemtable'+idsource).html(output);
                                        }); 
                                })
                                });

but this seems to cough up errors about linkId not being a function..... Am I 
at least on the right path?

What this code does is everytime one clicks on a "dt" element, it sends the 
request based on the id.... (just a number) then it submits the ajax request. 
I'm really not sure at all how to deal with the object it returns... so that's 
why you see me treating it just like I would any other xml object. 

I'd be happy to post all my code but I don't want to suck up a ton of 
bandwidth... this being my first post and all that.....

(In a future revision of this code, I'll actually let the accordian wait until 
the object is returned before I slide it down.....) 

Thanks,
-Jim


.-*** Message Scanned by Alachua County McAfee Webshield Appliance ***-.
_______________________________________________
jQuery mailing list
discuss@jquery.com
http://jquery.com/discuss/





  _____  

.-=== Message Scanned by Alachua County McAfee Webshield Appliance ===-. 





.-*** Message Scanned by Alachua County McAfee Webshield Appliance ***-.

_______________________________________________
jQuery mailing list
discuss@jquery.com
http://jquery.com/discuss/