[jQuery] Re: progressive enhancement link href hurdle
Thank you both for your replys. I have been doing more reading on the subject and a plugin would quite possibly bring in more overhead, thus the split is just what i need. I am and can assume that the site will always end up with a '?' and then the query string for the cases i am parsing. That works a treat! On Jan 15, 10:22 pm, "Alexandre Plennevaux" <[EMAIL PROTECTED]> wrote: > there is a plugin that is quite useful for what you need: > > http://www.mathias-bank.de/2007/04/21/jquery-plugin-geturlparam-versi... > > please note that there is an error in the plugin code or a possible change > since jquery.1.2.2b > > if ($(this).attr("src") != "undefined") { > > does not work. It needs to be > > if ($(this).attr("src")) { > > same for the other IF conditions. > > HTH, > > alex > > -- Original Message ------ > To: jQuery (English) (jquery-en@googlegroups.com) > From: George ([EMAIL PROTECTED]) > Subject: [jQuery] Re: progressive enhancement link href hurdle > Date: 15/1/2008 9:35:03 > > I'm not aware of any native jQuery methods to "deserialise" your href > query params but I'm sure someone could suggest a plug that does it. > > Perhaps you don't need to extract the params? Why not just set the > "url" value in your ajax call to include the params from your href > string, params and all, and ignore the "data" option? Or perhaps use > url: "rpc.php?" + data.split("?")[1] > > Failing that you could tackle it using split() and arrays with code > like this: > > Using your example: Add Item 1 > Section 1 > > var href = $("A").attr("href");// Read the href attribute from > the tag (use your own selector here instead of "A"). > var query = href.split("?"); // Separate href string at the > question mark. > var params = query[1].split("&"); // Take all text that follows the > question mark and separate it at the &'s. > > You now have an array of name=value pairs that your could loop through > and use. Eg use jQuery.each() > You may then wish to copy the name=value pairs into an object/map. > > A shorthand for the 3 lines above might be: var params = $ > ("A").attr("href").split("?")[1].split("&"); > (Code is untested and assumes there will always be query params in the > href and only one question mark) > > Hope this helps > > George > > On Jan 14, 9:53 pm, toadeny <[EMAIL PROTECTED]> wrote: > > Hi All, > > > I want to use a whole bunch of jQuery functionality on a website and > > still have it accessible in its current form. I believe the term for > > such a process is 'progressive enhancement' > > > Correct me if I'm wrong but I understand about adding enhancements to > > an existing webapp is that: > > 1) There are three layers to a website: HTML,CSS and JS > > 2) Each layer adds more functionality/style/interaction than the last > > and these layers should be applied in order to all browsers than are > > compatible > > > So with that in mind I went off to enhance my existing webapp. > > > There are a lot of links on the website that i would like to turn into > > Ajax interactions. > > They are generally like this: > > Add Item 1 Section 1 > > > I want to have an easy way of extracting all parameters from the href > > or maybe supplying an object in the a href for jQuery to parse: > > > I thought of something like this which would be a matter of changing a > > few templates on the site: > > Add Item 1 > > > I might well be completely off track but Is it legal (W3C) to just add > > your own attributes to a tag like this? > > Would this work and how would i get it into an object to use in my > > click function?: (i'm guessing here) > > > Regardless of that here is my script thus far: > > > HTML: > > > > > http://www.w3.org/1999/xhtml";> > > > > > > > > > > > > > Test > > > > > > > > > > Add Item 1 > > Section 1 > > Add Item 2 > > Section 2 > > Add Item 3 > > Section 3 > > > > > > > > > > > > JS: > > > > > function doRPC(data) { > > $.ajax({ > > type: "GET", > > url: "rpc.php", > > data: data, > > error: function() { $('#msg').text('There was an error compl
[jQuery] Re: progressive enhancement link href hurdle
Speaking of Progressive Enhancement, there's a concept called "Hijax". That means nothing else than simply ajaxifying links without altering the href attribute at all and instead using the given one. An example of that technique can be found here: http://stilbuero.de/jquery/history In your case that just means you're making XHR requests to "index.php? do=add&id=1&s=1" instead of "rpc.php?do=add&id=1&s=1". That would completely save you the hassle to deserialize parameters and hardcoding another URL into the doRPC function, which in the end makes the whole application easier to maintain I guess. In the backend you would be able to distinguish between an Ajax and a normal request by checking the header "X-Requested-With: XMLHttpRequest" and take action accordingly. Just a thought... --Klaus On Jan 14, 10:53 pm, toadeny <[EMAIL PROTECTED]> wrote: > Hi All, > > I want to use a whole bunch of jQuery functionality on a website and > still have it accessible in its current form. I believe the term for > such a process is 'progressive enhancement' > > Correct me if I'm wrong but I understand about adding enhancements to > an existing webapp is that: > 1) There are three layers to a website: HTML,CSS and JS > 2) Each layer adds more functionality/style/interaction than the last > and these layers should be applied in order to all browsers than are > compatible > > So with that in mind I went off to enhance my existing webapp. > > There are a lot of links on the website that i would like to turn into > Ajax interactions. > They are generally like this: > Add Item 1 Section 1 > > I want to have an easy way of extracting all parameters from the href > or maybe supplying an object in the a href for jQuery to parse: > > I thought of something like this which would be a matter of changing a > few templates on the site: > Add Item 1 > > I might well be completely off track but Is it legal (W3C) to just add > your own attributes to a tag like this? > Would this work and how would i get it into an object to use in my > click function?: (i'm guessing here) > > Regardless of that here is my script thus far: > > HTML: > > > http://www.w3.org/1999/xhtml";> > > > > > > > Test > > > > > > Add Item 1 > Section 1 > Add Item 2 > Section 2 > Add Item 3 > Section 3 > > > > > > > JS: > > > function doRPC(data) { > $.ajax({ > type: "GET", > url: "rpc.php", > data: data, > error: function() { $('#msg').text('There was an error completing > your request, please try again later.'));}, > success: function(msg){ $('#msg').html(msg); }, > } > }); > return false; > > }; > > $(document).ready(function() { > $("a.addItem").click(function() { > doRPC($(this).attr('href')); > return false; > } > > } > > > > At the moment the data sent to the server is something like this: > Array([index.php?do=] => add [id] => 1 [s] => 1) > > Should i just deal with this ugly format in php and move on? > > Any help is appreciated. > > Thanks
[jQuery] Re: progressive enhancement link href hurdle
there is a plugin that is quite useful for what you need: http://www.mathias-bank.de/2007/04/21/jquery-plugin-geturlparam-version-2/ please note that there is an error in the plugin code or a possible change since jquery.1.2.2b if ($(this).attr(”src”) != “undefined”) { does not work. It needs to be if ($(this).attr(”src”)) { same for the other IF conditions. HTH, alex -- Original Message -- To: jQuery (English) (jquery-en@googlegroups.com) From: George ([EMAIL PROTECTED]) Subject: [jQuery] Re: progressive enhancement link href hurdle Date: 15/1/2008 9:35:03 I'm not aware of any native jQuery methods to "deserialise" your href query params but I'm sure someone could suggest a plug that does it. Perhaps you don't need to extract the params? Why not just set the "url" value in your ajax call to include the params from your href string, params and all, and ignore the "data" option? Or perhaps use url: "rpc.php?" + data.split("?")[1] Failing that you could tackle it using split() and arrays with code like this: Using your example: Add Item 1 Section 1 var href = $("A").attr("href");// Read the href attribute from the tag (use your own selector here instead of "A"). var query = href.split("?"); // Separate href string at the question mark. var params = query[1].split("&"); // Take all text that follows the question mark and separate it at the &'s. You now have an array of name=value pairs that your could loop through and use. Eg use jQuery.each() You may then wish to copy the name=value pairs into an object/map. A shorthand for the 3 lines above might be: var params = $ ("A").attr("href").split("?")[1].split("&"); (Code is untested and assumes there will always be query params in the href and only one question mark) Hope this helps George On Jan 14, 9:53 pm, toadeny <[EMAIL PROTECTED]> wrote: > Hi All, > > I want to use a whole bunch of jQuery functionality on a website and > still have it accessible in its current form. I believe the term for > such a process is 'progressive enhancement' > > Correct me if I'm wrong but I understand about adding enhancements to > an existing webapp is that: > 1) There are three layers to a website: HTML,CSS and JS > 2) Each layer adds more functionality/style/interaction than the last > and these layers should be applied in order to all browsers than are > compatible > > So with that in mind I went off to enhance my existing webapp. > > There are a lot of links on the website that i would like to turn into > Ajax interactions. > They are generally like this: > Add Item 1 Section 1 > > I want to have an easy way of extracting all parameters from the href > or maybe supplying an object in the a href for jQuery to parse: > > I thought of something like this which would be a matter of changing a > few templates on the site: > Add Item 1 > > I might well be completely off track but Is it legal (W3C) to just add > your own attributes to a tag like this? > Would this work and how would i get it into an object to use in my > click function?: (i'm guessing here) > > Regardless of that here is my script thus far: > > HTML: > > > http://www.w3.org/1999/xhtml";> > > > > > > > Test > > > > > > Add Item 1 > Section 1 > Add Item 2 > Section 2 > Add Item 3 > Section 3 > > > > > > > JS: > > > function doRPC(data) { > $.ajax({ > type: "GET", > url: "rpc.php", > data: data, > error: function() { $('#msg').text('There was an error completing > your request, please try again later.'));}, > success: function(msg){ $('#msg').html(msg); }, > } > }); > return false; > > }; > > $(document).ready(function() { > $("a.addItem").click(function() { > doRPC($(this).attr('href')); > return false; > } > > } > > > > At the moment the data sent to the server is something like this: > Array([index.php?do=] => add [id] => 1 [s] => 1) > > Should i just deal with this ugly format in php and move on? > > Any help is appreciated. > > Thanks Alexandre Plennevaux - LAb[au] asbl.vzw / MediaRuimte Lakensestraat/Rue de Laeken 104 B-1000 Brussel-Bruxelles-Brussels Belgie-Belgique-Belgium Tel:+32(0)2.219.65.55 Fax:+32(0)2.426.69.86 Mobile:+32(0)476.23.21.42 http://www.lab-au.com http://www.mediaruimte.be __ The information in this e-mail is intended only for the addressee named above. If you are not that addressee, please note that any disclosure, distribution or copying of this e-mail is prohibited. Because e-mail can be electronically altered, the integrity of this communication cannot be guaranteed. __
[jQuery] Re: progressive enhancement link href hurdle
I'm not aware of any native jQuery methods to "deserialise" your href query params but I'm sure someone could suggest a plug that does it. Perhaps you don't need to extract the params? Why not just set the "url" value in your ajax call to include the params from your href string, params and all, and ignore the "data" option? Or perhaps use url: "rpc.php?" + data.split("?")[1] Failing that you could tackle it using split() and arrays with code like this: Using your example: Add Item 1 Section 1 var href = $("A").attr("href");// Read the href attribute from the tag (use your own selector here instead of "A"). var query = href.split("?"); // Separate href string at the question mark. var params = query[1].split("&"); // Take all text that follows the question mark and separate it at the &'s. You now have an array of name=value pairs that your could loop through and use. Eg use jQuery.each() You may then wish to copy the name=value pairs into an object/map. A shorthand for the 3 lines above might be: var params = $ ("A").attr("href").split("?")[1].split("&"); (Code is untested and assumes there will always be query params in the href and only one question mark) Hope this helps George On Jan 14, 9:53 pm, toadeny <[EMAIL PROTECTED]> wrote: > Hi All, > > I want to use a whole bunch of jQuery functionality on a website and > still have it accessible in its current form. I believe the term for > such a process is 'progressive enhancement' > > Correct me if I'm wrong but I understand about adding enhancements to > an existing webapp is that: > 1) There are three layers to a website: HTML,CSS and JS > 2) Each layer adds more functionality/style/interaction than the last > and these layers should be applied in order to all browsers than are > compatible > > So with that in mind I went off to enhance my existing webapp. > > There are a lot of links on the website that i would like to turn into > Ajax interactions. > They are generally like this: > Add Item 1 Section 1 > > I want to have an easy way of extracting all parameters from the href > or maybe supplying an object in the a href for jQuery to parse: > > I thought of something like this which would be a matter of changing a > few templates on the site: > Add Item 1 > > I might well be completely off track but Is it legal (W3C) to just add > your own attributes to a tag like this? > Would this work and how would i get it into an object to use in my > click function?: (i'm guessing here) > > Regardless of that here is my script thus far: > > HTML: > > > http://www.w3.org/1999/xhtml";> > > > > > > > Test > > > > > > Add Item 1 > Section 1 > Add Item 2 > Section 2 > Add Item 3 > Section 3 > > > > > > > JS: > > > function doRPC(data) { > $.ajax({ > type: "GET", > url: "rpc.php", > data: data, > error: function() { $('#msg').text('There was an error completing > your request, please try again later.'));}, > success: function(msg){ $('#msg').html(msg); }, > } > }); > return false; > > }; > > $(document).ready(function() { > $("a.addItem").click(function() { > doRPC($(this).attr('href')); > return false; > } > > } > > > > At the moment the data sent to the server is something like this: > Array([index.php?do=] => add [id] => 1 [s] => 1) > > Should i just deal with this ugly format in php and move on? > > Any help is appreciated. > > Thanks