[jQuery] Re: Newbie Question: Finding and manipulating an element
Aaron, Not sure if you caught it, but I screwed up some quotes in my code snippet (stupid iphone). It should be: $('ul.foo li ul').addClass("bar"); On Mar 1, 9:25 am, Aaron Johnson wrote: > Greg, Nathan, Thanks very much for your help! > > On 1 March 2010 14:58, Nathan Klatt wrote: > > > On Mon, Mar 1, 2010 at 5:06 AM, Aaron Johnson > > wrote: > > > The top level list has an ID and associated css, I'd like to add a class > > to > > > each of the nested elements in order to style them differently. I > > > cannot manually add a class so wondered if I could do it with jQuery. > > > > I'm looking for a result like this: > > > > > > > > > class="portal-navigation-label">Home > > > > > > If all of the inner uls are styled the same you don't need a class, > > just add a rule to your css: > > > ul.foo > li > ul { > > /* style stuff */ > > } > > > Nathan
[jQuery] Re: Newbie Question: Finding and manipulating an element
This will add the class for you. Put it in the document ready function if you want it on page load or in whatever function you want to call it from. $('ul.foo li 'ul").addClass("bar"); On Mar 1, 5:06 am, Aaron Johnson wrote: > Hello... > > I have an unordered list containing nested lists... > > > class="portal-navigation-label">Home > > href="foo.html">Announcements > href="foo.html">Announcements > href="foo.html">Announcements > > > class="portal-navigation-label">Home > > href="foo.html">Announcements > href="foo.html">Announcements > href="foo.html">Announcements > > > class="portal-navigation-label">Home > > href="foo.html">Announcements > href="foo.html">Announcements > href="foo.html">Announcements > > > > > The top level list has an ID and associated css, I'd like to add a class to > each of the nested elements in order to style them differently. I > cannot manually add a class so wondered if I could do it with jQuery. > > I'm looking for a result like this: > > > class="portal-navigation-label">Home > > href="foo.html">Announcements > href="foo.html">Announcements > href="foo.html">Announcements > > > class="portal-navigation-label">Home > > href="foo.html">Announcements > href="foo.html">Announcements > href="foo.html">Announcements > > > class="portal-navigation-label">Home > > href="foo.html">Announcements > href="foo.html">Announcements > href="foo.html">Announcements > > > > > Thanks for your help! > > Aaron
[jQuery] Re: Newbie Question
I don't know what to make of that Coldfusion code (makes me long for Perl) but what I would do is display the msg div then use $.ajax() to send a request to the server. Use the 'success' callback function to then hide the msg div when your server-side code is done. On Wed, Oct 14, 2009 at 4:17 PM, Tiger wrote: > > I am running a function that takes a long time to run in coldfusion. > I would like to display a Loading Data message when the data needs to > be loaded then hide that message once the data load is complete. What > jQuery functions do you recommend and what basic approach do I need to > take. > > This is what I have (non qQuery approach), but the cfflush seems to > have issues on the production server. > > > > ('Load_Office','Loading Office Data .')> > EmployeeDB/cfc/Office').init(#p_OfficeID#)> > ('Load_Office')> > > > > output="yes"> > > > > > > > > > > > output="yes"> > > > document.#FormName#.style.height="0px"; > document.#FormName#.style.margin = "0px"; > document.#FormName#.style.visibility="hidden"; > document.#FormName#.style.margin="0px"; > > document.#FormName#.inMessage.value = "Load Complete"; > document.#FormName#.inMessage.style.height="0px"; > document.#FormName#.inMessage.style.margin="0px"; > document.#FormName#.inMessage.style.padding="0px"; > document.#FormName#.inMessage.style.visibility="hidden"; > > > > >
[jQuery] Re: Newbie Question
Just local machine right now...nothing online unfortunately. I am using CakePHP which allows me to add the js files I need for each page individually. So I have 1 page that has a horizontal slider like the one on the Apple MAC site..which works if I access the page directly. But when I load that into a div on another page it stops working. That's where I am stuck -Original Message- From: Liam Potter [mailto:radioactiv...@gmail.com] Sent: August-04-09 2:01 PM To: jquery-en@googlegroups.com Subject: [jQuery] Re: Newbie Question Do you have an online example so I can get a better picture of just what you are trying to do? Dave Maharaj :: WidePixels.com wrote: > Yes I have. > > Might be dumb of me but I will ask. > Originally the > > and the needed js files were on the page specifically needing it. > > But now that I am loading that page into one... Where do the scripts > and files go? > > Do they now go to the page that they will be loaded into or do they > stay on their own original page? > > Page 1 > > page1.js > > > > > > Page 2 > > page2.js > > > > > Since Page 2 is going to be loaded into page 1 DIV do I move the page2 > scripts to page 1? > > Dave > > > -Original Message- > From: Liam Potter [mailto:radioactiv...@gmail.com] > Sent: August-04-09 1:34 PM > To: jquery-en@googlegroups.com > Subject: [jQuery] Re: Newbie Question > > > Have you updated the original script to my one? > > > function _ajaxInit() { > $("a.group").fancybox( > { > 'overlayShow': true > }); > }); > window.onload = function () { > $('.sliderGallery').each(function(){ >var id_parts = $(this).attr('id').split('_'); > var id = id_parts[id_parts.length - 1]; > var container = $('#sliderGallery_' + id) ; > var ul = $('ul', container); > var itemsWidth = ul.innerWidth() - > container.outerWidth(); > > $('.slider', container).slider({ > min: 0, > max: itemsWidth, > handle: '.handle', > stop: function (event, ui) { > ul.animate({'left' : ui.value * -1}, 500); > }, > slide: function (event, ui) { > ul.css('left', ui.value * -1); > } > }); > }); > } > > > > > Dave Maharaj :: WidePixels.com wrote: > >> 3 Errors >> >> syntax error >> [Break on this error] });\n >> (line 167) >> >> syntax error >> [Break on this error] });\n >> (line 6) >> >> _ajaxInit is not defined >> [Break on this error] _ajaxInit();\n >> >> That's what I see now but still nothing good happening. >> >> dave >> >> -Original Message- >> From: Liam Potter [mailto:radioactiv...@gmail.com] >> Sent: August-04-09 1:19 PM >> To: jquery-en@googlegroups.com >> Subject: [jQuery] Re: Newbie Question >> >> >> yeah, use the modified script and add _ajaxInit(); to the callback; >> >> $('a.profile_data').click(function(){ >> var url = $(this).attr('href'); >> //alert(url); >> $('#loadHere').fadeOut('fast', function(){ >> $('#loadHere').load(url, function(){ >> $('#loadHere').fadeIn('fast'); >> _ajaxInit(); >> }); >> }); >> return false; >> }); >> >> >> >> Dave Maharaj :: WidePixels.com wrote: >> >> >>> Nope...no go. >>> >>> All I have for the "tabs" are just straight links calling the script >>> to load the page. >>> >>> $('a.profile_data').click(function(){ >>> var url = $(this).attr('href'); >>> //alert(url); >>> $('#loadHere').fadeOut('fast', function(){ >>> $('#loadHere').load(url, function(){ >>> $('#loadHere').fadeIn('fast'); >>> }); >>> }); >>> return false; >>> }); >>> >>> Dave >>> >>> -Original Message- >>> From: Liam Potter [mailto:radioactiv...@gmail.com] >>
[jQuery] Re: Newbie Question
Do you have an online example so I can get a better picture of just what you are trying to do? Dave Maharaj :: WidePixels.com wrote: Yes I have. Might be dumb of me but I will ask. Originally the </tt><pre style="margin: 0em;"> and the needed js files were on the page specifically needing it. But now that I am loading that page into one... Where do the scripts and files go? Do they now go to the page that they will be loaded into or do they stay on their own original page? Page 1 page1.js </tt><pre style="margin: 0em;"> Page 2 page2.js </tt><pre style="margin: 0em;"> Since Page 2 is going to be loaded into page 1 DIV do I move the page2 scripts to page 1? Dave -Original Message- From: Liam Potter [mailto:radioactiv...@gmail.com] Sent: August-04-09 1:34 PM To: jquery-en@googlegroups.com Subject: [jQuery] Re: Newbie Question Have you updated the original script to my one? function _ajaxInit() { $("a.group").fancybox( { 'overlayShow': true }); }); window.onload = function () { $('.sliderGallery').each(function(){ var id_parts = $(this).attr('id').split('_'); var id = id_parts[id_parts.length - 1]; var container = $('#sliderGallery_' + id) ; var ul = $('ul', container); var itemsWidth = ul.innerWidth() - container.outerWidth(); </pre><tt> </tt><tt> $('.slider', container).slider({ </tt><pre style="margin: 0em;"> min: 0, max: itemsWidth, handle: '.handle', stop: function (event, ui) { ul.animate({'left' : ui.value * -1}, 500); }, slide: function (event, ui) { ul.css('left', ui.value * -1); } }); }); } Dave Maharaj :: WidePixels.com wrote: 3 Errors syntax error [Break on this error] });\n (line 167) syntax error [Break on this error] });\n (line 6) _ajaxInit is not defined [Break on this error] _ajaxInit();\n That's what I see now but still nothing good happening. dave -Original Message- From: Liam Potter [mailto:radioactiv...@gmail.com] Sent: August-04-09 1:19 PM To: jquery-en@googlegroups.com Subject: [jQuery] Re: Newbie Question yeah, use the modified script and add _ajaxInit(); to the callback; $('a.profile_data').click(function(){ var url = $(this).attr('href'); //alert(url); $('#loadHere').fadeOut('fast', function(){ $('#loadHere').load(url, function(){ $('#loadHere').fadeIn('fast'); _ajaxInit(); }); }); return false; }); Dave Maharaj :: WidePixels.com wrote: Nope...no go. All I have for the "tabs" are just straight links calling the script to load the page. $('a.profile_data').click(function(){ var url = $(this).attr('href'); //alert(url); $('#loadHere').fadeOut('fast', function(){ $('#loadHere').load(url, function(){ $('#loadHere').fadeIn('fast'); }); }); return false; }); Dave -Original Message- From: Liam Potter [mailto:radioactiv...@gmail.com] Sent: August-04-09 12:50 PM To: jquery-en@googlegroups.com Subject: [jQuery] Re: Newbie Question function _ajaxInit() { $("a.group").fancybox( { 'overlayShow': true }); }); window.onload = function () { $('.sliderGallery').each(function(){ var id_parts = $(this).attr('id').split('_'); var id = id_parts[id_parts.length - 1]; var container = $('#sliderGallery_' + id) ; var ul = $('ul', container); </pre><tt> var itemsWidth = ul.innerWidth() - </tt><tt>container.outerWidth(); </tt><tt> </tt><tt>$('.slider', container).slider({ </tt><pre style="margin: 0em;"> min: 0, max: itemsWidth, handle: '.handle', stop: function (event, ui) { ul.animate({'left' : ui.value * -1}, 500); }, slide: function (event, ui) { ul.css('left', ui.value * -1); } }); }); } _ajaxInit(); if that doesn'
[jQuery] Re: Newbie Question
Yes I have. Might be dumb of me but I will ask. Originally the and the needed js files were on the page specifically needing it. But now that I am loading that page into one... Where do the scripts and files go? Do they now go to the page that they will be loaded into or do they stay on their own original page? Page 1 page1.js Page 2 page2.js Since Page 2 is going to be loaded into page 1 DIV do I move the page2 scripts to page 1? Dave -Original Message- From: Liam Potter [mailto:radioactiv...@gmail.com] Sent: August-04-09 1:34 PM To: jquery-en@googlegroups.com Subject: [jQuery] Re: Newbie Question Have you updated the original script to my one? function _ajaxInit() { $("a.group").fancybox( { 'overlayShow': true }); }); window.onload = function () { $('.sliderGallery').each(function(){ var id_parts = $(this).attr('id').split('_'); var id = id_parts[id_parts.length - 1]; var container = $('#sliderGallery_' + id) ; var ul = $('ul', container); var itemsWidth = ul.innerWidth() - container.outerWidth(); $('.slider', container).slider({ min: 0, max: itemsWidth, handle: '.handle', stop: function (event, ui) { ul.animate({'left' : ui.value * -1}, 500); }, slide: function (event, ui) { ul.css('left', ui.value * -1); } }); }); } Dave Maharaj :: WidePixels.com wrote: > 3 Errors > > syntax error > [Break on this error] });\n > (line 167) > > syntax error > [Break on this error] });\n > (line 6) > > _ajaxInit is not defined > [Break on this error] _ajaxInit();\n > > That's what I see now but still nothing good happening. > > dave > > -----Original Message- > From: Liam Potter [mailto:radioactiv...@gmail.com] > Sent: August-04-09 1:19 PM > To: jquery-en@googlegroups.com > Subject: [jQuery] Re: Newbie Question > > > yeah, use the modified script and add _ajaxInit(); to the callback; > > $('a.profile_data').click(function(){ > var url = $(this).attr('href'); > //alert(url); > $('#loadHere').fadeOut('fast', function(){ > $('#loadHere').load(url, function(){ > $('#loadHere').fadeIn('fast'); > _ajaxInit(); > }); > }); > return false; > }); > > > > Dave Maharaj :: WidePixels.com wrote: > >> Nope...no go. >> >> All I have for the "tabs" are just straight links calling the script >> to load the page. >> >> $('a.profile_data').click(function(){ >> var url = $(this).attr('href'); >> //alert(url); >> $('#loadHere').fadeOut('fast', function(){ >> $('#loadHere').load(url, function(){ >> $('#loadHere').fadeIn('fast'); >> }); >> }); >> return false; >> }); >> >> Dave >> >> -Original Message- >> From: Liam Potter [mailto:radioactiv...@gmail.com] >> Sent: August-04-09 12:50 PM >> To: jquery-en@googlegroups.com >> Subject: [jQuery] Re: Newbie Question >> >> >> >> function _ajaxInit() { >>$("a.group").fancybox( >> { >> 'overlayShow': true >> }); >>}); >> window.onload = function () { >> $('.sliderGallery').each(function(){ >> var id_parts = $(this).attr('id').split('_'); >> var id = id_parts[id_parts.length - 1]; >> var container = $('#sliderGallery_' + id) ; >> var ul = $('ul', container); >> var itemsWidth = ul.innerWidth() - >> container.outerWidth(); >> >> $('.slider', container).slider({ >> min: 0, >> max: itemsWidth, >> handle: '.handle', >> stop: function (event, ui) { >> ul.animate({'left' : ui.value * -1}, 500); >> }, >> slide: function (event, ui) { >> ul.css('left', ui.value * -1); >> } >> });
[jQuery] Re: Newbie Question
Have you updated the original script to my one? function _ajaxInit() { $("a.group").fancybox( { 'overlayShow': true }); }); window.onload = function () { $('.sliderGallery').each(function(){ var id_parts = $(this).attr('id').split('_'); var id = id_parts[id_parts.length - 1]; var container = $('#sliderGallery_' + id) ; var ul = $('ul', container); </pre><tt> var itemsWidth = ul.innerWidth() - </tt><tt>container.outerWidth(); </tt><tt> </tt><tt>$('.slider', container).slider({ </tt><pre style="margin: 0em;"> min: 0, max: itemsWidth, handle: '.handle', stop: function (event, ui) { ul.animate({'left' : ui.value * -1}, 500); }, slide: function (event, ui) { ul.css('left', ui.value * -1); } }); }); } Dave Maharaj :: WidePixels.com wrote: 3 Errors syntax error [Break on this error] });\n (line 167) syntax error [Break on this error] });\n (line 6) _ajaxInit is not defined [Break on this error] _ajaxInit();\n That's what I see now but still nothing good happening. dave -Original Message- From: Liam Potter [mailto:radioactiv...@gmail.com] Sent: August-04-09 1:19 PM To: jquery-en@googlegroups.com Subject: [jQuery] Re: Newbie Question yeah, use the modified script and add _ajaxInit(); to the callback; $('a.profile_data').click(function(){ var url = $(this).attr('href'); //alert(url); $('#loadHere').fadeOut('fast', function(){ $('#loadHere').load(url, function(){ $('#loadHere').fadeIn('fast'); _ajaxInit(); }); }); return false; }); Dave Maharaj :: WidePixels.com wrote: Nope...no go. All I have for the "tabs" are just straight links calling the script to load the page. $('a.profile_data').click(function(){ var url = $(this).attr('href'); //alert(url); $('#loadHere').fadeOut('fast', function(){ $('#loadHere').load(url, function(){ $('#loadHere').fadeIn('fast'); }); }); return false; }); Dave -Original Message- From: Liam Potter [mailto:radioactiv...@gmail.com] Sent: August-04-09 12:50 PM To: jquery-en@googlegroups.com Subject: [jQuery] Re: Newbie Question function _ajaxInit() { $("a.group").fancybox( { 'overlayShow': true }); }); window.onload = function () { $('.sliderGallery').each(function(){ var id_parts = $(this).attr('id').split('_'); var id = id_parts[id_parts.length - 1]; var container = $('#sliderGallery_' + id) ; var ul = $('ul', container); </pre><tt> var itemsWidth = ul.innerWidth() - </tt><tt>container.outerWidth(); </tt><tt> </tt><tt>$('.slider', container).slider({ </tt><pre style="margin: 0em;"> min: 0, max: itemsWidth, handle: '.handle', stop: function (event, ui) { ul.animate({'left' : ui.value * -1}, 500); }, slide: function (event, ui) { ul.css('left', ui.value * -1); } }); }); } _ajaxInit(); if that doesn't work, call _ajaxInit() on the tabs callback function Dave Maharaj :: WidePixels.com wrote: I have a standard php page with some jquery going on its working fine. Now I want to take that page and load it into a div on a different page (tabbed layout pretty much) but when I do the script no longer works when the page loads into the div. SCRIPT CURRENTLY ON THE PHP PAGE THAT WORKS WHEN VIEWED DIRECTLY IN BROWSER </tt><pre style="margin: 0em;"> $(document).ready(function() { $("a.group").fancybox( { 'overlayShow': true }); }); window.onload = function () { $('.sliderGallery').each(function(){ var id_parts = $(this).attr('id').split('_'); var id = id_parts[id_parts.length - 1]; var container = $('#sliderGallery_' + id) ; var ul = $('ul', container); </pre><tt> var itemsWidth = ul.innerWidth() - </tt><tt>container.outerWidth(); </tt><tt> </tt><tt>$('.slider', container).slider({ </tt><pre style="margin: 0em;"> min: 0, max: itemsWidth, handle: '.handle', stop: function (event, ui) { ul.animate({'left' : ui.value * -1}, 500); }, slide: function (event, ui) { ul.css('left', ui.value * -1); } }); }); } How can I get it to still work when loaded into the DIV? Thanks Dave
[jQuery] Re: Newbie Question
3 Errors syntax error [Break on this error] });\n (line 167) syntax error [Break on this error] });\n (line 6) _ajaxInit is not defined [Break on this error] _ajaxInit();\n That's what I see now but still nothing good happening. dave -Original Message- From: Liam Potter [mailto:radioactiv...@gmail.com] Sent: August-04-09 1:19 PM To: jquery-en@googlegroups.com Subject: [jQuery] Re: Newbie Question yeah, use the modified script and add _ajaxInit(); to the callback; $('a.profile_data').click(function(){ var url = $(this).attr('href'); //alert(url); $('#loadHere').fadeOut('fast', function(){ $('#loadHere').load(url, function(){ $('#loadHere').fadeIn('fast'); _ajaxInit(); }); }); return false; }); Dave Maharaj :: WidePixels.com wrote: > Nope...no go. > > All I have for the "tabs" are just straight links calling the script > to load the page. > > $('a.profile_data').click(function(){ > var url = $(this).attr('href'); > //alert(url); > $('#loadHere').fadeOut('fast', function(){ > $('#loadHere').load(url, function(){ > $('#loadHere').fadeIn('fast'); > }); > }); > return false; > }); > > Dave > > -Original Message- > From: Liam Potter [mailto:radioactiv...@gmail.com] > Sent: August-04-09 12:50 PM > To: jquery-en@googlegroups.com > Subject: [jQuery] Re: Newbie Question > > > > function _ajaxInit() { >$("a.group").fancybox( > { > 'overlayShow': true > }); >}); > window.onload = function () { > $('.sliderGallery').each(function(){ > var id_parts = $(this).attr('id').split('_'); > var id = id_parts[id_parts.length - 1]; > var container = $('#sliderGallery_' + id) ; > var ul = $('ul', container); > var itemsWidth = ul.innerWidth() - > container.outerWidth(); > > $('.slider', container).slider({ > min: 0, > max: itemsWidth, > handle: '.handle', > stop: function (event, ui) { > ul.animate({'left' : ui.value * -1}, 500); > }, > slide: function (event, ui) { > ul.css('left', ui.value * -1); > } > }); > }); > } > _ajaxInit(); > > > if that doesn't work, call _ajaxInit() on the tabs callback function > > Dave Maharaj :: WidePixels.com wrote: > >> I have a standard php page with some jquery going on its working fine. >> >> Now I want to take that page and load it into a div on a different >> page (tabbed layout pretty much) but when I do the script no longer >> works when the page loads into the div. >> >> SCRIPT CURRENTLY ON THE PHP PAGE THAT WORKS WHEN VIEWED DIRECTLY IN >> BROWSER >> >> >> $(document).ready(function() { >>$("a.group").fancybox( >> { >> 'overlayShow': true >> }); >>}); >> window.onload = function () { >> $('.sliderGallery').each(function(){ >> var id_parts = $(this).attr('id').split('_'); >> var id = id_parts[id_parts.length - 1]; >> var container = $('#sliderGallery_' + id) ; >> var ul = $('ul', container); >> var itemsWidth = ul.innerWidth() - >> container.outerWidth(); >> >> $('.slider', container).slider({ >> min: 0, >> max: itemsWidth, >> handle: '.handle', >> stop: function (event, ui) { >> ul.animate({'left' : ui.value * -1}, 500); >> }, >> slide: function (event, ui) { >> ul.css('left', ui.value * -1); >> } >> }); >> }); >> } >> >> >> How can I get it to still work when loaded into the DIV? >> >> Thanks >> >> Dave >> > >
[jQuery] Re: Newbie Question
yeah, use the modified script and add _ajaxInit(); to the callback; $('a.profile_data').click(function(){ var url = $(this).attr('href'); //alert(url); $('#loadHere').fadeOut('fast', function(){ $('#loadHere').load(url, function(){ $('#loadHere').fadeIn('fast'); _ajaxInit(); }); }); return false; }); Dave Maharaj :: WidePixels.com wrote: Nope...no go. All I have for the "tabs" are just straight links calling the script to load the page. $('a.profile_data').click(function(){ var url = $(this).attr('href'); //alert(url); $('#loadHere').fadeOut('fast', function(){ $('#loadHere').load(url, function(){ $('#loadHere').fadeIn('fast'); }); }); return false; }); Dave -Original Message- From: Liam Potter [mailto:radioactiv...@gmail.com] Sent: August-04-09 12:50 PM To: jquery-en@googlegroups.com Subject: [jQuery] Re: Newbie Question function _ajaxInit() { $("a.group").fancybox( { 'overlayShow': true }); }); window.onload = function () { $('.sliderGallery').each(function(){ var id_parts = $(this).attr('id').split('_'); var id = id_parts[id_parts.length - 1]; var container = $('#sliderGallery_' + id) ; var ul = $('ul', container); var itemsWidth = ul.innerWidth() - container.outerWidth(); </pre><tt> </tt><tt>$('.slider', container).slider({ </tt><pre style="margin: 0em;"> min: 0, max: itemsWidth, handle: '.handle', stop: function (event, ui) { ul.animate({'left' : ui.value * -1}, 500); }, slide: function (event, ui) { ul.css('left', ui.value * -1); } }); }); } _ajaxInit(); if that doesn't work, call _ajaxInit() on the tabs callback function Dave Maharaj :: WidePixels.com wrote: I have a standard php page with some jquery going on its working fine. Now I want to take that page and load it into a div on a different page (tabbed layout pretty much) but when I do the script no longer works when the page loads into the div. SCRIPT CURRENTLY ON THE PHP PAGE THAT WORKS WHEN VIEWED DIRECTLY IN BROWSER </tt><pre style="margin: 0em;"> $(document).ready(function() { $("a.group").fancybox( { 'overlayShow': true }); }); window.onload = function () { $('.sliderGallery').each(function(){ var id_parts = $(this).attr('id').split('_'); var id = id_parts[id_parts.length - 1]; var container = $('#sliderGallery_' + id) ; var ul = $('ul', container); </pre><tt> var itemsWidth = ul.innerWidth() - </tt><tt>container.outerWidth(); </tt><tt> </tt><tt>$('.slider', container).slider({ </tt><pre style="margin: 0em;"> min: 0, max: itemsWidth, handle: '.handle', stop: function (event, ui) { ul.animate({'left' : ui.value * -1}, 500); }, slide: function (event, ui) { ul.css('left', ui.value * -1); } }); }); } How can I get it to still work when loaded into the DIV? Thanks Dave
[jQuery] Re: Newbie Question
Nope...no go. All I have for the "tabs" are just straight links calling the script to load the page. $('a.profile_data').click(function(){ var url = $(this).attr('href'); //alert(url); $('#loadHere').fadeOut('fast', function(){ $('#loadHere').load(url, function(){ $('#loadHere').fadeIn('fast'); }); }); return false; }); Dave -Original Message- From: Liam Potter [mailto:radioactiv...@gmail.com] Sent: August-04-09 12:50 PM To: jquery-en@googlegroups.com Subject: [jQuery] Re: Newbie Question function _ajaxInit() { $("a.group").fancybox( { 'overlayShow': true }); }); window.onload = function () { $('.sliderGallery').each(function(){ var id_parts = $(this).attr('id').split('_'); var id = id_parts[id_parts.length - 1]; var container = $('#sliderGallery_' + id) ; var ul = $('ul', container); var itemsWidth = ul.innerWidth() - container.outerWidth(); $('.slider', container).slider({ min: 0, max: itemsWidth, handle: '.handle', stop: function (event, ui) { ul.animate({'left' : ui.value * -1}, 500); }, slide: function (event, ui) { ul.css('left', ui.value * -1); } }); }); } _ajaxInit(); if that doesn't work, call _ajaxInit() on the tabs callback function Dave Maharaj :: WidePixels.com wrote: > I have a standard php page with some jquery going on its working fine. > > Now I want to take that page and load it into a div on a different > page (tabbed layout pretty much) but when I do the script no longer > works when the page loads into the div. > > SCRIPT CURRENTLY ON THE PHP PAGE THAT WORKS WHEN VIEWED DIRECTLY IN > BROWSER > > > $(document).ready(function() { >$("a.group").fancybox( > { > 'overlayShow': true > }); >}); > window.onload = function () { > $('.sliderGallery').each(function(){ > var id_parts = $(this).attr('id').split('_'); > var id = id_parts[id_parts.length - 1]; > var container = $('#sliderGallery_' + id) ; > var ul = $('ul', container); > var itemsWidth = ul.innerWidth() - > container.outerWidth(); > > $('.slider', container).slider({ > min: 0, > max: itemsWidth, > handle: '.handle', > stop: function (event, ui) { > ul.animate({'left' : ui.value * -1}, 500); > }, > slide: function (event, ui) { > ul.css('left', ui.value * -1); > } > }); > }); > } > > > How can I get it to still work when loaded into the DIV? > > Thanks > > Dave
[jQuery] Re: Newbie Question
function _ajaxInit() { $("a.group").fancybox( { 'overlayShow': true }); }); window.onload = function () { $('.sliderGallery').each(function(){ var id_parts = $(this).attr('id').split('_'); var id = id_parts[id_parts.length - 1]; var container = $('#sliderGallery_' + id) ; var ul = $('ul', container); var itemsWidth = ul.innerWidth() - container.outerWidth();$('.slider', container).slider({min: 0, max: itemsWidth, handle: '.handle', stop: function (event, ui) { ul.animate({'left' : ui.value * -1}, 500); }, slide: function (event, ui) { ul.css('left', ui.value * -1); } }); }); } _ajaxInit(); if that doesn't work, call _ajaxInit() on the tabs callback function Dave Maharaj :: WidePixels.com wrote: I have a standard php page with some jquery going on its working fine. Now I want to take that page and load it into a div on a different page (tabbed layout pretty much) but when I do the script no longer works when the page loads into the div. SCRIPT CURRENTLY ON THE PHP PAGE THAT WORKS WHEN VIEWED DIRECTLY IN BROWSER$(document).ready(function() { $("a.group").fancybox( { 'overlayShow': true }); }); window.onload = function () { $('.sliderGallery').each(function(){ var id_parts = $(this).attr('id').split('_'); var id = id_parts[id_parts.length - 1]; var container = $('#sliderGallery_' + id) ; var ul = $('ul', container); var itemsWidth = ul.innerWidth() - container.outerWidth();$('.slider', container).slider({min: 0, max: itemsWidth, handle: '.handle', stop: function (event, ui) { ul.animate({'left' : ui.value * -1}, 500); }, slide: function (event, ui) { ul.css('left', ui.value * -1); } }); }); } How can I get it to still work when loaded into the DIV? Thanks Dave
[jQuery] Re: newbie question.
On Jul 28, 5:53 am, James wrote: > This: > (function() { do some stuff } )(); > > is known as a closure. You have a warped view of a closure. It is an example of the module pattern, which can create closures, but doesn't necessarily do so. URL: http://www.jibbering.com/faq/faq_notes/closures.html > > It just runs once and it does not leave around > any global variables (that is, if you also don't set any inside this > function also). More or less. > Compared to this: > function doSomething() { // do some stuff }; > > The doSomething variable will exist (globally) to be available for > access again. There are many ways to created global variables, declaring a function in the global scope is one. > It will exist in memory, and may possibly "pollute" the > global namespace. This is usually a problem if you have a lot of other > Javascript that may have same variable name conflicts (e.g. multiple > Javascript libraries). In the first example, no such global variable > will exist. It will run once, and disappear. Maybe. There are other methods for avoiding name collisions. > In your example: > (function($) { do some stuff } )(jQuery); > > The $ variable (local) has the value of the jQuery (global) variable, > therefore, inside your closure, you can use $ as your jQuery variable. There is no closure unless "do some stuff" creates one (which would require a function declaration or expression inside the anonymous function at least). It is the fact that $ is created as a local variable and assigned a reference to the jQuery function that "protects" it from collisions outside the function. -- Rob
[jQuery] Re: newbie question.
No problem, Michael. Thanks for the clarification regarding an anonymous function and a closure, and the detailed explanation for closures. I'll give some related resources a good read on closures. :) On Jul 27, 1:46 pm, "Michael Geary" wrote: > That's a great explanation, James. I hope you won't mind if I nitpick a > point of terminology. > > The code you were talking about is not a closure: > > (function() { /* do some stuff */ })(); > > As you described, the advantage of this code is that any variables you > define inside the function won't pollute the global namespace. But that > doesn't make it a closure. A more accurate way to describe it is an > anonymous function expression that is called immediately. > > Here's a version of the code that doesn't use the anonymous function > expression. It's more obvious how this works: > > function someUniqueName() { > /* do some stuff */ > } > > someUniqueName(); > > That code does the same thing, except that it also leaves "someUniqueName" > defined in the global namespace (if it is a global function). As you > explained, the first version of the code avoids that namespace pollution. > Both versions do share the advantage that local variables inside the > function won't go into the global namespace. > > Now, either version of the code may *create* a closure, or it may not, > depending on what "some stuff" is. > > For example, this code does *not* create a closure: > > (function() { > var text = 'hi'; > alert( text ); > })(); > > Whereas this code *does* create a closure: > > (function() { > var text = 'hi'; > setTimeout( function() { > alert( text ); > }, 1000 ); > })(); > > What's the difference? The first example has a local variable 'text' which > is used temporarily while the function is running, but there is no need to > preserve that variable (or anything else in the function) after the function > returns. So as soon as the function returns, the 'text' variable is > available for garbage collection. > > The second example also has a local variable 'text', but this variable > *cannot* be released when the function returns. That's because the variable > is referenced in the setTimeout() callback function, which will be called a > full second later - long after the original function has return. > > So in this case, the 'text' variable has to be preserved for its later use > in the setTimeout() callback. > > That's what a closure is. It's when JavaScript has to preserve a function's > local variables (including any function arguments) after the function > returns. If there's no need to keep those variables in existence, then > JavaScript doesn't create a closure. > > This code creates a closure just like the last example does: > > function anotherUniqueName() { > var text = 'hi'; > setTimeout( function() { > alert( text ); > }, 1000 ); > } > > anotherUniqueName(); > > It's not the specific form of the function call that makes it a closure or > not, it's whether JavaScript has to preserve the function call's context > after the function returns. > > For the gory details, here's the "standard reference" on JavaScript > closures: > > http://www.jibbering.com/faq/faq_notes/closures.html > > -Mike > > > From: James > > > This: > > (function() { do some stuff } )(); > > > is known as a closure. It just runs once and it does not > > leave around any global variables (that is, if you also don't > > set any inside this function also). > > > Compared to this: > > function doSomething() { // do some stuff }; > > > The doSomething variable will exist (globally) to be > > available for access again. It will exist in memory, and may > > possibly "pollute" the global namespace. This is usually a > > problem if you have a lot of other Javascript that may have > > same variable name conflicts (e.g. multiple Javascript > > libraries). In the first example, no such global variable > > will exist. It will run once, and disappear. > > > In your example: > > (function($) { do some stuff } )(jQuery); > > > The $ variable (local) has the value of the jQuery (global) > > variable, therefore, inside your closure, you can use $ as > > your jQuery variable. > > On Jul 25, 6:35 am, Aleksey wrote: > > > Well, it's a common pattern that is used when creating a jQuery > > > plugin. > > > A common problem doing that is the use of a '$' sign, because other > > > frameworks use it too as well. I didn't try to use some frameworks > > > simultaneously yet, so I didn't encountered that problem by myself. > > > One of the way is to use 'jQuery' instead of '$' ('$' is a > > shorthand > > > of 'jQuery'), and to write, for example: > > > > jQuery('a').click(function() { }); > > > instead of > > > $('a').click(function() { }); > > > > But there is another way - this pattern allows you to use > > '$' in your > > > jQuery code without the worry of malfunctioning.
[jQuery] Re: newbie question.
That's a great explanation, James. I hope you won't mind if I nitpick a point of terminology. The code you were talking about is not a closure: (function() { /* do some stuff */ })(); As you described, the advantage of this code is that any variables you define inside the function won't pollute the global namespace. But that doesn't make it a closure. A more accurate way to describe it is an anonymous function expression that is called immediately. Here's a version of the code that doesn't use the anonymous function expression. It's more obvious how this works: function someUniqueName() { /* do some stuff */ } someUniqueName(); That code does the same thing, except that it also leaves "someUniqueName" defined in the global namespace (if it is a global function). As you explained, the first version of the code avoids that namespace pollution. Both versions do share the advantage that local variables inside the function won't go into the global namespace. Now, either version of the code may *create* a closure, or it may not, depending on what "some stuff" is. For example, this code does *not* create a closure: (function() { var text = 'hi'; alert( text ); })(); Whereas this code *does* create a closure: (function() { var text = 'hi'; setTimeout( function() { alert( text ); }, 1000 ); })(); What's the difference? The first example has a local variable 'text' which is used temporarily while the function is running, but there is no need to preserve that variable (or anything else in the function) after the function returns. So as soon as the function returns, the 'text' variable is available for garbage collection. The second example also has a local variable 'text', but this variable *cannot* be released when the function returns. That's because the variable is referenced in the setTimeout() callback function, which will be called a full second later - long after the original function has return. So in this case, the 'text' variable has to be preserved for its later use in the setTimeout() callback. That's what a closure is. It's when JavaScript has to preserve a function's local variables (including any function arguments) after the function returns. If there's no need to keep those variables in existence, then JavaScript doesn't create a closure. This code creates a closure just like the last example does: function anotherUniqueName() { var text = 'hi'; setTimeout( function() { alert( text ); }, 1000 ); } anotherUniqueName(); It's not the specific form of the function call that makes it a closure or not, it's whether JavaScript has to preserve the function call's context after the function returns. For the gory details, here's the "standard reference" on JavaScript closures: http://www.jibbering.com/faq/faq_notes/closures.html -Mike > From: James > > This: > (function() { do some stuff } )(); > > is known as a closure. It just runs once and it does not > leave around any global variables (that is, if you also don't > set any inside this function also). > > Compared to this: > function doSomething() { // do some stuff }; > > The doSomething variable will exist (globally) to be > available for access again. It will exist in memory, and may > possibly "pollute" the global namespace. This is usually a > problem if you have a lot of other Javascript that may have > same variable name conflicts (e.g. multiple Javascript > libraries). In the first example, no such global variable > will exist. It will run once, and disappear. > > In your example: > (function($) { do some stuff } )(jQuery); > > The $ variable (local) has the value of the jQuery (global) > variable, therefore, inside your closure, you can use $ as > your jQuery variable. > On Jul 25, 6:35 am, Aleksey wrote: > > Well, it's a common pattern that is used when creating a jQuery > > plugin. > > A common problem doing that is the use of a '$' sign, because other > > frameworks use it too as well. I didn't try to use some frameworks > > simultaneously yet, so I didn't encountered that problem by myself. > > One of the way is to use 'jQuery' instead of '$' ('$' is a > shorthand > > of 'jQuery'), and to write, for example: > > > > jQuery('a').click(function() { }); > > instead of > > $('a').click(function() { }); > > > > But there is another way - this pattern allows you to use > '$' in your > > jQuery code without the worry of malfunctioning. > > > > You can read more about the creating jQuery plugin in the following > > > articles:http://blog.themeforest.net/tutorials/ask-jw-decoding-self-in > > > voking-a...http://blog.jeremymartin.name/2008/02/building-your-first-j > > query-plug...http://docs.jquery.com/Tutorials > > > > Good luck) > > > > On Jul 25, 4:04 pm, Kris wrote: > > > > > What does this do? > > > (function($) { do some stuff } )(jQuery); > > > >
[jQuery] Re: newbie question.
This: (function() { do some stuff } )(); is known as a closure. It just runs once and it does not leave around any global variables (that is, if you also don't set any inside this function also). Compared to this: function doSomething() { // do some stuff }; The doSomething variable will exist (globally) to be available for access again. It will exist in memory, and may possibly "pollute" the global namespace. This is usually a problem if you have a lot of other Javascript that may have same variable name conflicts (e.g. multiple Javascript libraries). In the first example, no such global variable will exist. It will run once, and disappear. In your example: (function($) { do some stuff } )(jQuery); The $ variable (local) has the value of the jQuery (global) variable, therefore, inside your closure, you can use $ as your jQuery variable. On Jul 25, 6:35 am, Aleksey wrote: > Well, it's a common pattern that is used when creating a jQuery > plugin. > A common problem doing that is the use of a '$' sign, because other > frameworks use it too as well. I didn't try to use some frameworks > simultaneously yet, so I didn't encountered that problem by myself. > One of the way is to use 'jQuery' instead of '$' ('$' is a shorthand > of 'jQuery'), and to write, for example: > > jQuery('a').click(function() { }); > instead of > $('a').click(function() { }); > > But there is another way - this pattern allows you to use '$' in your > jQuery code without the worry of malfunctioning. > > You can read more about the creating jQuery plugin in the following > articles:http://blog.themeforest.net/tutorials/ask-jw-decoding-self-invoking-a...http://blog.jeremymartin.name/2008/02/building-your-first-jquery-plug...http://docs.jquery.com/Tutorials > > Good luck) > > On Jul 25, 4:04 pm, Kris wrote: > > > What does this do? > > (function($) { do some stuff } )(jQuery); > >
[jQuery] Re: newbie question.
Well, it's a common pattern that is used when creating a jQuery plugin. A common problem doing that is the use of a '$' sign, because other frameworks use it too as well. I didn't try to use some frameworks simultaneously yet, so I didn't encountered that problem by myself. One of the way is to use 'jQuery' instead of '$' ('$' is a shorthand of 'jQuery'), and to write, for example: jQuery('a').click(function() { }); instead of $('a').click(function() { }); But there is another way - this pattern allows you to use '$' in your jQuery code without the worry of malfunctioning. You can read more about the creating jQuery plugin in the following articles: http://blog.themeforest.net/tutorials/ask-jw-decoding-self-invoking-anonymous-functions/ http://blog.jeremymartin.name/2008/02/building-your-first-jquery-plugin-that.html http://docs.jquery.com/Tutorials Good luck) On Jul 25, 4:04 pm, Kris wrote: > What does this do? > (function($) { do some stuff } )(jQuery);
[jQuery] Re: Newbie Question....
Yes, your action script can be anything. Ted On Fri, Jul 17, 2009 at 2:40 PM, Greg Evans wrote: > > That looks great, and I think it is just what I need. I want to clarify > however, this shows to comment.php, but something like comment.pl should > work equally as well correct? > > > > On Jul 17, 2009, at 11:28 AM, brian wrote: > > >> Do you want the form to submit via AJAX? Have a look at the form plugin. >> >> http://malsup.com/jquery/form/ >> >> On Fri, Jul 17, 2009 at 1:47 PM, raisputin wrote: >> >>> >>> Hello, >>> >>> I have just discovered jQuery and it looks cool. I used the jQuery UI >>> builder at ui.jquery.com to build the UI and it looks and works >>> great :) Unfortunately I do not know enough about javascript to answer >>> my own question, so I am deferring to you :) >>> >>> I would like to have a tab with a dialog button on it, and when that >>> dialog comes up there will be a form. This part I can do easily enough >>> and have already implemented, however, what I need to do after that is >>> where I am stuck :( >>> >>> I want the user to fill out the form, say there are fields like >>> "Customer Name" "Telephone Number" and "D.O.B." and once that form is >>> filled out, and the user clicks OK, I want it to do the proper >>> inserts, etc into my mysql database. This is probably a very easy >>> question, but I have not found out anything useful so far through >>> various google searches. I would like to do the bulk of my mysql stuff >>> via perl/mason. Is there a tutorial anywhere for this or perhaps I >>> should be using a different technique? I am trying to avoid PHP simply >>> because I would prefer to not have to learn PHP while I am in the >>> process of learning the things I need for jQuery, but I can if I need >>> to. >>> >>> Any advice/help/examples would be greatly appreciated., >>> >>> Greg Evans >>> >> >
[jQuery] Re: Newbie Question....
That looks great, and I think it is just what I need. I want to clarify however, this shows to comment.php, but something like comment.pl should work equally as well correct? On Jul 17, 2009, at 11:28 AM, brian wrote: Do you want the form to submit via AJAX? Have a look at the form plugin. http://malsup.com/jquery/form/ On Fri, Jul 17, 2009 at 1:47 PM, raisputin wrote: Hello, I have just discovered jQuery and it looks cool. I used the jQuery UI builder at ui.jquery.com to build the UI and it looks and works great :) Unfortunately I do not know enough about javascript to answer my own question, so I am deferring to you :) I would like to have a tab with a dialog button on it, and when that dialog comes up there will be a form. This part I can do easily enough and have already implemented, however, what I need to do after that is where I am stuck :( I want the user to fill out the form, say there are fields like "Customer Name" "Telephone Number" and "D.O.B." and once that form is filled out, and the user clicks OK, I want it to do the proper inserts, etc into my mysql database. This is probably a very easy question, but I have not found out anything useful so far through various google searches. I would like to do the bulk of my mysql stuff via perl/mason. Is there a tutorial anywhere for this or perhaps I should be using a different technique? I am trying to avoid PHP simply because I would prefer to not have to learn PHP while I am in the process of learning the things I need for jQuery, but I can if I need to. Any advice/help/examples would be greatly appreciated., Greg Evans
[jQuery] Re: Newbie Question....
Do you want the form to submit via AJAX? Have a look at the form plugin. http://malsup.com/jquery/form/ On Fri, Jul 17, 2009 at 1:47 PM, raisputin wrote: > > Hello, > > I have just discovered jQuery and it looks cool. I used the jQuery UI > builder at ui.jquery.com to build the UI and it looks and works > great :) Unfortunately I do not know enough about javascript to answer > my own question, so I am deferring to you :) > > I would like to have a tab with a dialog button on it, and when that > dialog comes up there will be a form. This part I can do easily enough > and have already implemented, however, what I need to do after that is > where I am stuck :( > > I want the user to fill out the form, say there are fields like > "Customer Name" "Telephone Number" and "D.O.B." and once that form is > filled out, and the user clicks OK, I want it to do the proper > inserts, etc into my mysql database. This is probably a very easy > question, but I have not found out anything useful so far through > various google searches. I would like to do the bulk of my mysql stuff > via perl/mason. Is there a tutorial anywhere for this or perhaps I > should be using a different technique? I am trying to avoid PHP simply > because I would prefer to not have to learn PHP while I am in the > process of learning the things I need for jQuery, but I can if I need > to. > > Any advice/help/examples would be greatly appreciated., > > Greg Evans
[jQuery] Re: Newbie question
$(selector1, selector2).click(function(){}) http://docs.jquery.com/Selectors/multiple#selector1selector2selectorN e.g. $('td, th').click(function(){alert("clicked table cell");}); Colin On Jul 2, 6:09 am, Alexandru Adrian Dinulescu wrote: > Hello. > > I am trying to do something like this > $(element1 || element2).click(function(){}) > > unfortunately this does not work, both element1 and element2 work > independently but not together and i have no clue how to get them to work > together. > > Basically what i need that either when element1 is clicked, OR element2 is > clicked, do identical thing. > > I know this is a very simple issue, but i havent learned Javascript at all, > i've started with jQuery. > > Thank you
[jQuery] Re: Newbie question
Hello. Damn i'm so silly, i looked over the website and i totally didnt see that. Thanks a lot for pointing it Best Regards On Thu, Jul 2, 2009 at 2:17 PM, Charlie wrote: > http://docs.jquery.com/Selectors > > look at the last item in "Basics" , "Selector1,Selector2" and click on > it to see the example > > getting familiar with the jquery website categories of "selectors, > traversing, manipulation etc " is probably the #1 best tool for learning > jquery. > > Alexandru Adrian Dinulescu wrote: > > Hello. > > I am trying to do something like this > $(element1 || element2).click(function(){}) > > unfortunately this does not work, both element1 and element2 work > independently but not together and i have no clue how to get them to work > together. > > Basically what i need that either when element1 is clicked, OR element2 is > clicked, do identical thing. > > I know this is a very simple issue, but i havent learned Javascript at all, > i've started with jQuery. > > Thank you > > >
[jQuery] Re: Newbie question
http://docs.jquery.com/Selectors look at the last item in "Basics" , "Selector1,Selector2" and click on it to see the example getting familiar with the jquery website categories of "selectors, traversing, manipulation etc " is probably the #1 best tool for learning jquery. Alexandru Adrian Dinulescu wrote: Hello. I am trying to do something like this $(element1 || element2).click(function(){}) unfortunately this does not work, both element1 and element2 work independently but not together and i have no clue how to get them to work together. Basically what i need that either when element1 is clicked, OR element2 is clicked, do identical thing. I know this is a very simple issue, but i havent learned _javascript_ at all, i've started with jQuery. Thank you
[jQuery] Re: Newbie question on selectors
In that case you would replace "^=" with "*=" : $("a[class*=edit_]").click(...); --Karl Karl Swedberg www.englishrules.com www.learningjquery.com On Jun 3, 2009, at 3:20 PM, James wrote: Sorry, I forgot to mention that this would not work if your class is like: ... because it checks for class="edit_[something]" There's another solution to that, but I can't recall what it is on the top of my head right now. On Jun 3, 8:32 am, "Dave Maharaj :: WidePixels.com" wrote: Perfect... Thanks for your help. Greatly appreciated. Dave -Original Message- From: James [mailto:james.gp@gmail.com] Sent: June-03-09 3:55 PM To: jQuery (English) Subject: [jQuery] Re: Newbie question on selectors $("a[class^=edit_]").click(...); This is saying: all with class that begins with 'edit_'. http://docs.jquery.com/Selectors On Jun 3, 8:20 am, "Dave Maharaj :: WidePixels.com" wrote: I have a page with 6 links that each have a unique class ; edit_profile edit_preferences edit_journal edit_entry and so on now I built 1 function based off edit_profile $("a.edit_profile").click(function(){ var url_id = $(this).attr('href'); do stuff.. }); but rather than writing the same function and changing the selector everytime how can i get this all into 1 function? Thanks, Dave
[jQuery] Re: Newbie question on selectors
you can try something like this $("a[class^=edit]").click(function(){ var url_id = $(this).attr('href'); do stuff.. }); On Jun 3, 11:20 am, "Dave Maharaj :: WidePixels.com" wrote: > I have a page with 6 links that each have a unique class ; > edit_profile > edit_preferences > edit_journal > edit_entry and so on > > now I built 1 function based off edit_profile > $("a.edit_profile").click(function(){ > var url_id = $(this).attr('href'); > do stuff.. > > }); > > but rather than writing the same function and changing the selector > everytime how can i get this all into 1 function? > > Thanks, > > Dave
[jQuery] Re: Newbie question on selectors
Sounds good! Will keep that in mind, but its working perfect. Thanks, Dave -Original Message- From: James [mailto:james.gp@gmail.com] Sent: June-03-09 4:51 PM To: jQuery (English) Subject: [jQuery] Re: Newbie question on selectors Sorry, I forgot to mention that this would not work if your class is like: ... because it checks for class="edit_[something]" There's another solution to that, but I can't recall what it is on the top of my head right now. On Jun 3, 8:32 am, "Dave Maharaj :: WidePixels.com" wrote: > Perfect... > > Thanks for your help. > > Greatly appreciated. > > Dave > > -Original Message- > From: James [mailto:james.gp@gmail.com] > Sent: June-03-09 3:55 PM > To: jQuery (English) > Subject: [jQuery] Re: Newbie question on selectors > > $("a[class^=edit_]").click(...); > > This is saying: all with class that begins with 'edit_'. > > http://docs.jquery.com/Selectors > > On Jun 3, 8:20 am, "Dave Maharaj :: WidePixels.com" > wrote: > > I have a page with 6 links that each have a unique class ; > > edit_profile edit_preferences edit_journal edit_entry and so on > > > now I built 1 function based off edit_profile > > $("a.edit_profile").click(function(){ > > var url_id = $(this).attr('href'); > > do stuff.. > > > }); > > > but rather than writing the same function and changing the selector > > everytime how can i get this all into 1 function? > > > Thanks, > > > Dave
[jQuery] Re: Newbie question on selectors
Sorry, I forgot to mention that this would not work if your class is like: ... because it checks for class="edit_[something]" There's another solution to that, but I can't recall what it is on the top of my head right now. On Jun 3, 8:32 am, "Dave Maharaj :: WidePixels.com" wrote: > Perfect... > > Thanks for your help. > > Greatly appreciated. > > Dave > > -Original Message- > From: James [mailto:james.gp@gmail.com] > Sent: June-03-09 3:55 PM > To: jQuery (English) > Subject: [jQuery] Re: Newbie question on selectors > > $("a[class^=edit_]").click(...); > > This is saying: all with class that begins with 'edit_'. > > http://docs.jquery.com/Selectors > > On Jun 3, 8:20 am, "Dave Maharaj :: WidePixels.com" > wrote: > > I have a page with 6 links that each have a unique class ; > > edit_profile edit_preferences edit_journal edit_entry and so on > > > now I built 1 function based off edit_profile > > $("a.edit_profile").click(function(){ > > var url_id = $(this).attr('href'); > > do stuff.. > > > }); > > > but rather than writing the same function and changing the selector > > everytime how can i get this all into 1 function? > > > Thanks, > > > Dave
[jQuery] Re: Newbie question on selectors
Perfect... Thanks for your help. Greatly appreciated. Dave -Original Message- From: James [mailto:james.gp@gmail.com] Sent: June-03-09 3:55 PM To: jQuery (English) Subject: [jQuery] Re: Newbie question on selectors $("a[class^=edit_]").click(...); This is saying: all with class that begins with 'edit_'. http://docs.jquery.com/Selectors On Jun 3, 8:20 am, "Dave Maharaj :: WidePixels.com" wrote: > I have a page with 6 links that each have a unique class ; > edit_profile edit_preferences edit_journal edit_entry and so on > > now I built 1 function based off edit_profile > $("a.edit_profile").click(function(){ > var url_id = $(this).attr('href'); > do stuff.. > > }); > > but rather than writing the same function and changing the selector > everytime how can i get this all into 1 function? > > Thanks, > > Dave
[jQuery] Re: Newbie question on selectors
$("a[class^=edit_]").click(...); This is saying: all with class that begins with 'edit_'. http://docs.jquery.com/Selectors On Jun 3, 8:20 am, "Dave Maharaj :: WidePixels.com" wrote: > I have a page with 6 links that each have a unique class ; > edit_profile > edit_preferences > edit_journal > edit_entry and so on > > now I built 1 function based off edit_profile > $("a.edit_profile").click(function(){ > var url_id = $(this).attr('href'); > do stuff.. > > }); > > but rather than writing the same function and changing the selector > everytime how can i get this all into 1 function? > > Thanks, > > Dave
[jQuery] Re: Newbie question- declarative selectors inside procedural code
Excellent! Glad to see you figured that one out. Rest assured that *every* web developer has pulled out hair related to that particular issue. Fortunately, in many editors today, you can run a tool called 'jslint' that does a simple syntax check for you. In my editor (TextMate), I actually have it set up to do that check every time I save. _jason On May 26, 2:05 pm, colin_e wrote: > Just to finish this one off, I discovered my problem in IE6 was > nothing to do with the jquery search operation we were discussing. > > As I was working on the code I had added an object initialisation > above the line in question that had an extra comma at the end, as in- > > var frames= { > EM: 1*offset, > . > . > . > YH: 10*offset, //< }; > > IE6 choked on this, whereas Firefox was quite happy with it. > > I've done enough little bits of Perl, PHP, and now JavaScript over the > years that I have terrible trouble remembering exactly which bits of > syntax will or won't work with each! > > Thanks again to Jason, my little dynamic map works like a charm. > > Regards: colin_e > > On May 25, 8:29 pm, kiusau wrote: > > > On May 25, 3:44 am, Jason Persampieri wrote: > > > > Certainly... you're really not all that far off at all... let me just > > > point out a couple of things. > > > Very nice presentation! > > > It is likely that many novice users of jQuery will be able to benefit > > from it. Please do respond to the originator's question about the use > > of :first-child in IE, and suggest a work around if, indeed, it is an > > issue. > > > Roddy
[jQuery] Re: Newbie question- declarative selectors inside procedural code
Just to finish this one off, I discovered my problem in IE6 was nothing to do with the jquery search operation we were discussing. As I was working on the code I had added an object initialisation above the line in question that had an extra comma at the end, as in- var frames= { EM: 1*offset, . . . YH: 10*offset, //< wrote: > On May 25, 3:44 am, Jason Persampieri wrote: > > > Certainly... you're really not all that far off at all... let me just > > point out a couple of things. > > Very nice presentation! > > It is likely that many novice users of jQuery will be able to benefit > from it. Please do respond to the originator's question about the use > of :first-child in IE, and suggest a work around if, indeed, it is an > issue. > > Roddy
[jQuery] Re: Newbie question- declarative selectors inside procedural code
On May 25, 3:44 am, Jason Persampieri wrote: > Certainly... you're really not all that far off at all... let me just > point out a couple of things. Very nice presentation! It is likely that many novice users of jQuery will be able to benefit from it. Please do respond to the originator's question about the use of :first-child in IE, and suggest a work around if, indeed, it is an issue. Roddy
[jQuery] Re: Newbie question- declarative selectors inside procedural code
In fact I tried an alert() to see what the code was doing, and it now looks as if it's not running at all. Don't you just love IE6? On May 25, 4:49 pm, colin_e wrote: > I hate to say this but i'm using IE6 for compatibility testing because > that (like it or not) is still our organisation's standard > browser... :-} > > On May 25, 2:03 pm, Jason Persampieri wrote: > > > re: this vs $(this) - > > this = DOMNode > > $(this) = [DOMNode] (ie, an array containing the single element, > > DOMNode) that also happens to have lots of nifty methods like > > 'children', 'find' and 'animate'. > > > The jQuery version should work in pretty much all browsers though... > > the compatibility layer is built-in. > > > Oh, and if you aren't, use IE8 for IE debugging. It's nowhere near as > > nice as FF+Firebug, but it's a lot better than IE7. > > > Also,http://api.jquery.comisa very handy reference tool :) > > > _jason > > > PS. Another couple of ways to get what you want - > > /* get all direct children of this that are 's, then filter out all > > remaning, but leave first children */ > > $(this).children('a').filter(":first-child") > > /* get all direct children of this, grab just the first one, then > > filter out all remaining, but leave 's */ > > $(this).children().eq(0).filter("a") > > > On May 25, 5:44 am, colin_e wrote: > > > > That is very, very helpful, thanks! > > > > I knew I hadn't found the correct way to say "constrain the search to > > > children of 'this', now I know. > > > > To be honest I think i'm still unclear on the real difference between > > > the vanilla Javascript 'this' and the jquery '$(this)'. For example I > > > think that I could have got the selection I wanted with Javascript > > > like- > > > > this.firstChild.className > > > > ...but I also know firstChild doesn't work in IE. I was hoping the > > > jquery version would help solve that, but at the moment I still have a > > > solution that works only in Firefox :-} At the moment I don't have > > > an IE quivalent to Firebug so i'm slightly stuck on how to try to > > > debug it. > > > > Anyway, in Firefox it works like a charm. Thanks for the help, much > > > appreciated! > > > > Regards: colin_e > > > > On May 25, 11:44 am, Jason Persampieri wrote: > > > > > Certainly... you're really not all that far off at all... let me just > > > > point out a couple of things. > > > > > 1) It's ":first-child", not ":first". > > > > > 2) inside the loop, the variable - this - is a reference to the DOM > > > > node. Hence, to get the jQuery object for that node, use $(this) > > > > (note the lack of quotes). Although I guess it's possible $("this") > > > > may 'do the right thing' since there's no HTML Tag named "this". > > > > > 3) There is no 3. > > > > > 4) a:first-child says find every that happens to be the first- > > > > child of its parent, *not* find the first child of my current > > > > context. Is that clear? Here's an example. > > > > > > > > > I am the first-child of 'p'. > > > > I am not the first-child and hence will always live in > > > > the shadow of my older brother, 'p'. Someday he'll pay. > > > > > > > > > $("#foo a:first-child") => ['#bar'] > > > > > 5) Putting it all together, you still need some way to say, "find > > > > 's under my current ", here you have a few choices... > > > > > a) $("a:first-child", this) => find all s that are *any* descendant > > > > of "this" that also happen to be a "first-child". Note that the > > > > second parameter passed in to the '$' function is the context to > > > > search within. > > > > > b) $(this).find("a:first-child") => same as a) but I happen to find > > > > this syntax cleaner. > > > > > c) $(this).children("a:first-child") => finds all s that are > > > > *direct* children of "this" and are also the "first-child". Astute > > > > members of our audience will note this can only ever correspond to at > > > > most one per . I think this is the one you are looking for. > > > > > Hope this helps! > > > > > _jason > > > > > On May 24, 1:12 pm, colin_e wrote: > > > > > > Hi. I'm very new to jquery, and a lightweight coder, so apologies for > > > > > the newbie question. > > > > > > I think I understand the "implied loop" declarative nature of jquery > > > > > selectors, that say (sort-of) "for everything matching the selector > > > > > do"{ } > > > > > > What i'm struggling to get my head around is how this works inside a > > > > > function once you HAVE a "this" object? > > > > > > Example: > > > > > I have a list of the form- > > > > > > > > > > > East > > > > > Midlands > > > > > North East > > > > span> > > > > > > > > > > > This inside my document.ready I have a function like this- > > > > > > $('#map li').hover( > > > > > function(){ > > > > > region= $('this a:first').attr('class'); // > > > > > Tries to find the > > > > > class of the first in > > > > >
[jQuery] Re: Newbie question- declarative selectors inside procedural code
I hate to say this but i'm using IE6 for compatibility testing because that (like it or not) is still our organisation's standard browser... :-} On May 25, 2:03 pm, Jason Persampieri wrote: > re: this vs $(this) - > this = DOMNode > $(this) = [DOMNode] (ie, an array containing the single element, > DOMNode) that also happens to have lots of nifty methods like > 'children', 'find' and 'animate'. > > The jQuery version should work in pretty much all browsers though... > the compatibility layer is built-in. > > Oh, and if you aren't, use IE8 for IE debugging. It's nowhere near as > nice as FF+Firebug, but it's a lot better than IE7. > > Also,http://api.jquery.comis a very handy reference tool :) > > _jason > > PS. Another couple of ways to get what you want - > /* get all direct children of this that are 's, then filter out all > remaning, but leave first children */ > $(this).children('a').filter(":first-child") > /* get all direct children of this, grab just the first one, then > filter out all remaining, but leave 's */ > $(this).children().eq(0).filter("a") > > On May 25, 5:44 am, colin_e wrote: > > > That is very, very helpful, thanks! > > > I knew I hadn't found the correct way to say "constrain the search to > > children of 'this', now I know. > > > To be honest I think i'm still unclear on the real difference between > > the vanilla Javascript 'this' and the jquery '$(this)'. For example I > > think that I could have got the selection I wanted with Javascript > > like- > > > this.firstChild.className > > > ...but I also know firstChild doesn't work in IE. I was hoping the > > jquery version would help solve that, but at the moment I still have a > > solution that works only in Firefox :-} At the moment I don't have > > an IE quivalent to Firebug so i'm slightly stuck on how to try to > > debug it. > > > Anyway, in Firefox it works like a charm. Thanks for the help, much > > appreciated! > > > Regards: colin_e > > > On May 25, 11:44 am, Jason Persampieri wrote: > > > > Certainly... you're really not all that far off at all... let me just > > > point out a couple of things. > > > > 1) It's ":first-child", not ":first". > > > > 2) inside the loop, the variable - this - is a reference to the DOM > > > node. Hence, to get the jQuery object for that node, use $(this) > > > (note the lack of quotes). Although I guess it's possible $("this") > > > may 'do the right thing' since there's no HTML Tag named "this". > > > > 3) There is no 3. > > > > 4) a:first-child says find every that happens to be the first- > > > child of its parent, *not* find the first child of my current > > > context. Is that clear? Here's an example. > > > > > > > I am the first-child of 'p'. > > > I am not the first-child and hence will always live in > > > the shadow of my older brother, 'p'. Someday he'll pay. > > > > > > > $("#foo a:first-child") => ['#bar'] > > > > 5) Putting it all together, you still need some way to say, "find > > > 's under my current ", here you have a few choices... > > > > a) $("a:first-child", this) => find all s that are *any* descendant > > > of "this" that also happen to be a "first-child". Note that the > > > second parameter passed in to the '$' function is the context to > > > search within. > > > > b) $(this).find("a:first-child") => same as a) but I happen to find > > > this syntax cleaner. > > > > c) $(this).children("a:first-child") => finds all s that are > > > *direct* children of "this" and are also the "first-child". Astute > > > members of our audience will note this can only ever correspond to at > > > most one per . I think this is the one you are looking for. > > > > Hope this helps! > > > > _jason > > > > On May 24, 1:12 pm, colin_e wrote: > > > > > Hi. I'm very new to jquery, and a lightweight coder, so apologies for > > > > the newbie question. > > > > > I think I understand the "implied loop" declarative nature of jquery > > > > selectors, that say (sort-of) "for everything matching the selector > > > > do"{ } > > > > > What i'm struggling to get my head around is how this works inside a > > > > function once you HAVE a "this" object? > > > > > Example: > > > > I have a list of the form- > > > > > > > > > East > > > > Midlands > > > > North East > > > span> > > > > > > > > > This inside my document.ready I have a function like this- > > > > > $('#map li').hover( > > > > function(){ > > > > region= $('this a:first').attr('class'); // > > > > Tries to find the > > > > class of the first in > > > > > > > > // > > > > but always returns undefined?? > > > > do_something_with_the_region(); > > > > }, > > > > function(){ > > > > undo_something_with_the_region(); > > > > } > > > > ); > > > > > The piece that says "region= $('this a:fi
[jQuery] Re: Newbie question- declarative selectors inside procedural code
re: this vs $(this) - this = DOMNode $(this) = [DOMNode] (ie, an array containing the single element, DOMNode) that also happens to have lots of nifty methods like 'children', 'find' and 'animate'. The jQuery version should work in pretty much all browsers though... the compatibility layer is built-in. Oh, and if you aren't, use IE8 for IE debugging. It's nowhere near as nice as FF+Firebug, but it's a lot better than IE7. Also, http://api.jquery.com is a very handy reference tool :) _jason PS. Another couple of ways to get what you want - /* get all direct children of this that are 's, then filter out all remaning, but leave first children */ $(this).children('a').filter(":first-child") /* get all direct children of this, grab just the first one, then filter out all remaining, but leave 's */ $(this).children().eq(0).filter("a") On May 25, 5:44 am, colin_e wrote: > That is very, very helpful, thanks! > > I knew I hadn't found the correct way to say "constrain the search to > children of 'this', now I know. > > To be honest I think i'm still unclear on the real difference between > the vanilla Javascript 'this' and the jquery '$(this)'. For example I > think that I could have got the selection I wanted with Javascript > like- > > this.firstChild.className > > ...but I also know firstChild doesn't work in IE. I was hoping the > jquery version would help solve that, but at the moment I still have a > solution that works only in Firefox :-} At the moment I don't have > an IE quivalent to Firebug so i'm slightly stuck on how to try to > debug it. > > Anyway, in Firefox it works like a charm. Thanks for the help, much > appreciated! > > Regards: colin_e > > On May 25, 11:44 am, Jason Persampieri wrote: > > > Certainly... you're really not all that far off at all... let me just > > point out a couple of things. > > > 1) It's ":first-child", not ":first". > > > 2) inside the loop, the variable - this - is a reference to the DOM > > node. Hence, to get the jQuery object for that node, use $(this) > > (note the lack of quotes). Although I guess it's possible $("this") > > may 'do the right thing' since there's no HTML Tag named "this". > > > 3) There is no 3. > > > 4) a:first-child says find every that happens to be the first- > > child of its parent, *not* find the first child of my current > > context. Is that clear? Here's an example. > > > > > I am the first-child of 'p'. > > I am not the first-child and hence will always live in > > the shadow of my older brother, 'p'. Someday he'll pay. > > > > > $("#foo a:first-child") => ['#bar'] > > > 5) Putting it all together, you still need some way to say, "find > > 's under my current ", here you have a few choices... > > > a) $("a:first-child", this) => find all s that are *any* descendant > > of "this" that also happen to be a "first-child". Note that the > > second parameter passed in to the '$' function is the context to > > search within. > > > b) $(this).find("a:first-child") => same as a) but I happen to find > > this syntax cleaner. > > > c) $(this).children("a:first-child") => finds all s that are > > *direct* children of "this" and are also the "first-child". Astute > > members of our audience will note this can only ever correspond to at > > most one per . I think this is the one you are looking for. > > > Hope this helps! > > > _jason > > > On May 24, 1:12 pm, colin_e wrote: > > > > Hi. I'm very new to jquery, and a lightweight coder, so apologies for > > > the newbie question. > > > > I think I understand the "implied loop" declarative nature of jquery > > > selectors, that say (sort-of) "for everything matching the selector > > > do"{ } > > > > What i'm struggling to get my head around is how this works inside a > > > function once you HAVE a "this" object? > > > > Example: > > > I have a list of the form- > > > > > > > East > > > Midlands > > > North East > > span> > > > > > > > This inside my document.ready I have a function like this- > > > > $('#map li').hover( > > > function(){ > > > region= $('this a:first').attr('class'); // > > > Tries to find the > > > class of the first in > > > > > > // > > > but always returns undefined?? > > > do_something_with_the_region(); > > > }, > > > function(){ > > > undo_something_with_the_region(); > > > } > > > ); > > > > The piece that says "region= $('this a:first').attr('class');" is my > > > (clearly incorrect) attempt at the incantation to say "Give the > > > current object (an ), return the class attribute of the first > > > anchor that is a child of the current item". > > > > I suspect I haven't got the right idea at all, can anyone point me in > > > the right direction? > > > > Regards: colin_e
[jQuery] Re: Newbie question- declarative selectors inside procedural code
That is very, very helpful, thanks! I knew I hadn't found the correct way to say "constrain the search to children of 'this', now I know. To be honest I think i'm still unclear on the real difference between the vanilla Javascript 'this' and the jquery '$(this)'. For example I think that I could have got the selection I wanted with Javascript like- this.firstChild.className ...but I also know firstChild doesn't work in IE. I was hoping the jquery version would help solve that, but at the moment I still have a solution that works only in Firefox :-} At the moment I don't have an IE quivalent to Firebug so i'm slightly stuck on how to try to debug it. Anyway, in Firefox it works like a charm. Thanks for the help, much appreciated! Regards: colin_e On May 25, 11:44 am, Jason Persampieri wrote: > Certainly... you're really not all that far off at all... let me just > point out a couple of things. > > 1) It's ":first-child", not ":first". > > 2) inside the loop, the variable - this - is a reference to the DOM > node. Hence, to get the jQuery object for that node, use $(this) > (note the lack of quotes). Although I guess it's possible $("this") > may 'do the right thing' since there's no HTML Tag named "this". > > 3) There is no 3. > > 4) a:first-child says find every that happens to be the first- > child of its parent, *not* find the first child of my current > context. Is that clear? Here's an example. > > > I am the first-child of 'p'. > I am not the first-child and hence will always live in > the shadow of my older brother, 'p'. Someday he'll pay. > > > $("#foo a:first-child") => ['#bar'] > > 5) Putting it all together, you still need some way to say, "find > 's under my current ", here you have a few choices... > > a) $("a:first-child", this) => find all s that are *any* descendant > of "this" that also happen to be a "first-child". Note that the > second parameter passed in to the '$' function is the context to > search within. > > b) $(this).find("a:first-child") => same as a) but I happen to find > this syntax cleaner. > > c) $(this).children("a:first-child") => finds all s that are > *direct* children of "this" and are also the "first-child". Astute > members of our audience will note this can only ever correspond to at > most one per . I think this is the one you are looking for. > > Hope this helps! > > _jason > > On May 24, 1:12 pm, colin_e wrote: > > > Hi. I'm very new to jquery, and a lightweight coder, so apologies for > > the newbie question. > > > I think I understand the "implied loop" declarative nature of jquery > > selectors, that say (sort-of) "for everything matching the selector > > do"{ } > > > What i'm struggling to get my head around is how this works inside a > > function once you HAVE a "this" object? > > > Example: > > I have a list of the form- > > > > > East > > Midlands > > North East > span> > > > > > This inside my document.ready I have a function like this- > > > $('#map li').hover( > > function(){ > > region= $('this a:first').attr('class'); // Tries > > to find the > > class of the first in > > // > > but always returns undefined?? > > do_something_with_the_region(); > > }, > > function(){ > > undo_something_with_the_region(); > > } > > ); > > > The piece that says "region= $('this a:first').attr('class');" is my > > (clearly incorrect) attempt at the incantation to say "Give the > > current object (an ), return the class attribute of the first > > anchor that is a child of the current item". > > > I suspect I haven't got the right idea at all, can anyone point me in > > the right direction? > > > Regards: colin_e
[jQuery] Re: Newbie question- declarative selectors inside procedural code
Certainly... you're really not all that far off at all... let me just point out a couple of things. 1) It's ":first-child", not ":first". 2) inside the loop, the variable - this - is a reference to the DOM node. Hence, to get the jQuery object for that node, use $(this) (note the lack of quotes). Although I guess it's possible $("this") may 'do the right thing' since there's no HTML Tag named "this". 3) There is no 3. 4) a:first-child says find every that happens to be the first- child of its parent, *not* find the first child of my current context. Is that clear? Here's an example. I am the first-child of 'p'. I am not the first-child and hence will always live in the shadow of my older brother, 'p'. Someday he'll pay. $("#foo a:first-child") => ['#bar'] 5) Putting it all together, you still need some way to say, "find 's under my current ", here you have a few choices... a) $("a:first-child", this) => find all s that are *any* descendant of "this" that also happen to be a "first-child". Note that the second parameter passed in to the '$' function is the context to search within. b) $(this).find("a:first-child") => same as a) but I happen to find this syntax cleaner. c) $(this).children("a:first-child") => finds all s that are *direct* children of "this" and are also the "first-child". Astute members of our audience will note this can only ever correspond to at most one per . I think this is the one you are looking for. Hope this helps! _jason On May 24, 1:12 pm, colin_e wrote: > Hi. I'm very new to jquery, and a lightweight coder, so apologies for > the newbie question. > > I think I understand the "implied loop" declarative nature of jquery > selectors, that say (sort-of) "for everything matching the selector > do"{ } > > What i'm struggling to get my head around is how this works inside a > function once you HAVE a "this" object? > > Example: > I have a list of the form- > > > East > Midlands > North East span> > > > This inside my document.ready I have a function like this- > > $('#map li').hover( > function(){ > region= $('this a:first').attr('class'); // Tries to > find the > class of the first in > // > but always returns undefined?? > do_something_with_the_region(); > }, > function(){ > undo_something_with_the_region(); > } > ); > > The piece that says "region= $('this a:first').attr('class');" is my > (clearly incorrect) attempt at the incantation to say "Give the > current object (an ), return the class attribute of the first > anchor that is a child of the current item". > > I suspect I haven't got the right idea at all, can anyone point me in > the right direction? > > Regards: colin_e
[jQuery] Re: Newbie question about toggle.
Hi Ryan, Thanks for reply! I tried to use anchor, but it doesn't work: $('#info').hide(); $('a#show_hide_info').click(function(){ $('#info').toggle(); }); Show/hide info some When I click #show_hide_info, this doesn't move me to my anchor. So what I am doing wrong? With regards, Max. On May 21, 5:11 pm, "ryan.j" wrote: > sounds like you could jsut use an inline anchor, with the JS being > executed in the onclick event > > On May 21, 8:11 am, Lacrima wrote: > > > Hello! > > > I think very simple question, but I am very new to jquery... > > For example, I have the next code: > > > $('#info').hide(); > > $('a#show_hide_info').click(function(){ > > $('#info').toggle(); > > }); > > > So when a user click on #show_hide_info, #info element become visible > > or invisible. > > But the #show_hide_info element is placed on the top of the page and > > the #info element is on the bottom of the page. The bottom of the page > > isn't visible to the user because the page is too long. > > So when user clicks #show_hide_info he doesn't see any effect because > > #info element is several screens down. > > How should I scroll down the page to the #info element when user > > clicks #show_hide_info??? > > > Sorry if my English is not very good. > > Thank you in advance. > > > With regards, > > Max.
[jQuery] Re: Newbie question about toggle.
sounds like you could jsut use an inline anchor, with the JS being executed in the onclick event On May 21, 8:11 am, Lacrima wrote: > Hello! > > I think very simple question, but I am very new to jquery... > For example, I have the next code: > > $('#info').hide(); > $('a#show_hide_info').click(function(){ > $('#info').toggle(); > }); > > So when a user click on #show_hide_info, #info element become visible > or invisible. > But the #show_hide_info element is placed on the top of the page and > the #info element is on the bottom of the page. The bottom of the page > isn't visible to the user because the page is too long. > So when user clicks #show_hide_info he doesn't see any effect because > #info element is several screens down. > How should I scroll down the page to the #info element when user > clicks #show_hide_info??? > > Sorry if my English is not very good. > Thank you in advance. > > With regards, > Max.
[jQuery] Re: Newbie Question... Appending multiple items, with the same span name
Hey there, You could try the following: $(document).ready(function() { $("ul li").each(function() { var thisName = $('.name', this).text(); // get the content inside '.name' class of this element $(this).append(''+ thisName +"'s additional Info" ); }); }); With your approach of $('.name').text(), it was getting the contents of all the span that had 'name' class. so you where getting 'John DoeJane Doe's'.. in the output. Also a suggestion: perhaps you may consider adding an id or class for the "ul" tag (and also modify JS accordingly), in that way it won't grab all the "ul li" on the page. I hope this helps, Thanks, Abdullah On May 13, 3:00 pm, Troy wrote: > Hello, > > I'm relatively new to jquery, so I have what I hope will be a simple > question. > I need to append multiple spans to the line items in an unordered > list. > Essentially, each line item contains a and I need to grab the > content of that span and append it to the bottom of the line item it's > contained in. Here's what I have so far: > > My jquery code: > - > $("ul").ready(function(){ > var Name = $(".name") .text(); > var Content = $(".content") .text(); > $("li") .append(" \">"+ Name +"'s additional info"); > }); > > The original HTML it needs to modify: > - > > > John Doe > John is an excellent Swimmer > > > Jane Doe > Jane loves to play basketball > > > > Here's the output I'm getting: > - > John Doe > John is an excellent Swimmer > John DoeJane Doe's additional info > > Jane Doe > Jane loves to play basketball > John DoeJane Doe's additional info > > Here's the desired outcome: > - > John Doe > John is an excellent Swimmer > John Doe's additional info > > Jane Doe > Jane loves to play basketball > Jane Doe's additional info > > As you can see, instead of taking the all the "Name" var's and putting > them together, instead of just using the "Name" var of that line item. > I'm sure it needs some type of this, $(this), or .each call on it, but > I can't seem to find this in the documentation anywhere. > > Can someone help? > Thanks! > Troy
[jQuery] Re: Newbie Question - Show/Hide on a:link
Try using toggle instead: ${"a.welcomenav").toggle(function(){ $("#welcome").show(); return false; },function(){ $("#welcome").hide(); return false; }); -Original Message- From: jquery-en@googlegroups.com [mailto:jquery...@googlegroups.com] On Behalf Of KetanMV Sent: Friday, April 17, 2009 11:36 AM To: jQuery (English) Subject: [jQuery] Newbie Question - Show/Hide on a:link Hi guys -- very basic question here I think. I've got some documentation and a book in front of me, but I can't get this to work! I want to click the "Welcome" nav item to show the div named "welcome" on the page. If I use just the "hide" line of code, the page loads up with the DIV hidden properly. But, once I add the click/show code -- nothing happens, including the hide onLoad. Thoughts? Thanks so much! $(document).ready(function() { $("#welcome").hide(); ${"a.welcomenav").click(function() { $("#welcome").show(); return false; }); }); Welcome
[jQuery] Re: newbie question
Thanks for clarifying, Jonathan! Rick -Original Message- From: jquery-en@googlegroups.com [mailto:jquery...@googlegroups.com] On Behalf Of Jonathan Sent: Tuesday, April 07, 2009 3:34 PM To: jQuery (English) Subject: [jQuery] Re: newbie question Also, you should only ever have to call noConflict() once, right after you include the jQuery.js file. On Apr 7, 12:28 pm, Jonathan wrote: > Basically, although $bfa is a pointer to jQuery, Not jQuery.noConflict > (); > > so if you wanted to call noConflict again you would simply do > $newAlias = $bfa.noConflict(); > > On Apr 7, 12:22 pm, "Rick Faircloth" wrote: > > > But having "$bfa = jQuery.noConflict()" > > would make $bfa a variable representing > > "jQuery.noConflict()" and eliminate the need > > to have to write out jQuery.noConflict() or > > $.noConflict(), right? > > > Rick > > > -Original Message- > > From: jquery-en@googlegroups.com [mailto:jquery...@googlegroups.com] On > > > Behalf Of Jonathan > > Sent: Tuesday, April 07, 2009 3:08 PM > > To: jQuery (English) > > Subject: [jQuery] Re: newbie question > > > $ is simply an alias to jQuery(). > > > jQuery.noConflict() removes the $ alias so other frameworks don't > > throw a fit. > > > $bfa = jQuery.noConflict() simply assigns $bfa to jQuery(). > > > The $ tends to confuse people at first but it's just a function alias, > > It's just a shortcut for jQuery, thats it, nothing else. If it helps > > you any just replace the $ in your head with jQuery() > > > On Apr 7, 11:26 am, "Rick Faircloth" wrote: > > > Hi, Ron...glad you making some progress! > > > > And don't worry about the oversights...I'm constantly running > > > into stuff like that...(I'm getting too old for all this, too! :o) > > > > Concerning the noConflict stuff... > > > I haven't had occasion, yet to have to use the noConflict approach, > > > so I'm not personally experienced with it. But from having read > > > about it on the list, my understanding is that it is simply a way > > > to prevent the jQuery framework from conflicting with other Javascript > > > frameworks, such as MooTools, Prototype, etc. > > > > And, apparently, from your example code, the coder is simply using > > > a variable to represent the jQuery.noConflict(); code so he doesn't have > > > to do so much typing. $bfa or jq is just quicker. It's just a > > convenience > > > thing...perhaps someone else has more to offer in terms of explanation. > > > > hth, > > > > Rick > > > > -Original Message- > > > From: jquery-en@googlegroups.com [mailto:jquery...@googlegroups.com] On > > > > Behalf Of Ronz > > > Sent: Tuesday, April 07, 2009 1:21 PM > > > To: jQuery (English) > > > Subject: [jQuery] Re: newbie question > > > > Hi, Rick. > > > > Here's a quote to my hosting news group that 'splains' what has > > > happened since yesterday. Maybe you could comment on the latter > > > portion if you have time. TIA.Ron > > > > > > > > It turns out that what I downloaded from jQuery ended up with a bunch > > > of line feeds in it...my bad I'm sure. > > > > I ended up copying the jquery.js from the another site's installation > > > and still had the same problem, but then it dawned on me that I should > > > look to see if my editor(s) 'wrapped' the file and, sure enough, I let > > > it get screwed up with those 'stinking' extra line feeds! > > > > > > > To add insult to my stupidity, one copy paste from that other site > > > wrapped the file with ... > > > > > > > My only excuse is that, after 12 years, I'm now using linux with > > > Bulefish and Screem editors that have 'con-foo-zed' me. > > > > >> I *really* feel stupid at this point.Ron > > > > I'm getting too old for this..:=) > > > > Now for my 'extra' question: > > > > > > > > > var jq = jQuery.noConflict(); > > > > jq(document).ready(function() > > > > ... > > > > I noticed the 'var - noConflict' line above and saw it in another site > > > like this: > > > > var $bfa = jQuery.noConflict(); > > > $bfa(document).ready(function(){ > > > > and in his function content "$bfa&quo
[jQuery] Re: newbie question
Also, you should only ever have to call noConflict() once, right after you include the jQuery.js file. On Apr 7, 12:28 pm, Jonathan wrote: > Basically, although $bfa is a pointer to jQuery, Not jQuery.noConflict > (); > > so if you wanted to call noConflict again you would simply do > $newAlias = $bfa.noConflict(); > > On Apr 7, 12:22 pm, "Rick Faircloth" wrote: > > > But having "$bfa = jQuery.noConflict()" > > would make $bfa a variable representing > > "jQuery.noConflict()" and eliminate the need > > to have to write out jQuery.noConflict() or > > $.noConflict(), right? > > > Rick > > > -Original Message- > > From: jquery-en@googlegroups.com [mailto:jquery...@googlegroups.com] On > > > Behalf Of Jonathan > > Sent: Tuesday, April 07, 2009 3:08 PM > > To: jQuery (English) > > Subject: [jQuery] Re: newbie question > > > $ is simply an alias to jQuery(). > > > jQuery.noConflict() removes the $ alias so other frameworks don't > > throw a fit. > > > $bfa = jQuery.noConflict() simply assigns $bfa to jQuery(). > > > The $ tends to confuse people at first but it's just a function alias, > > It's just a shortcut for jQuery, thats it, nothing else. If it helps > > you any just replace the $ in your head with jQuery() > > > On Apr 7, 11:26 am, "Rick Faircloth" wrote: > > > Hi, Ron...glad you making some progress! > > > > And don't worry about the oversights...I'm constantly running > > > into stuff like that...(I'm getting too old for all this, too! :o) > > > > Concerning the noConflict stuff... > > > I haven't had occasion, yet to have to use the noConflict approach, > > > so I'm not personally experienced with it. But from having read > > > about it on the list, my understanding is that it is simply a way > > > to prevent the jQuery framework from conflicting with other Javascript > > > frameworks, such as MooTools, Prototype, etc. > > > > And, apparently, from your example code, the coder is simply using > > > a variable to represent the jQuery.noConflict(); code so he doesn't have > > > to do so much typing. $bfa or jq is just quicker. It's just a > > convenience > > > thing...perhaps someone else has more to offer in terms of explanation. > > > > hth, > > > > Rick > > > > -Original Message- > > > From: jquery-en@googlegroups.com [mailto:jquery...@googlegroups.com] On > > > > Behalf Of Ronz > > > Sent: Tuesday, April 07, 2009 1:21 PM > > > To: jQuery (English) > > > Subject: [jQuery] Re: newbie question > > > > Hi, Rick. > > > > Here's a quote to my hosting news group that 'splains' what has > > > happened since yesterday. Maybe you could comment on the latter > > > portion if you have time. TIA.Ron > > > > > > > > It turns out that what I downloaded from jQuery ended up with a bunch > > > of line feeds in it...my bad I'm sure. > > > > I ended up copying the jquery.js from the another site's installation > > > and still had the same problem, but then it dawned on me that I should > > > look to see if my editor(s) 'wrapped' the file and, sure enough, I let > > > it get screwed up with those 'stinking' extra line feeds! > > > > > > > To add insult to my stupidity, one copy paste from that other site > > > wrapped the file with ... > > > > > > > My only excuse is that, after 12 years, I'm now using linux with > > > Bulefish and Screem editors that have 'con-foo-zed' me. > > > > >> I *really* feel stupid at this point.Ron > > > > I'm getting too old for this..:=) > > > > Now for my 'extra' question: > > > > > > > > > var jq = jQuery.noConflict(); > > > > jq(document).ready(function() > > > > ... > > > > I noticed the 'var - noConflict' line above and saw it in another site > > > like this: > > > > var $bfa = jQuery.noConflict(); > > > $bfa(document).ready(function(){ > > > > and in his function content "$bfa" showed up in many places like > > > > $bfa(".post img").each(function() { > > > var maxwidth = centerwidth - 10 + 'px'; > > > var imgwidth = $bfa(this).width(); > > > ... > > &
[jQuery] Re: newbie question
Basically, although $bfa is a pointer to jQuery, Not jQuery.noConflict (); so if you wanted to call noConflict again you would simply do $newAlias = $bfa.noConflict(); On Apr 7, 12:22 pm, "Rick Faircloth" wrote: > But having "$bfa = jQuery.noConflict()" > would make $bfa a variable representing > "jQuery.noConflict()" and eliminate the need > to have to write out jQuery.noConflict() or > $.noConflict(), right? > > Rick > > -Original Message- > From: jquery-en@googlegroups.com [mailto:jquery...@googlegroups.com] On > > Behalf Of Jonathan > Sent: Tuesday, April 07, 2009 3:08 PM > To: jQuery (English) > Subject: [jQuery] Re: newbie question > > $ is simply an alias to jQuery(). > > jQuery.noConflict() removes the $ alias so other frameworks don't > throw a fit. > > $bfa = jQuery.noConflict() simply assigns $bfa to jQuery(). > > The $ tends to confuse people at first but it's just a function alias, > It's just a shortcut for jQuery, thats it, nothing else. If it helps > you any just replace the $ in your head with jQuery() > > On Apr 7, 11:26 am, "Rick Faircloth" wrote: > > Hi, Ron...glad you making some progress! > > > And don't worry about the oversights...I'm constantly running > > into stuff like that...(I'm getting too old for all this, too! :o) > > > Concerning the noConflict stuff... > > I haven't had occasion, yet to have to use the noConflict approach, > > so I'm not personally experienced with it. But from having read > > about it on the list, my understanding is that it is simply a way > > to prevent the jQuery framework from conflicting with other Javascript > > frameworks, such as MooTools, Prototype, etc. > > > And, apparently, from your example code, the coder is simply using > > a variable to represent the jQuery.noConflict(); code so he doesn't have > > to do so much typing. $bfa or jq is just quicker. It's just a > convenience > > thing...perhaps someone else has more to offer in terms of explanation. > > > hth, > > > Rick > > > -Original Message- > > From: jquery-en@googlegroups.com [mailto:jquery...@googlegroups.com] On > > > Behalf Of Ronz > > Sent: Tuesday, April 07, 2009 1:21 PM > > To: jQuery (English) > > Subject: [jQuery] Re: newbie question > > > Hi, Rick. > > > Here's a quote to my hosting news group that 'splains' what has > > happened since yesterday. Maybe you could comment on the latter > > portion if you have time. TIA.Ron > > > > > > It turns out that what I downloaded from jQuery ended up with a bunch > > of line feeds in it...my bad I'm sure. > > > I ended up copying the jquery.js from the another site's installation > > and still had the same problem, but then it dawned on me that I should > > look to see if my editor(s) 'wrapped' the file and, sure enough, I let > > it get screwed up with those 'stinking' extra line feeds! > > > > > To add insult to my stupidity, one copy paste from that other site > > wrapped the file with ... > > > > > My only excuse is that, after 12 years, I'm now using linux with > > Bulefish and Screem editors that have 'con-foo-zed' me. > > > >> I *really* feel stupid at this point.Ron > > > I'm getting too old for this..:=) > > > Now for my 'extra' question: > > > > > > > var jq = jQuery.noConflict(); > > > jq(document).ready(function() > > > ... > > > I noticed the 'var - noConflict' line above and saw it in another site > > like this: > > > var $bfa = jQuery.noConflict(); > > $bfa(document).ready(function(){ > > > and in his function content "$bfa" showed up in many places like > > > $bfa(".post img").each(function() { > > var maxwidth = centerwidth - 10 + 'px'; > > var imgwidth = $bfa(this).width(); > > ... > > > First of all, I'd seen no mention of "jQuery.noConflict()" in their > > docs and then seeing all those "$whatervers" all through a function's > > code mystified me. I'm guessing it uniquely identifies/isolates each > > function somehow. > > > What is that all about and do you do that for some reason? > > > A link somewhere that explains the above would be fine. > > > Thanks for your help.Ron > > > > > > On Apr 6, 11:27 pm, "Rick Faircloth"
[jQuery] Re: newbie question
But having "$bfa = jQuery.noConflict()" would make $bfa a variable representing "jQuery.noConflict()" and eliminate the need to have to write out jQuery.noConflict() or $.noConflict(), right? Rick -Original Message- From: jquery-en@googlegroups.com [mailto:jquery...@googlegroups.com] On Behalf Of Jonathan Sent: Tuesday, April 07, 2009 3:08 PM To: jQuery (English) Subject: [jQuery] Re: newbie question $ is simply an alias to jQuery(). jQuery.noConflict() removes the $ alias so other frameworks don't throw a fit. $bfa = jQuery.noConflict() simply assigns $bfa to jQuery(). The $ tends to confuse people at first but it's just a function alias, It's just a shortcut for jQuery, thats it, nothing else. If it helps you any just replace the $ in your head with jQuery() On Apr 7, 11:26 am, "Rick Faircloth" wrote: > Hi, Ron...glad you making some progress! > > And don't worry about the oversights...I'm constantly running > into stuff like that...(I'm getting too old for all this, too! :o) > > Concerning the noConflict stuff... > I haven't had occasion, yet to have to use the noConflict approach, > so I'm not personally experienced with it. But from having read > about it on the list, my understanding is that it is simply a way > to prevent the jQuery framework from conflicting with other Javascript > frameworks, such as MooTools, Prototype, etc. > > And, apparently, from your example code, the coder is simply using > a variable to represent the jQuery.noConflict(); code so he doesn't have > to do so much typing. $bfa or jq is just quicker. It's just a convenience > thing...perhaps someone else has more to offer in terms of explanation. > > hth, > > Rick > > -Original Message- > From: jquery-en@googlegroups.com [mailto:jquery...@googlegroups.com] On > > Behalf Of Ronz > Sent: Tuesday, April 07, 2009 1:21 PM > To: jQuery (English) > Subject: [jQuery] Re: newbie question > > Hi, Rick. > > Here's a quote to my hosting news group that 'splains' what has > happened since yesterday. Maybe you could comment on the latter > portion if you have time. TIA.Ron > > > > It turns out that what I downloaded from jQuery ended up with a bunch > of line feeds in it...my bad I'm sure. > > I ended up copying the jquery.js from the another site's installation > and still had the same problem, but then it dawned on me that I should > look to see if my editor(s) 'wrapped' the file and, sure enough, I let > it get screwed up with those 'stinking' extra line feeds! > > > To add insult to my stupidity, one copy paste from that other site > wrapped the file with ... > > > My only excuse is that, after 12 years, I'm now using linux with > Bulefish and Screem editors that have 'con-foo-zed' me. > > >> I *really* feel stupid at this point.Ron > > I'm getting too old for this..:=) > > Now for my 'extra' question: > > > > > var jq = jQuery.noConflict(); > > jq(document).ready(function() > > ... > > I noticed the 'var - noConflict' line above and saw it in another site > like this: > > var $bfa = jQuery.noConflict(); > $bfa(document).ready(function(){ > > and in his function content "$bfa" showed up in many places like > > $bfa(".post img").each(function() { > var maxwidth = centerwidth - 10 + 'px'; > var imgwidth = $bfa(this).width(); > ... > > First of all, I'd seen no mention of "jQuery.noConflict()" in their > docs and then seeing all those "$whatervers" all through a function's > code mystified me. I'm guessing it uniquely identifies/isolates each > function somehow. > > What is that all about and do you do that for some reason? > > A link somewhere that explains the above would be fine. > > Thanks for your help.Ron > > > > On Apr 6, 11:27 pm, "Rick Faircloth" wrote: > > Hi, Ron... > > > Assuming that you have your jQuery source file "jquery-1.3.2.min.js" > > in the same directory as the page it's running on, > > do you have this in the head section of your document? > > > > > > If you do, then also post your jQuery code and your HTML so it's > > easier to see where the problem may be in your code. > > > Rick > > > -Original Message- > > From: jquery-en@googlegroups.com [mailto:jquery...@googlegroups.com] On > > > Behalf Of Ronz > > Sent: Monday, April 06, 2009 7:17 PM > > To: jQuery (English) > > Subject: [jQuery] newbie question > > > I've tried loading jquery.js into a site several times several > > different ways and can't even get an alert to pop up. I can get a test > > page to work only if I use an src address to google's jquery. > > > Can't I just upload the jquery-1.3.2.min.js file or is there some > > configuring I have to do? > > > What problem should I look for on my web account? > > > ...Ron
[jQuery] Re: newbie question
$ is simply an alias to jQuery(). jQuery.noConflict() removes the $ alias so other frameworks don't throw a fit. $bfa = jQuery.noConflict() simply assigns $bfa to jQuery(). The $ tends to confuse people at first but it's just a function alias, It's just a shortcut for jQuery, thats it, nothing else. If it helps you any just replace the $ in your head with jQuery() On Apr 7, 11:26 am, "Rick Faircloth" wrote: > Hi, Ron...glad you making some progress! > > And don't worry about the oversights...I'm constantly running > into stuff like that...(I'm getting too old for all this, too! :o) > > Concerning the noConflict stuff... > I haven't had occasion, yet to have to use the noConflict approach, > so I'm not personally experienced with it. But from having read > about it on the list, my understanding is that it is simply a way > to prevent the jQuery framework from conflicting with other Javascript > frameworks, such as MooTools, Prototype, etc. > > And, apparently, from your example code, the coder is simply using > a variable to represent the jQuery.noConflict(); code so he doesn't have > to do so much typing. $bfa or jq is just quicker. It's just a convenience > thing...perhaps someone else has more to offer in terms of explanation. > > hth, > > Rick > > -Original Message- > From: jquery-en@googlegroups.com [mailto:jquery...@googlegroups.com] On > > Behalf Of Ronz > Sent: Tuesday, April 07, 2009 1:21 PM > To: jQuery (English) > Subject: [jQuery] Re: newbie question > > Hi, Rick. > > Here's a quote to my hosting news group that 'splains' what has > happened since yesterday. Maybe you could comment on the latter > portion if you have time. TIA.Ron > > > > It turns out that what I downloaded from jQuery ended up with a bunch > of line feeds in it...my bad I'm sure. > > I ended up copying the jquery.js from the another site's installation > and still had the same problem, but then it dawned on me that I should > look to see if my editor(s) 'wrapped' the file and, sure enough, I let > it get screwed up with those 'stinking' extra line feeds! > > > To add insult to my stupidity, one copy paste from that other site > wrapped the file with ... > > > My only excuse is that, after 12 years, I'm now using linux with > Bulefish and Screem editors that have 'con-foo-zed' me. > > >> I *really* feel stupid at this point.Ron > > I'm getting too old for this..:=) > > Now for my 'extra' question: > > > > > var jq = jQuery.noConflict(); > > jq(document).ready(function() > > ... > > I noticed the 'var - noConflict' line above and saw it in another site > like this: > > var $bfa = jQuery.noConflict(); > $bfa(document).ready(function(){ > > and in his function content "$bfa" showed up in many places like > > $bfa(".post img").each(function() { > var maxwidth = centerwidth - 10 + 'px'; > var imgwidth = $bfa(this).width(); > ... > > First of all, I'd seen no mention of "jQuery.noConflict()" in their > docs and then seeing all those "$whatervers" all through a function's > code mystified me. I'm guessing it uniquely identifies/isolates each > function somehow. > > What is that all about and do you do that for some reason? > > A link somewhere that explains the above would be fine. > > Thanks for your help.Ron > > > > On Apr 6, 11:27 pm, "Rick Faircloth" wrote: > > Hi, Ron... > > > Assuming that you have your jQuery source file "jquery-1.3.2.min.js" > > in the same directory as the page it's running on, > > do you have this in the head section of your document? > > > > > > If you do, then also post your jQuery code and your HTML so it's > > easier to see where the problem may be in your code. > > > Rick > > > -Original Message- > > From: jquery-en@googlegroups.com [mailto:jquery...@googlegroups.com] On > > > Behalf Of Ronz > > Sent: Monday, April 06, 2009 7:17 PM > > To: jQuery (English) > > Subject: [jQuery] newbie question > > > I've tried loading jquery.js into a site several times several > > different ways and can't even get an alert to pop up. I can get a test > > page to work only if I use an src address to google's jquery. > > > Can't I just upload the jquery-1.3.2.min.js file or is there some > > configuring I have to do? > > > What problem should I look for on my web account? > > > ...Ron
[jQuery] Re: newbie question
Hi, Ron...glad you making some progress! And don't worry about the oversights...I'm constantly running into stuff like that...(I'm getting too old for all this, too! :o) Concerning the noConflict stuff... I haven't had occasion, yet to have to use the noConflict approach, so I'm not personally experienced with it. But from having read about it on the list, my understanding is that it is simply a way to prevent the jQuery framework from conflicting with other Javascript frameworks, such as MooTools, Prototype, etc. And, apparently, from your example code, the coder is simply using a variable to represent the jQuery.noConflict(); code so he doesn't have to do so much typing. $bfa or jq is just quicker. It's just a convenience thing...perhaps someone else has more to offer in terms of explanation. hth, Rick -Original Message- From: jquery-en@googlegroups.com [mailto:jquery...@googlegroups.com] On Behalf Of Ronz Sent: Tuesday, April 07, 2009 1:21 PM To: jQuery (English) Subject: [jQuery] Re: newbie question Hi, Rick. Here's a quote to my hosting news group that 'splains' what has happened since yesterday. Maybe you could comment on the latter portion if you have time. TIA.Ron It turns out that what I downloaded from jQuery ended up with a bunch of line feeds in it...my bad I'm sure. I ended up copying the jquery.js from the another site's installation and still had the same problem, but then it dawned on me that I should look to see if my editor(s) 'wrapped' the file and, sure enough, I let it get screwed up with those 'stinking' extra line feeds! To add insult to my stupidity, one copy paste from that other site wrapped the file with ... My only excuse is that, after 12 years, I'm now using linux with Bulefish and Screem editors that have 'con-foo-zed' me. >> I *really* feel stupid at this point.Ron I'm getting too old for this..:=) Now for my 'extra' question: > > var jq = jQuery.noConflict(); > jq(document).ready(function() > ... I noticed the 'var - noConflict' line above and saw it in another site like this: var $bfa = jQuery.noConflict(); $bfa(document).ready(function(){ and in his function content "$bfa" showed up in many places like $bfa(".post img").each(function() { var maxwidth = centerwidth - 10 + 'px'; var imgwidth = $bfa(this).width(); ... First of all, I'd seen no mention of "jQuery.noConflict()" in their docs and then seeing all those "$whatervers" all through a function's code mystified me. I'm guessing it uniquely identifies/isolates each function somehow. What is that all about and do you do that for some reason? A link somewhere that explains the above would be fine. Thanks for your help.Ron On Apr 6, 11:27 pm, "Rick Faircloth" wrote: > Hi, Ron... > > Assuming that you have your jQuery source file "jquery-1.3.2.min.js" > in the same directory as the page it's running on, > do you have this in the head section of your document? > > > > If you do, then also post your jQuery code and your HTML so it's > easier to see where the problem may be in your code. > > Rick > > -Original Message- > From: jquery-en@googlegroups.com [mailto:jquery...@googlegroups.com] On > > Behalf Of Ronz > Sent: Monday, April 06, 2009 7:17 PM > To: jQuery (English) > Subject: [jQuery] newbie question > > I've tried loading jquery.js into a site several times several > different ways and can't even get an alert to pop up. I can get a test > page to work only if I use an src address to google's jquery. > > Can't I just upload the jquery-1.3.2.min.js file or is there some > configuring I have to do? > > What problem should I look for on my web account? > > ...Ron
[jQuery] Re: newbie question
Hi, Rick. Here's a quote to my hosting news group that 'splains' what has happened since yesterday. Maybe you could comment on the latter portion if you have time. TIA.Ron It turns out that what I downloaded from jQuery ended up with a bunch of line feeds in it...my bad I'm sure. I ended up copying the jquery.js from the another site's installation and still had the same problem, but then it dawned on me that I should look to see if my editor(s) 'wrapped' the file and, sure enough, I let it get screwed up with those 'stinking' extra line feeds! To add insult to my stupidity, one copy paste from that other site wrapped the file with ... My only excuse is that, after 12 years, I'm now using linux with Bulefish and Screem editors that have 'con-foo-zed' me. >> I *really* feel stupid at this point.Ron I'm getting too old for this..:=) Now for my 'extra' question: > > var jq = jQuery.noConflict(); > jq(document).ready(function() > ... I noticed the 'var - noConflict' line above and saw it in another site like this: var $bfa = jQuery.noConflict(); $bfa(document).ready(function(){ and in his function content "$bfa" showed up in many places like $bfa(".post img").each(function() { var maxwidth = centerwidth - 10 + 'px'; var imgwidth = $bfa(this).width(); ... First of all, I'd seen no mention of "jQuery.noConflict()" in their docs and then seeing all those "$whatervers" all through a function's code mystified me. I'm guessing it uniquely identifies/isolates each function somehow. What is that all about and do you do that for some reason? A link somewhere that explains the above would be fine. Thanks for your help.Ron On Apr 6, 11:27 pm, "Rick Faircloth" wrote: > Hi, Ron... > > Assuming that you have your jQuery source file "jquery-1.3.2.min.js" > in the same directory as the page it's running on, > do you have this in the head section of your document? > > > > If you do, then also post your jQuery code and your HTML so it's > easier to see where the problem may be in your code. > > Rick > > -Original Message- > From: jquery-en@googlegroups.com [mailto:jquery...@googlegroups.com] On > > Behalf Of Ronz > Sent: Monday, April 06, 2009 7:17 PM > To: jQuery (English) > Subject: [jQuery] newbie question > > I've tried loading jquery.js into a site several times several > different ways and can't even get an alert to pop up. I can get a test > page to work only if I use an src address to google's jquery. > > Can't I just upload the jquery-1.3.2.min.js file or is there some > configuring I have to do? > > What problem should I look for on my web account? > > ...Ron
[jQuery] Re: newbie question
Hi, Ron... Assuming that you have your jQuery source file "jquery-1.3.2.min.js" in the same directory as the page it's running on, do you have this in the head section of your document? If you do, then also post your jQuery code and your HTML so it's easier to see where the problem may be in your code. Rick -Original Message- From: jquery-en@googlegroups.com [mailto:jquery...@googlegroups.com] On Behalf Of Ronz Sent: Monday, April 06, 2009 7:17 PM To: jQuery (English) Subject: [jQuery] newbie question I've tried loading jquery.js into a site several times several different ways and can't even get an alert to pop up. I can get a test page to work only if I use an src address to google's jquery. Can't I just upload the jquery-1.3.2.min.js file or is there some configuring I have to do? What problem should I look for on my web account? ...Ron
[jQuery] Re: Newbie Question: get id from A tag
ok, got it. thanx weidc, On Mar 24, 9:44 pm, weidc wrote: > $(".clickme").attr("id"); > > On 24 Mrz., 14:03, Jesse wrote: > > > Hello, > > > I am not good at js. I want to get the id from "A" tag. > > E.g. link > > > I need the value "1234" from the code above, but dont know how to do > > it. > > > Please help. > > > Thanks.
[jQuery] Re: Newbie Question: get id from A tag
$(".clickme").attr("id"); On 24 Mrz., 14:03, Jesse wrote: > Hello, > > I am not good at js. I want to get the id from "A" tag. > E.g. link > > I need the value "1234" from the code above, but dont know how to do > it. > > Please help. > > Thanks.
[jQuery] Re: Newbie question - downloading jQuery
What did you download? There is the main jquery library (plain, minified, etc.) and there's all the UI stuff. If you want to use the UI widget/effect libraries you'll have to get them separately. However, you can get them as prepackaged bundles based on the things you want: http://ui.jquery.com/download Just check the items you want, choose the version (on the right) and download. You can also use the "Complete developer bundles" at top to grab everything at once as separate files. On Fri, Feb 6, 2009 at 11:50 AM, rontivo wrote: > > I just stumbled across jQuery - I'm very impressed with what I've seen > on the site. In my case my interest was sparked by a desire to put a > floating dialog on our site. I've downloaded jQuery, and I was able > to copy the code from the sample and get a dialog to show up, but I > notice that the sample code includes the following lines: > > http://ui.jquery.com/testing/ui/ > ui.core.js"> > http://ui.jquery.com/testing/ui/ > ui.dialog.js"> > http://ui.jquery.com/testing/ui/ > ui.resizable.js"> > http://ui.jquery.com/testing/ui/ > ui.draggable.js"> > > I was expecting the download to either contain all of the necessary > code, or to expand to a set of files, and I would include the > appropriate files from that directory. I'd like to have the code > hosted on my server, rather than referring to version on the jquery > servers. > > I'm obviously missing something in my efforts to download jQuery to my > server. A little help getting me pointed in the right direction would > be appreciated. > > Thanks, > -Ron >
[jQuery] Re: Newbie question
See http://docs.jquery.com/CSS Specifically http://docs.jquery.com/CSS/offset http://docs.jquery.com/CSS/position http://docs.jquery.com/CSS/scrollTop http://docs.jquery.com/CSS/scrollLeft - Richard On Mon, Jan 5, 2009 at 2:11 PM, saiful.ha...@gmail.com < saiful.ha...@gmail.com> wrote: > > hi all, > > is jquery have function like findXY(element) or scroll position? > sorry not finish read all document about jquery > > ~ saiful haqqi ~ >
[jQuery] Re: Newbie question: how to reference an element via XML attribute.
Hi, Mike. Thanks for the hint. Will try it tonite at home :-) Jean On Oct 16, 2:28 am, Mike Alsup <[EMAIL PROTECTED]> wrote: > > Second, I´ve found a solution using the DOM while it works is far from > > being jQuery pure code: > > > //Iterate among all retrieved items. > > $('item', xml).each(function(i){ > > //Retrieve the Node of the item. > > Item = $('item',xml).get(i); > > //Point to the Text to be changed. > > Elem = > > document.getElementById(Item.attributes[0].nodeValue); > > //Perform the change. > > Elem.innerHTML = Item.childNodes[0].nodeValue > > > Obviously I am using some middle vars that are not really necessary > > but so far I prefer it this way. > > > Yes, it works now but I would like to learn how to do the same with > > pure jQuery so any help is still appreciated. > > This should work: > > $.get("Thefile.xml", function (xml) { > $('item', xml).each(function() { > var $this = $(this); > var id = $this.attr('id'); > $('#'+id).html($this.text()); > }); > > });
[jQuery] Re: Newbie question: how to reference an element via XML attribute.
> Second, I´ve found a solution using the DOM while it works is far from > being jQuery pure code: > > //Iterate among all retrieved items. > $('item', xml).each(function(i){ > //Retrieve the Node of the item. > Item = $('item',xml).get(i); > //Point to the Text to be changed. > Elem = document.getElementById(Item.attributes[0].nodeValue); > //Perform the change. > Elem.innerHTML = Item.childNodes[0].nodeValue > > Obviously I am using some middle vars that are not really necessary > but so far I prefer it this way. > > Yes, it works now but I would like to learn how to do the same with > pure jQuery so any help is still appreciated. This should work: $.get("Thefile.xml", function (xml) { $('item', xml).each(function() { var $this = $(this); var id = $this.attr('id'); $('#'+id).html($this.text()); }); });
[jQuery] Re: Newbie question: how to reference an element via XML attribute.
Hi again. First of all, sorry for the double posting; just a mistake. Second, I´ve found a solution using the DOM while it works is far from being jQuery pure code: //Iterate among all retrieved items. $('item', xml).each(function(i){ //Retrieve the Node of the item. Item = $('item',xml).get(i); //Point to the Text to be changed. Elem = document.getElementById(Item.attributes[0].nodeValue); //Perform the change. Elem.innerHTML = Item.childNodes[0].nodeValue Obviously I am using some middle vars that are not really necessary but so far I prefer it this way. Yes, it works now but I would like to learn how to do the same with pure jQuery so any help is still appreciated. Cheers. Jean
[jQuery] Re: Newbie question on positioning images
Is the gif visible when you try to get it's height? If not try this: var height = $('#wait_also').css("visibility", "visible").height(); $('#wait_also').css("visibility", "hidden"); On 12 Sep., 12:23, Kevin Thorpe <[EMAIL PROTECTED]> wrote: > Sorry, this is very simple I think but I can't fathom it out. > > I have a select box (id=select_also) and a gif (id=wait_also) and I want > the gif centred over the select box so > I can turn it on and off as I reload the contents of the select box. > I've tried adding in the jquery.dimensions > plugin and the gif has the functions defined as properties, but > $('#wait_also').height() is returning null. > > Can anyone please hold my hand on this? > > thanks
[jQuery] Re: NEWBIE Question re span and form elements
Wow, that sure is nice and concise. Thanks Richard On Aug 29, 12:45 am, "Richard D. Worth" <[EMAIL PROTECTED]> wrote: > You could do something like this: > > $("#mySpan").find(":input").removeAttr("checked").val("").hide() > > - Richard > > Richard D. Worthhttp://rdworth.org/ > > On Thu, Aug 28, 2008 at 10:11 AM, Peter Bailey <[EMAIL PROTECTED]> wrote: > > > Hi there. I recently discovered jQuery and it appears to be an > > excellent library. I started looking at libs because I have a specific > > problem I want to solve easily. I want to an able to show and hide a > > on my page. The span may contain some form elements like > > checkboxes for example. It is possible that a CB could have been > > selected, and then the event the causes the span to hide comes into > > play (they answered another question or whatever). If this is the > > case, I want to hide the span but also uncheck (or whatever) the > > elements in the span. > > > Is there an easy way to do this with jQuery. I am just starting to > > read through the docs, and have purchased a couple of books, but of > > course, I have a timeline to beat. Any suggestions or pointers to docs > > would be much appreciated. > > > Thanks, > > > Peter
[jQuery] Re: NEWBIE Question re span and form elements
You could do something like this: $("#mySpan").find(":input").removeAttr("checked").val("").hide() - Richard Richard D. Worth http://rdworth.org/ On Thu, Aug 28, 2008 at 10:11 AM, Peter Bailey <[EMAIL PROTECTED]> wrote: > > Hi there. I recently discovered jQuery and it appears to be an > excellent library. I started looking at libs because I have a specific > problem I want to solve easily. I want to an able to show and hide a > on my page. The span may contain some form elements like > checkboxes for example. It is possible that a CB could have been > selected, and then the event the causes the span to hide comes into > play (they answered another question or whatever). If this is the > case, I want to hide the span but also uncheck (or whatever) the > elements in the span. > > Is there an easy way to do this with jQuery. I am just starting to > read through the docs, and have purchased a couple of books, but of > course, I have a timeline to beat. Any suggestions or pointers to docs > would be much appreciated. > > Thanks, > > Peter > >
[jQuery] Re: newbie question about assigning a varialbe for use in a selector statement
I think you can do this a little differently to achieve the effect you're looking for. One thing you should be aware of is that IDs and classes must start with a letter. We won't have to access those numbers in the script anyway. $(document).ready(function() { $('div.add_image_content').hide(); $('input.add_image').bind('click', function() { $(this).next().toggle(); }); }); Hope that works for you. --Karl Karl Swedberg www.englishrules.com www.learningjquery.com On Jul 12, 2008, at 2:42 PM, jt wrote: I have a form with the following (there are about 20 of these; you can assume that the id value goes up to 706): add image 2 and beneath it would like to have a form element that is normally hidden: hello in add_image_content Basically, I'd like to be able to access the e.targed.id and then use it in a selector to select div's that have 'add_image_content' and the associated id value. My javascript is: $(document).ready(function(){ $('.add_image_content').hide(); $('.add_image').bind('click',function(e){ //alert(e.target.id); var $val=e.target.id; $(div:contains($val)).show(); //didn't work //$('.add_image_content' + e.target.id).show(); //$(e.target.id).show(); }); }); thanks for any help, jt
[jQuery] Re: Newbie question about Radio Buttons
Hi everyone, I found one way to do this, and it is only a few lines. This is my first use of JQuery so can anyone comment on whether there is a better way? $(document).ready(function() { $("input:radio").click(function() { thisClass = $(this).attr("class"); $("." + thisClass).filter(":radio").attr('checked', false); $(this).attr('checked', true); }); }) Thanks PKJ
[jQuery] Re: newbie question - why does this code not work?
On 29 déc, 18:27, X490812 <[EMAIL PROTECTED]> wrote: > ... > parent.document.getElementById("buttonsForm:filterByActor").style.display="none" > //jQuery("#buttonsForm:filterByActor", > parent.document).css({"display":"none"}); > > }); > > //--> > > The issue is that the jquery script that is commented out does not > work, BUT the standard javascript code DOES WORK - why?!?! What am I > doing wrong? Is there a better way to do this? Newbie too, so I'm not sure, but... I guess this comes from the ":" in your id (character with a special meaning for CSS). Look at the FAQ: http://docs.jquery.com/Frequently_Asked_Questions#How_do_I_select_an_element_that_has_weird_characters_in_its_ID.3F HTH
[jQuery] Re: newbie question
To get "this" to chain with the .click() method, you need to wrap it in $() so it looks like: $(this) Better still, don't bother with the .each(). $("[EMAIL PROTECTED]'button'].button1").click(function(){MyFunc(this);}); --Karl _ Karl Swedberg www.englishrules.com www.learningjquery.com On Dec 6, 2007, at 6:36 PM, FrenchiINLA wrote: I have a javascript function like MyFunc(btn), and I would like to associate a click event to all my button with button1 class in the page to this function. I tried the following code and is not working for me: $("[EMAIL PROTECTED]'button'].button1").each(function() { this.click(function(){MyFunc(this);}); }); what's wrong with my code? any help would be greatly appreciated.
[jQuery] Re: Newbie question regarding requesting confirmation when a link is selected.
Just a quick point. You shouldn't really have 'delete' as a hyperlink. Any actions which affect your database should be a POST from a form submission. The reason for this is simple. If your site is public and google or someone crawls your site it will hit all the delete hyperlinks (ignoring the javascript confirm) and hey-presto! vanished database.
[jQuery] Re: Newbie question regarding requesting confirmation when a link is selected.
$('a.taskDelete').click(function(){ return confirm('Please confirm deletion...'); }); On Dec 2, 4:41 am, lattedaddy <[EMAIL PROTECTED]> wrote: > Hi- > > I'm pretty new to both JS and JQuery. Thanks for the help in advance. > > I have a link in my code as follows (it talks to an app to do a delete > of a task) > > > >">Delete > > When the link is selected I would like to popup a confirmation dialog > and either do the delete or not depending on the answer in the > confirmation dialog. My intuition tells me this should be easy. I've > been working with jquery both with and without the impromptu plugin > with no success. > > I must be missing something obvious. > > Thanks again, > Bruce
[jQuery] Re: Newbie Question: Callback for Load Only Works the First Time Load is Called?
That worked. Thanks! -- View this message in context: http://www.nabble.com/Newbie-Question%3A-Callback-for-Load-Only-Works-the-First-Time-Load-is-Called--tf4720377s27240.html#a13501834 Sent from the jQuery General Discussion mailing list archive at Nabble.com.
[jQuery] Re: Newbie Question: Callback for Load Only Works the First Time Load is Called?
Try... $("#HelpInfo").load("http://localhost:/index.php/your_plan/ ShowHelpInfo", {contents: htmlStr}, function(){ ScrollToDiv("HelpInfo"); } ); }); On Oct 30, 7:53 pm, Vik_R <[EMAIL PROTECTED]> wrote: > I've got some code that uses load to add some help info to a page when the > user clicks on a help button. > > I pass the current contents of the div to the php function that provides the > help info. The php function checks the current contents, and if it sees > that the help info is already on the screen, it toggles it off, and puts the > help button back in its place. > > I added a callback so that after the load, the page will scroll to the help > info just added. > > All this works great, but the scroll only works the first time: > > - The user clicks the help button, and the help text is loaded and appears, > and page scrolls to the help text - correctly. > - The user clicks a close box button, and the help text disappears and is > replaced by the help button - correctly. > - The user clicks the help button for the second time, and the help text is > loaded and appears - but the page doesn't scroll to the help text. > > How can I correct this? > > Thanks in advance to all for any info. > > ///JAVASCRIPT/JQUERY > function ScrollToDiv(theDivID) > { > $("html,body").animate({ scrollTop: $("#"+theDivID).offset().top }); > } > >$(document).ready(function(){ > >$("#HelpInfo").click(function(){ > var htmlStr = $(this).html(); > > $("#HelpInfo").load("http://localhost:/index.php/your_plan/ShowHelpInfo";, > {contents: htmlStr}, ScrollToDiv("HelpInfo")); > }); > > ///PHP CODE - CodeIgniter framework - this function is callable as > ///http://localhost:/index.php/your_plan/ShowHelpInfo > > function ShowHelpInfo() > { > $lengthOfCurrentContents = strlen($_POST['contents']); > if ($lengthOfCurrentContents < 500) > { > $output = "Help info and Close Box"; > > echo $output; > } > else > { > $output = "Help Button"; > > echo $output; > } > > } > -- > View this message in > context:http://www.nabble.com/Newbie-Question%3A-Callback-for-Load-Only-Works... > Sent from the jQuery General Discussion mailing list archive at Nabble.com.
[jQuery] Re: Newbie Question: Specifying the links that are in a particular Div?
Thanks very much, guys! -- View this message in context: http://www.nabble.com/Newbie-Question%3A-Specifying-the-links-that-are-in-a-particular-Div--tf4713851s27240.html#a13480579 Sent from the jQuery General Discussion mailing list archive at Nabble.com.
[jQuery] Re: Newbie Question: Specifying the links that are in a particular Div?
Hi there, a couple of things. First, you can create your selectors the same way you do with css rules (but you can actually use all the selectors from css 1-3 with jQuery). So, inside the $(), just put in "#menu a". Then, when you're dealing with links, you'll need to stop the default behavior (which is to try to send you to the URL referred to in the href). You can do that a couple ways, but the simplest is by add a line with return false; in it. Here is a modified version of your script with the changes I mentioned above: $(document).ready(function(){ $("#menu a").click(function(){ alert("Thanks for visiting!"); return false; }); }); --Karl _ Karl Swedberg www.englishrules.com www.learningjquery.com On Oct 29, 2007, at 3:04 PM, Vik_R wrote: I'd like to attach an onclick function to the links that are in a specific div. The id of the div is "menu". I tried variations on this: $(document).ready(function(){ $("#menu").("a").click(function(){ alert("Thanks for visiting!"); }); }); ...but I was just guessing, and I didn't find the correct way yet. What is the correct way to do this? Thanks very much in advance to all for any info. -- View this message in context: http://www.nabble.com/Newbie-Question% 3A-Specifying-the-links-that-are-in-a-particular-Div-- tf4713851s27240.html#a13474559 Sent from the jQuery General Discussion mailing list archive at Nabble.com.
[jQuery] Re: Newbie Question: Specifying the links that are in a particular Div?
I think you want $("#menu a").click(function() { etc. }); -- Josh - Original Message - From: "Vik_R" <[EMAIL PROTECTED]> To: Sent: Monday, October 29, 2007 12:04 PM Subject: [jQuery] Newbie Question: Specifying the links that are in a particular Div? I'd like to attach an onclick function to the links that are in a specific div. The id of the div is "menu". I tried variations on this: $(document).ready(function(){ $("#menu").("a").click(function(){ alert("Thanks for visiting!"); }); }); ...but I was just guessing, and I didn't find the correct way yet. What is the correct way to do this? Thanks very much in advance to all for any info. -- View this message in context: http://www.nabble.com/Newbie-Question%3A-Specifying-the-links-that-are-in-a-particular-Div--tf4713851s27240.html#a13474559 Sent from the jQuery General Discussion mailing list archive at Nabble.com.
[jQuery] Re: Newbie question on hide objects
How about creating the form once and moving it to where ever it's needed. This assumes you can only have one form displayed at a time. Failing that. Make one form and clone it each time it's needed. Adrian On Oct 25, 9:15 pm, "Merlin" <[EMAIL PROTECTED]> wrote: > Hello everybody, > > I am trying to add a comment functionality to my webapp that includes > a reply possibility on each comment. Like on digg for example. I am > new to AJAX, but would like to take this oportunity and to jump into > cold water with that task now. > > My goal is to use JQuery to show and hide a dialog box which contains > the form to reply on the comments. > Basicaly I managed to do this, but now I have a general understanding > problem. Let's say there are 100 comments there and I want to have > reply possiblity for each of them. Do I have to integrate the same > code underneath each one? I would rather like to have a box in that is > used for everyone of them. I believe this is somehow done with divs, > but I do not know how. > > Here is my code: > > > > > $(document).ready(function() { > $('#slickbox').hide(); > $('a#reply').click(function() { > $('#slickbox').toggle('slow'); > return false; > }); > > }); > > > > > Reply > Space for reply box > > next comment > > > > I would like to place a complex reply form into the id=slickbox, but > here is where the problems starts. If I do this for all 100 comments > the code will be way to much to load. There must be a smarter way to > achieve this. > > Thank you for any help on this. I am pretty much stuck here. > > Best regards, > > Merlin > -- > Merlin > [EMAIL PROTECTED] > > --http://www.fastmail.fm- Does exactly what it says on the tin
[jQuery] Re: Newbie question
Im not understanding. If you have that CSS, it's applied to the id="Explanation". What do you want to add? Glen On 10/2/07, Johny <[EMAIL PROTECTED]> wrote: > > > Hi, > I have style defined like this > > div#Explanation{position:absolute; top:720px; width:10px; right: > 0px;margin:40px 0 0 0;} > > and my HTML code > > > > > > * > Login size="30" value="" maxlength="50" /> > Popis > > > * > Password id="id_Password"name="Password" size="30" value="" maxlength="50" /> td> > > > > > and I would like to add Explanation style to my > using jQuery. > Is that possible? > Thanks > BL. > >
[jQuery] Re: NEWBIE QUESTION: Catch Select event
OK, I got it working. Using the following code, all statement are affected: $(function() { $("select").change(function() { $('[EMAIL PROTECTED]').attr('style', 'position:absolute; top:200; left:400; height:145px; width:145px; z-index:2; background- image: url(/sms_sge/App_Themes/smsTheme/Images/loadingAnimation.gif); visibility:inline;'); }); }); My next question would be the use of the "contains" custom selector as described in http://docs.jquery.com/DOM/Traversing/Selectors#Custom_Selectors_2. I tried $(function() { $("/select:contains('ddlLocType')", this).change(function() { $('[EMAIL PROTECTED]').attr('style', 'position:absolute; top:200; left:400; height:145px; width:145px; z-index:2; background- image: url(/sms_sge/App_Themes/smsTheme/Images/loadingAnimation.gif); visibility:inline;'); }); }); and also $(function() { $("select:contains('ddlLocType')", this).change(function() { $('[EMAIL PROTECTED]').attr('style', 'position:absolute; top:200; left:400; height:145px; width:145px; z-index:2; background- image: url(/sms_sge/App_Themes/smsTheme/Images/loadingAnimation.gif); visibility:inline;'); }); }); trying to limit the call for the change function only for the select statement whose id contains the text "ddlLocType". On Sep 21, 1:00 pm, hobbit <[EMAIL PROTECTED]> wrote: > I wonder if the problem in my application would be the fact that my > is actually an ASP.Net DropDownList control that get > converted to a at run time? > > On Sep 21, 12:00 pm, hobbit <[EMAIL PROTECTED]> wrote: > > > > > That is interesting. I tried your test page and it also works for me. > > I wonder why it is not working in my application. > > > On Sep 21, 11:14 am, "Richard D. Worth" <[EMAIL PROTECTED]> wrote: > > > > Your code worked for me in IE and FF: > > > >http://pastie.caboo.se/99419 > > > > - Richard > > > > On 9/21/07, hobbit <[EMAIL PROTECTED]> wrote: > > > > > I tried all the following and get no alerts: > > > > > $("select").keyup(function() { > > > > alert("here1"); > > > > }); > > > > $("select").keydown(function() { > > > > alert("here2"); > > > > }); > > > > $("select").keypress(function() { > > > > alert("here3"); > > > > }); > > > > $("select").mousedown(function() { > > > > alert("here4"); > > > > }); > > > > $("select").mouseout(function() { > > > > alert("here5"); > > > > }); > > > > $("select").mouseup(function() { > > > > alert("here6"); > > > > }); > > > > > On Sep 21, 10:01 am, "Richard D. Worth" <[EMAIL PROTECTED]> wrote: > > > > > The change event doesn't fire until the input is blurred (focus moves > > > > away > > > > > from the dropdown via tab-key or mouse click elsewhere). If you want > > > > > to > > > > > handle the "changes" to the selected option while they're being > > > > > changed, > > > > try > > > > > keydown, keyup, or keypress. > > > > > > - Richard > > > > > > On 9/21/07, Brook Davies <[EMAIL PROTECTED]> wrote: > > > > > > > I've tried this, but it does not catch change events trigged by the > > > > > > keyboard. Why? > > > > > > > Brook > > > > > > > -Original Message- > > > > > > From: jquery-en@googlegroups.com [mailto:[EMAIL PROTECTED] > > > > On > > > > > > Behalf Of Andy Matthews > > > > > > Sent: September 20, 2007 1:21 PM > > > > > > To: jquery-en@googlegroups.com > > > > > > Subject: [jQuery] Re: NEWBIE QUESTION: Catch Select event > > > > > > > I believe you'd want the change handler. > > > > > > > $("select").change(function() { > > > > > > //do some stuff here... > > > > > > )}; > > > > > > > -Original Message- > > > > > > From: jquery-en@googlegroups.com [mailto:[EMAIL PROTECTED] > > > > On > > > > > > Behalf Of hobbit > > > > > > Sent: Thursday, September 20, 2007 1:22 PM > > > > > > To: jQuery (English) > > > > > > Subject: [jQuery] NEWBIE QUESTION: Catch Select event > > > > > > > Hi, > > > > > > > I would like to catch the select event when a user changes the > > > > > > select > > > > item > > > > > > in any in a form. Something like: > > > > > > > $("select").select(function() { > > > > > > //do some stuff here... > > > > > > )}; > > > > > > > Is this feasible?- Hide quoted text - > > > > > > - Show quoted text -- Hide quoted text - > > > > - Show quoted text -- Hide quoted text - > > > - Show quoted text -- Hide quoted text - > > - Show quoted text -
[jQuery] Re: NEWBIE QUESTION: Catch Select event
I wonder if the problem in my application would be the fact that my is actually an ASP.Net DropDownList control that get converted to a at run time? On Sep 21, 12:00 pm, hobbit <[EMAIL PROTECTED]> wrote: > That is interesting. I tried your test page and it also works for me. > I wonder why it is not working in my application. > > On Sep 21, 11:14 am, "Richard D. Worth" <[EMAIL PROTECTED]> wrote: > > > > > Your code worked for me in IE and FF: > > >http://pastie.caboo.se/99419 > > > - Richard > > > On 9/21/07, hobbit <[EMAIL PROTECTED]> wrote: > > > > I tried all the following and get no alerts: > > > > $("select").keyup(function() { > > > alert("here1"); > > > }); > > > $("select").keydown(function() { > > > alert("here2"); > > > }); > > > $("select").keypress(function() { > > > alert("here3"); > > > }); > > > $("select").mousedown(function() { > > > alert("here4"); > > > }); > > > $("select").mouseout(function() { > > > alert("here5"); > > > }); > > > $("select").mouseup(function() { > > > alert("here6"); > > > }); > > > > On Sep 21, 10:01 am, "Richard D. Worth" <[EMAIL PROTECTED]> wrote: > > > > The change event doesn't fire until the input is blurred (focus moves > > > away > > > > from the dropdown via tab-key or mouse click elsewhere). If you want to > > > > handle the "changes" to the selected option while they're being changed, > > > try > > > > keydown, keyup, or keypress. > > > > > - Richard > > > > > On 9/21/07, Brook Davies <[EMAIL PROTECTED]> wrote: > > > > > > I've tried this, but it does not catch change events trigged by the > > > > > keyboard. Why? > > > > > > Brook > > > > > > -Original Message- > > > > > From: jquery-en@googlegroups.com [mailto:[EMAIL PROTECTED] > > > On > > > > > Behalf Of Andy Matthews > > > > > Sent: September 20, 2007 1:21 PM > > > > > To: jquery-en@googlegroups.com > > > > > Subject: [jQuery] Re: NEWBIE QUESTION: Catch Select event > > > > > > I believe you'd want the change handler. > > > > > > $("select").change(function() { > > > > > //do some stuff here... > > > > > )}; > > > > > > -Original Message- > > > > > From: jquery-en@googlegroups.com [mailto:[EMAIL PROTECTED] > > > On > > > > > Behalf Of hobbit > > > > > Sent: Thursday, September 20, 2007 1:22 PM > > > > > To: jQuery (English) > > > > > Subject: [jQuery] NEWBIE QUESTION: Catch Select event > > > > > > Hi, > > > > > > I would like to catch the select event when a user changes the select > > > item > > > > > in any in a form. Something like: > > > > > > $("select").select(function() { > > > > > //do some stuff here... > > > > > )}; > > > > > > Is this feasible?- Hide quoted text - > > > > > - Show quoted text -- Hide quoted text - > > > - Show quoted text -- Hide quoted text - > > - Show quoted text -
[jQuery] Re: NEWBIE QUESTION: Catch Select event
On 9/21/07, hobbit <[EMAIL PROTECTED]> wrote: > > > This does not seem to work for me. Could it be the version of jquery > we are using? We are using an older version, version 1.0.3. Do you > know if this is supported in that version? In my code I changed jquery-latest.js to jquery-1.0.3.js and it still worked. I guess it must be something else. - Richard
[jQuery] Re: NEWBIE QUESTION: Catch Select event
This does not seem to work for me. Could it be the version of jquery we are using? We are using an older version, version 1.0.3. Do you know if this is supported in that version? I tried replacing the "// do some stuff here" line with simply "alert("hello!");", but this alert is not executed whenever any select statement is changed. On Sep 20, 4:21 pm, "Andy Matthews" <[EMAIL PROTECTED]> wrote: > I believe you'd want the change handler. > > $("select").change(function() { > //do some stuff here... > )}; > > > > -Original Message- > From: jquery-en@googlegroups.com [mailto:[EMAIL PROTECTED] On > > Behalf Of hobbit > Sent: Thursday, September 20, 2007 1:22 PM > To: jQuery (English) > Subject: [jQuery] NEWBIE QUESTION: Catch Select event > > Hi, > > I would like to catch the select event when a user changes the select item > in any in a form. Something like: > > $("select").select(function() { > //do some stuff here... > )}; > > Is this feasible?- Hide quoted text - > > - Show quoted text -
[jQuery] Re: NEWBIE QUESTION: Catch Select event
That is interesting. I tried your test page and it also works for me. I wonder why it is not working in my application. On Sep 21, 11:14 am, "Richard D. Worth" <[EMAIL PROTECTED]> wrote: > Your code worked for me in IE and FF: > > http://pastie.caboo.se/99419 > > - Richard > > On 9/21/07, hobbit <[EMAIL PROTECTED]> wrote: > > > > > > > I tried all the following and get no alerts: > > > $("select").keyup(function() { > > alert("here1"); > > }); > > $("select").keydown(function() { > > alert("here2"); > > }); > > $("select").keypress(function() { > > alert("here3"); > > }); > > $("select").mousedown(function() { > > alert("here4"); > > }); > > $("select").mouseout(function() { > > alert("here5"); > > }); > > $("select").mouseup(function() { > > alert("here6"); > > }); > > > On Sep 21, 10:01 am, "Richard D. Worth" <[EMAIL PROTECTED]> wrote: > > > The change event doesn't fire until the input is blurred (focus moves > > away > > > from the dropdown via tab-key or mouse click elsewhere). If you want to > > > handle the "changes" to the selected option while they're being changed, > > try > > > keydown, keyup, or keypress. > > > > - Richard > > > > On 9/21/07, Brook Davies <[EMAIL PROTECTED]> wrote: > > > > > I've tried this, but it does not catch change events trigged by the > > > > keyboard. Why? > > > > > Brook > > > > > -Original Message- > > > > From: jquery-en@googlegroups.com [mailto:[EMAIL PROTECTED] > > On > > > > Behalf Of Andy Matthews > > > > Sent: September 20, 2007 1:21 PM > > > > To: jquery-en@googlegroups.com > > > > Subject: [jQuery] Re: NEWBIE QUESTION: Catch Select event > > > > > I believe you'd want the change handler. > > > > > $("select").change(function() { > > > > //do some stuff here... > > > > )}; > > > > > -Original Message- > > > > From: jquery-en@googlegroups.com [mailto:[EMAIL PROTECTED] > > On > > > > Behalf Of hobbit > > > > Sent: Thursday, September 20, 2007 1:22 PM > > > > To: jQuery (English) > > > > Subject: [jQuery] NEWBIE QUESTION: Catch Select event > > > > > Hi, > > > > > I would like to catch the select event when a user changes the select > > item > > > > in any in a form. Something like: > > > > > $("select").select(function() { > > > > //do some stuff here... > > > > )}; > > > > > Is this feasible?- Hide quoted text - > > > > - Show quoted text -- Hide quoted text - > > - Show quoted text -
[jQuery] Re: NEWBIE QUESTION: Catch Select event
Your code worked for me in IE and FF: http://pastie.caboo.se/99419 - Richard On 9/21/07, hobbit <[EMAIL PROTECTED]> wrote: > > > I tried all the following and get no alerts: > > $("select").keyup(function() { > alert("here1"); > }); > $("select").keydown(function() { > alert("here2"); > }); > $("select").keypress(function() { > alert("here3"); > }); > $("select").mousedown(function() { > alert("here4"); > }); > $("select").mouseout(function() { > alert("here5"); > }); > $("select").mouseup(function() { > alert("here6"); > }); > > > On Sep 21, 10:01 am, "Richard D. Worth" <[EMAIL PROTECTED]> wrote: > > The change event doesn't fire until the input is blurred (focus moves > away > > from the dropdown via tab-key or mouse click elsewhere). If you want to > > handle the "changes" to the selected option while they're being changed, > try > > keydown, keyup, or keypress. > > > > - Richard > > > > On 9/21/07, Brook Davies <[EMAIL PROTECTED]> wrote: > > > > > > > > > > > > > I've tried this, but it does not catch change events trigged by the > > > keyboard. Why? > > > > > Brook > > > > > -Original Message- > > > From: jquery-en@googlegroups.com [mailto:[EMAIL PROTECTED] > On > > > Behalf Of Andy Matthews > > > Sent: September 20, 2007 1:21 PM > > > To: jquery-en@googlegroups.com > > > Subject: [jQuery] Re: NEWBIE QUESTION: Catch Select event > > > > > I believe you'd want the change handler. > > > > > $("select").change(function() { > > > //do some stuff here... > > > )}; > > > > > -Original Message- > > > From: jquery-en@googlegroups.com [mailto:[EMAIL PROTECTED] > On > > > Behalf Of hobbit > > > Sent: Thursday, September 20, 2007 1:22 PM > > > To: jQuery (English) > > > Subject: [jQuery] NEWBIE QUESTION: Catch Select event > > > > > Hi, > > > > > I would like to catch the select event when a user changes the select > item > > > in any in a form. Something like: > > > > > $("select").select(function() { > > > //do some stuff here... > > > )}; > > > > > Is this feasible?- Hide quoted text - > > > > - Show quoted text - > >
[jQuery] Re: NEWBIE QUESTION: Catch Select event
I tried all the following and get no alerts: $("select").keyup(function() { alert("here1"); }); $("select").keydown(function() { alert("here2"); }); $("select").keypress(function() { alert("here3"); }); $("select").mousedown(function() { alert("here4"); }); $("select").mouseout(function() { alert("here5"); }); $("select").mouseup(function() { alert("here6"); }); On Sep 21, 10:01 am, "Richard D. Worth" <[EMAIL PROTECTED]> wrote: > The change event doesn't fire until the input is blurred (focus moves away > from the dropdown via tab-key or mouse click elsewhere). If you want to > handle the "changes" to the selected option while they're being changed, try > keydown, keyup, or keypress. > > - Richard > > On 9/21/07, Brook Davies <[EMAIL PROTECTED]> wrote: > > > > > > > I've tried this, but it does not catch change events trigged by the > > keyboard. Why? > > > Brook > > > -Original Message- > > From: jquery-en@googlegroups.com [mailto:[EMAIL PROTECTED] On > > Behalf Of Andy Matthews > > Sent: September 20, 2007 1:21 PM > > To: jquery-en@googlegroups.com > > Subject: [jQuery] Re: NEWBIE QUESTION: Catch Select event > > > I believe you'd want the change handler. > > > $("select").change(function() { > > //do some stuff here... > > )}; > > > -Original Message- > > From: jquery-en@googlegroups.com [mailto:[EMAIL PROTECTED] On > > Behalf Of hobbit > > Sent: Thursday, September 20, 2007 1:22 PM > > To: jQuery (English) > > Subject: [jQuery] NEWBIE QUESTION: Catch Select event > > > Hi, > > > I would like to catch the select event when a user changes the select item > > in any in a form. Something like: > > > $("select").select(function() { > > //do some stuff here... > > )}; > > > Is this feasible?- Hide quoted text - > > - Show quoted text -
[jQuery] Re: NEWBIE QUESTION: Catch Select event
The change event doesn't fire until the input is blurred (focus moves away from the dropdown via tab-key or mouse click elsewhere). If you want to handle the "changes" to the selected option while they're being changed, try keydown, keyup, or keypress. - Richard On 9/21/07, Brook Davies <[EMAIL PROTECTED]> wrote: > > > I've tried this, but it does not catch change events trigged by the > keyboard. Why? > > Brook > > -Original Message- > From: jquery-en@googlegroups.com [mailto:[EMAIL PROTECTED] On > Behalf Of Andy Matthews > Sent: September 20, 2007 1:21 PM > To: jquery-en@googlegroups.com > Subject: [jQuery] Re: NEWBIE QUESTION: Catch Select event > > > I believe you'd want the change handler. > > $("select").change(function() { > //do some stuff here... > )}; > > -Original Message- > From: jquery-en@googlegroups.com [mailto:[EMAIL PROTECTED] On > Behalf Of hobbit > Sent: Thursday, September 20, 2007 1:22 PM > To: jQuery (English) > Subject: [jQuery] NEWBIE QUESTION: Catch Select event > > > Hi, > > I would like to catch the select event when a user changes the select item > in any in a form. Something like: > > $("select").select(function() { > //do some stuff here... > )}; > > Is this feasible? > > > > >
[jQuery] Re: NEWBIE QUESTION: Catch Select event
I've tried this, but it does not catch change events trigged by the keyboard. Why? Brook -Original Message- From: jquery-en@googlegroups.com [mailto:[EMAIL PROTECTED] On Behalf Of Andy Matthews Sent: September 20, 2007 1:21 PM To: jquery-en@googlegroups.com Subject: [jQuery] Re: NEWBIE QUESTION: Catch Select event I believe you'd want the change handler. $("select").change(function() { //do some stuff here... )}; -Original Message- From: jquery-en@googlegroups.com [mailto:[EMAIL PROTECTED] On Behalf Of hobbit Sent: Thursday, September 20, 2007 1:22 PM To: jQuery (English) Subject: [jQuery] NEWBIE QUESTION: Catch Select event Hi, I would like to catch the select event when a user changes the select item in any in a form. Something like: $("select").select(function() { //do some stuff here... )}; Is this feasible?
[jQuery] Re: NEWBIE QUESTION: Catch Select event
I believe you'd want the change handler. $("select").change(function() { //do some stuff here... )}; -Original Message- From: jquery-en@googlegroups.com [mailto:[EMAIL PROTECTED] On Behalf Of hobbit Sent: Thursday, September 20, 2007 1:22 PM To: jQuery (English) Subject: [jQuery] NEWBIE QUESTION: Catch Select event Hi, I would like to catch the select event when a user changes the select item in any in a form. Something like: $("select").select(function() { //do some stuff here... )}; Is this feasible?
[jQuery] Re: Newbie Question: Workiing with form fields and jQuery / Select in Particular
$("#mySelect option") $("#mySelect option:selected") $("#mySelect option:selected").attr("id); $(#mySelect")[0] //the actual dom node. All untested, but should be ok. Firebug in Firefox has all kinds of neat tools for this. In the script tab, put a watch for $("#mySelect") and you can inspect the object. If its an array, the number in [] would increment. Glen On 9/20/07, Brook Davies <[EMAIL PROTECTED]> wrote: > > How do you get a reference to a select field and then do things like set > the selectedIndex, get the options array etc. > > > > I know I can get a reference to the object via a basic selector > $("#mySelect") but then how do I access the options array and related stuff? > > > > How do you access the 'object' that you would get returned from > getElementById('mySelect') > > > > Brook >
[jQuery] Re: newbie question
if php's version great than 5.2.0, you may use json_encode function. 2007/9/15, Wizzud <[EMAIL PROTECTED]>: > > Example (very simple!): > /* > * AjaxHandler.php > */ > $myName = $_SERVER['PHP_SELF']; > echo "Hello World, from $myName"; > ?> > -- http://www.goumin.com/ QQ: 443089607 QQ mail: [EMAIL PROTECTED] Skype: huzhenghui Gtalk: huzhengh
[jQuery] Re: newbie question
I really think you should read through the examples given under the ajax() documentation, and the tutorials available on Ajax (and possibly some of the others too) - look for Tutorials on the jQuery website Documentation page. The ajax() examples show you what needs to go in your calling program (presumably test.php), and I've already explained one way to get php to return data (HTML or JSON). The 'block' is simply the JSON structure that the success handler would see in my particular example. Is it complete? You can see it is by comparing it to what my example php code echoed. For what you might want to do, who knows. Tek7 wrote: > > Thanks for getting back to me. Sorry to be a pest...: > > you mentioned: > Then tell $.ajax that it is expecting JSON data, and the success handler > will receive data as on object... > { ok: true > , data: { sessionId: '12345ABCD6789' > , progName: 'AjaxHandler.php' > , from: 'Wizzud' > } > } > > > > Where does this above block go? And is that complete or would I need to > add more to it? > Just to elaborate a little more, I have a file called test.php, and > another file called ajaxhandler.php > In ajaxhandler.php I only need to do my echo: echo " id='ajaxOne'>Hello World, from $myName"; > > and what exactly would I do in test.php? > Actually is it possible I could see a small sample of interaction between > two php pages, just displaying regular html data? Just like 'hello world' > being processed from one php page to another > Thanks again, > Mike > > > > > Wizzud wrote: >> >> Your php program simply 'echo's its data. That data can be HTML, XML, >> JSON, etc, but whatever it is the $.ajax call needs to be aware of the >> type of data expected to be returned (dataType), and it can then inspect >> the returned data in its success handler and, if necessary, act on it. >> >> Example (very simple!): >> /* >> * AjaxHandler.php >> */ >> > $myName = $_SERVER['PHP_SELF']; >> echo "Hello World, from $myName"; >> ?> >> >> In the success handler the data is the String... >> "Hello World, from AjaxHandler.php" >> ... which can then be appended/prepended to body, or manipulated using >> String techniques, or ignored completely, or whatever you wish to do with >> it. >> >> If you want to return JSON data from AjaxHandler.php simply echo it (this >> is over-simplified but still...) ... >> echo "{ok: true, data{sessionId: '$phpSessionId', progName: >> 'AjaxHandler.php', from: 'Wizzud'}}"; >> >> Then tell $.ajax that it is expecting JSON data, and the success handler >> will receive data as on object... >> { ok: true >> , data: { sessionId: '12345ABCD6789' >> , progName: 'AjaxHandler.php' >> , from: 'Wizzud' >> } >> } >> >> From within your success handler you can do what you like with that data, >> eg >> . >> dataType:'json', >> success:function(json){ >> if(json.ok){ >> $('#myHeader').text(json.data.from); >> } >> }, >> . >> >> HTH. >> >> >> Tek7 wrote: >>> >>> Hello all, >>> >>> I apologize as i'm sure I could discern this within the forums, but >>> after much looking i've had a little difficulty understanding. I think >>> once I push past this confusion i'll be able to go forward with >>> everything else: >>> >>> >>> How on earth can I grab data from a php page within my jquery? To be >>> more specific, here is a small block of code I had, (just a snippet >>> nestled between script tags): >>> >>> >>> function test() { >>> $.ajax({ >>> url: 'AjaxHandler.php?a=' + document.forms[0].txt.value, >>> success: XX >>> }); >>> } >>> >>> So let's assume I want to call load ajaxhandler.php, pass in the >>> variable a, examine the var in ajaxhandler.php, and output some text as >>> a result of what was passed. On success, I want to call some function in >>> XX and have it alter the inner html of a div on the page. I want >>> the inner html to be altered based on php session data (or a message >>> returned from ajaxhandler.php, let's say. i don't care which). How do i >>> get the data? I'm a little confused how php sends data back. >>> >>> Thanks so much for shedding light, >>> >>> Mike >>> >> >> > > -- View this message in context: http://www.nabble.com/newbie-question-tf4446564s15494.html#a12694866 Sent from the JQuery mailing list archive at Nabble.com.
[jQuery] Re: newbie question
Your php program simply 'echo's its data. That data can be HTML, XML, JSON, etc, but whatever it is the $.ajax call needs to be aware of the type of data expected to be returned (dataType), and it can then inspect the returned data in its success handler and, if necessary, act on it. Example (very simple!): /* * AjaxHandler.php */ Hello World, from $myName"; ?> In the success handler the data is the String... "Hello World, from AjaxHandler.php" ... which can then be appended/prepended to body, or manipulated using String techniques, or ignored completely, or whatever you wish to do with it. If you want to return JSON data from AjaxHandler.php simply echo it (this is over-simplified but still...) ... echo "{ok: true, data{sessionId: '$phpSessionId', progName: 'AjaxHandler.php', from: 'Wizzud'}}"; Then tell $.ajax that it is expecting JSON data, and the success handler will receive data as on object... { ok: true , data: { sessionId: '12345ABCD6789' , progName: 'AjaxHandler.php' , from: 'Wizzud' } } >From within your success handler you can do what you like with that data, eg . dataType:'json', success:function(json){ if(json.ok){ $('#myHeader').text(json.data.from); } }, . HTH. Tek7 wrote: > > Hello all, > > I apologize as i'm sure I could discern this within the forums, but after > much looking i've had a little difficulty understanding. I think once I > push past this confusion i'll be able to go forward with everything else: > > > How on earth can I grab data from a php page within my jquery? To be more > specific, here is a small block of code I had, (just a snippet nestled > between script tags): > > > function test() { > $.ajax({ > url: 'AjaxHandler.php?a=' + document.forms[0].txt.value, > success: XX > }); > } > > So let's assume I want to call load ajaxhandler.php, pass in the variable > a, examine the var in ajaxhandler.php, and output some text as a result of > what was passed. On success, I want to call some function in XX > and have it alter the inner html of a div on the page. I want the inner > html to be altered based on php session data (or a message returned from > ajaxhandler.php, let's say. i don't care which). How do i get the data? > I'm a little confused how php sends data back. > > Thanks so much for shedding light, > > Mike > -- View this message in context: http://www.nabble.com/newbie-question-tf4446564s15494.html#a12688310 Sent from the JQuery mailing list archive at Nabble.com.
[jQuery] Re: NEWBIE Question: children() skips first element?
Hi John, Sorry, this post is fairly long, what I am doing was a bit tricky to explain. John, I know you are very busy and likely expected a short answer. Don't feel too obligated to read though all of this -- Well, actually, I was trying to get the markup/elements around another group of elements and replace them with a new wrapper. In the example below, the wrapper element (which actually consists of several elements), that I want to remove and re-wrap (while keeping the children) with a new set of elements is: [Section/Panel Heading] Amd it is inside a div with an id 'content' which is static. So I wanted to get the entire '#panelPreview' object, and then I guess traverse through it to the contents of the fieldset element (after removing the legend), store those children and then replace the "#panelPreview" divs, fieldset element, and legend, with my new markup. To the end user this essentially changes the visual display of a container element as the user selects from various pre-defined 'themes'. The outer markup is not the same between themes; some themes use a fieldset while others have multiple nested divs etc. The best I could come up with was to store the js in the DB along with each theme definition. The JS includes code to remove the existing element based on the ID (again, because of the variation between elements I could not create a standard script to handle this..). That string is returned via ajax as well as the new markup for the newly selected theme. These two strings are combined, and an '[id]' placeholder in the string replaced with the current elements ID. The '[newContainer]' placeholder gets replaced with the new markup from the newly selected div. Then the string is evaluated. This is working with essentially this code below being returned from the server: Note: (curContent is an iframe...) = //Remove fieldset legend tag $('#[id]_inner > fieldset > legend',curContext).remove(); //Remove & Replace Container $('#[id]',curContext).wrap([newContainer]).after($('#[id]_inner > fieldset:first',curContext).children()).remove();" = Which after being parsed results in: = //Remove fieldset legend tag $('#previewPanel_inner > fieldset > legend',curContext).remove(); //Remove & Replace Container $('#previewPanel',curContext).wrap(' fieldset:first',curContext).children()).remove();" = This code works - but my guess is it's a mess. This is still in test mode, I haven't gotten to far with this. I honestly am not sure If this is a good way to do it or not or if it will be harder to maintaiin being that the js is stored in a DB. My thought was actually to create the [theme].js files that include the markup and then read those in on the server and store that data in memory so requests for it are fast. This way, also, I can have a testing area and I can simply include and edit the js files to tweak code as opposed to getting it from the database and upating the database each time. Brook -Original Message----- From: jquery-en@googlegroups.com [mailto:[EMAIL PROTECTED] On Behalf Of John Resig Sent: September 12, 2007 12:21 PM To: jquery-en@googlegroups.com Subject: [jQuery] Re: NEWBIE Question: children() skips first element? .html() only gets the innerHTML for the first matched element. What are you trying to do with the children? --John On 9/12/07, Brook Davies <[EMAIL PROTECTED]> wrote: > > > Hello, > > I am trying to simply grab the children of a div. The markup is: > > > > > > [Section/Panel > Heading] > > > > > > But, what I don't understand is why when I call > > alert($('#content').children().html()); > > The resulting html starts with ' class="hPanel">' > > It seems like it is missing the first div after #content? What am I > missing?? > > Brook > > > >
[jQuery] Re: NEWBIE Question: children() skips first element?
On Sep 12, 2007, at 5:50 PM, Glen Lipka wrote: Shouldn't it be child() and children() if we have parent() and parents()? I feel like we are mangling plural/singular rules. I don't think so. As Richard pointed out, you can have more than one direct child (one level down) but you can only ever have one parent. My vote was for using ancestors() instead of parents(), since it's semantically more correct. But I didn't win that one. ;-) If we were going with a purely DOM-based nomenclature, then it would make the most sense (to me, anyway) to have .parent() and .ancestors () going up the DOM and .children() and .descendants() going down the DOM. I'm not suggesting that we change to that, though. People seem to learn the labels pretty quickly and usually have an easy time remembering what they do once they learn them. Here is something interesting, though: .parent(), .parents(), and .children() can all be used without any parameters, but .find() can't. You'd have to do .find('*'). Well, maybe it isn't so interesting. Anyway, just thinking out loud here. Carry on. :-) --Karl _ Karl Swedberg www.englishrules.com www.learningjquery.com On Sep 12, 2007, at 5:50 PM, Glen Lipka wrote: Shouldn't it be child() and children() if we have parent() and parents()? I feel like we are mangling plural/singular rules. Glen On 9/12/07, Richard D. Worth <[EMAIL PROTECTED]> wrote: On 9/12/07, Glen Lipka <[EMAIL PROTECTED] > wrote: I am confused. Why aren't the grandchildren being included in the call for children()? Using $("#content *") gets all the grandkids. I thought parents() gets all the grandparents. Is children different? $("#content").children() is equivalent to $("#content > *") children() is a little more analogous to parent() than parents(). parent() moves the selection up one level (always 1 element, except for document/root), children() moves it down one level (0, 1, or more elements). One reason they might be/seem different is parent elements can have 0-many children, but children have at most 1 parent. So it makes sense to have a parent() that selects 0 or 1, and a parents() that returns 0 to many (all ancestors, in order from first parent to top- level/oldest ancestor). Then parents(':first') == parent(). For all descendants, you can do .find("*"). - Richard
[jQuery] Re: NEWBIE Question: children() skips first element?
Shouldn't it be child() and children() if we have parent() and parents()? I feel like we are mangling plural/singular rules. Glen On 9/12/07, Richard D. Worth <[EMAIL PROTECTED]> wrote: > > > On 9/12/07, Glen Lipka <[EMAIL PROTECTED]> wrote: > > > > I am confused. Why aren't the grandchildren being included in the call > > for children()? > > Using $("#content *") gets all the grandkids. I thought parents() gets > > all the grandparents. Is children different? > > > $("#content").children() is equivalent to $("#content > *") > > children() is a little more analogous to parent() than parents(). parent() > moves the selection up one level (always 1 element, except for > document/root), children() moves it down one level (0, 1, or more elements). > > One reason they might be/seem different is parent elements can have 0-many > children, but children have at most 1 parent. So it makes sense to have a > parent() that selects 0 or 1, and a parents() that returns 0 to many (all > ancestors, in order from first parent to top-level/oldest ancestor). Then > parents(':first') == parent(). > > For all descendants, you can do .find("*"). > > - Richard > >
[jQuery] Re: NEWBIE Question: children() skips first element?
On 9/12/07, Glen Lipka <[EMAIL PROTECTED]> wrote: > > I am confused. Why aren't the grandchildren being included in the call > for children()? > Using $("#content *") gets all the grandkids. I thought parents() gets > all the grandparents. Is children different? $("#content").children() is equivalent to $("#content > *") children() is a little more analogous to parent() than parents(). parent() moves the selection up one level (always 1 element, except for document/root), children() moves it down one level (0, 1, or more elements). One reason they might be/seem different is parent elements can have 0-many children, but children have at most 1 parent. So it makes sense to have a parent() that selects 0 or 1, and a parents() that returns 0 to many (all ancestors, in order from first parent to top-level/oldest ancestor). Then parents(':first') == parent(). For all descendants, you can do .find("*"). - Richard
[jQuery] Re: NEWBIE Question: children() skips first element?
parent is to children as parents is to find("*") That's the rough equivalence in jQuery. --John On 9/12/07, Glen Lipka <[EMAIL PROTECTED]> wrote: > I have been playing around with this. > http://www.commadot.com/jquery/selectorChildren.php > > It's interesting to me how text and html act differently in terms of > encoding and what actually shows up. > It's also interesting to see how text nodes and a div are treated. > > I am confused. Why aren't the grandchildren being included in the call for > children()? > Using $("#content *") gets all the grandkids. I thought parents() gets all > the grandparents. Is children different? > > Glen > > > On 9/12/07, Richard D. Worth <[EMAIL PROTECTED]> wrote: > > On 9/12/07, Stephan Beal <[EMAIL PROTECTED]> wrote: > > > > > > > > On Sep 12, 9:20 pm, "John Resig" <[EMAIL PROTECTED]> wrote: > > > > .html() only gets the innerHTML for the first matched element. > > > > > > i think that's what the OP is saying: the element's HTML he's getting > > > back is *not* that of the first child element: > > > > > > > > > > > > > > > > > > > > > ... > > > > > > > > > > > > > > > > > > > > > Now his children() call: > > > > > > > > alert($('#content').children().html()); > > > > > > should return a result starting with > > > > > > as John pointed out, html() returns innerHTML, not outer, so id="panelPreview"...> should only be expected if $('#content').html() were > called. > > Breaking down $('#content').children().html() : > > 1. $('#content') selects the outermost div which has an innerHTML of > > > > > > > > [Section/Panel Heading] > > > > > > > > > > 2. .children() selects all its children, in this case there's only 1 - > #panelPreview which has an innerHTML of > > > > > > [Section/Panel Heading] > > > > > > > > 3. .html() returns the innerHTML of the first element in the > selection/first child of #content. See step 2 > > > > Looks correct to me, though maybe not what's wanted. > > > > - Richard > > > > > >
[jQuery] Re: NEWBIE Question: children() skips first element?
I have been playing around with this. http://www.commadot.com/jquery/selectorChildren.php It's interesting to me how text and html act differently in terms of encoding and what actually shows up. It's also interesting to see how text nodes and a div are treated. I am confused. Why aren't the grandchildren being included in the call for children()? Using $("#content *") gets all the grandkids. I thought parents() gets all the grandparents. Is children different? Glen On 9/12/07, Richard D. Worth <[EMAIL PROTECTED]> wrote: > > On 9/12/07, Stephan Beal <[EMAIL PROTECTED]> wrote: > > > > > > On Sep 12, 9:20 pm, "John Resig" <[EMAIL PROTECTED]> wrote: > > > .html() only gets the innerHTML for the first matched element. > > > > i think that's what the OP is saying: the element's HTML he's getting > > back is *not* that of the first child element: > > > > > > > > > > > > > > > > > > ... > > > > > > > > > > > > > > > > Now his children() call: > > > > > > alert($('#content').children().html()); > > > > should return a result starting with > > > as John pointed out, html() returns innerHTML, not outer, so id="panelPreview"...> should only be expected if $('#content').html() were > called. > > Breaking down $('#content').children().html() : > 1. $('#content') selects the outermost div which has an innerHTML of > > > > [Section/Panel Heading] > > > > > 2. .children() selects all its children, in this case there's only 1 - > #panelPreview which has an innerHTML of > > > [Section/Panel Heading] > > > > 3. .html() returns the innerHTML of the first element in the > selection/first child of #content. See step 2 > > Looks correct to me, though maybe not what's wanted. > > - Richard > >
[jQuery] Re: NEWBIE Question: children() skips first element?
On Sep 12, 10:52 pm, "Richard D. Worth" <[EMAIL PROTECTED]> wrote: > as John pointed out, html() returns innerHTML, not outer, so id="panelPreview"...> should only be expected if $('#content').html() were > called. Doh, of course. /me smacks forehead.
[jQuery] Re: NEWBIE Question: children() skips first element?
On 9/12/07, Stephan Beal <[EMAIL PROTECTED]> wrote: > > > On Sep 12, 9:20 pm, "John Resig" <[EMAIL PROTECTED]> wrote: > > .html() only gets the innerHTML for the first matched element. > > i think that's what the OP is saying: the element's HTML he's getting > back is *not* that of the first child element: > > > > > > > > > > > ... > > > > > > > > > > > Now his children() call: > > > > alert($('#content').children().html()); > > should return a result starting with as John pointed out, html() returns innerHTML, not outer, so should only be expected if $('#content').html() were called. Breaking down $('#content').children().html() : 1. $('#content') selects the outermost div which has an innerHTML of [Section/Panel Heading] 2. .children() selects all its children, in this case there's only 1 - #panelPreview which has an innerHTML of [Section/Panel Heading] 3. .html() returns the innerHTML of the first element in the selection/first child of #content. See step 2 Looks correct to me, though maybe not what's wanted. - Richard
[jQuery] Re: NEWBIE Question: children() skips first element?
On Sep 12, 9:20 pm, "John Resig" <[EMAIL PROTECTED]> wrote: > .html() only gets the innerHTML for the first matched element. i think that's what the OP is saying: the element's HTML he's getting back is *not* that of the first child element: > > > > > > ... > > > > > > Now his children() call: > > alert($('#content').children().html()); should return a result starting with , but is instead starting with the HTML from the *next* inner-most DIV (in fact the first child of #panelPreview, not the first child of #content): > > The resulting html starts with ' > class="hPanel">' :?
[jQuery] Re: NEWBIE Question: children() skips first element?
.html() only gets the innerHTML for the first matched element. What are you trying to do with the children? --John On 9/12/07, Brook Davies <[EMAIL PROTECTED]> wrote: > > > Hello, > > I am trying to simply grab the children of a div. The markup is: > > > > > > [Section/Panel > Heading] > > > > > > But, what I don't understand is why when I call > > alert($('#content').children().html()); > > The resulting html starts with ' class="hPanel">' > > It seems like it is missing the first div after #content? What am I > missing?? > > Brook > > > >
[jQuery] Re: Newbie Question: Javascript Never Gets Called?
I am not sure, but maybe you could try to make those urls relative, maybe that will do. let's say your page is located at 'http://localhost:/.html', then call the scripts like this: also, I don't know if that's how it is in your page, but don't leave whitespaces in the src. On 11 sep, 03:08, Vik <[EMAIL PROTECTED]> wrote: > I'm a Javascript newbie, but I do have some Javascript working, and I > have the jQuery demo working. > > Here's the code I have on one of my html pages to load javascript: > > - > http://localhost:/js/jquery.js"; type="text/ > javascript"> > http://localhost:/js/ > jquery.selectCombo1.2.1.js"> > http://localhost:/js/ > your_foundry.js"> > - > > Here's the _entire_ contents of the "your_foundry.js" file: > > - > $(function(){ > $('#foundry_popup').selectCombo('get_units.lasso?setval=true', > '#units_for_alloy_id_no_');}); > > - > > And here's the popup, from the html: > > - > > No Item Selected > Iron > Brass > Steel > > - > > The anomaly is that, I can set breakpoints on the javascript in the > your_foundry.js file, and, according to Firebug, the code in that file > is never called, even when I select an item from the popup. > > What am I missing? > > Thanks very much in advance to all for any info..
[jQuery] Re: Newbie Question: Javascript Never Gets Called?
Can you possibly post this online? Would make it easier to debug. Glen On 9/10/07, Vik <[EMAIL PROTECTED]> wrote: > > > I'm a Javascript newbie, but I do have some Javascript working, and I > have the jQuery demo working. > > Here's the code I have on one of my html pages to load javascript: > > - > http://localhost:/js/jquery.js"; type="text/ > javascript"> > http://localhost:/js/ > jquery.selectCombo1.2.1.js"> > http://localhost:/js/ > your_foundry.js"> > - > > Here's the _entire_ contents of the "your_foundry.js" file: > > - > $(function(){ > $('#foundry_popup').selectCombo('get_units.lasso?setval=true', > '#units_for_alloy_id_no_'); > }); > - > > And here's the popup, from the html: > > - > > No Item Selected > Iron > Brass > Steel > > - > > The anomaly is that, I can set breakpoints on the javascript in the > your_foundry.js file, and, according to Firebug, the code in that file > is never called, even when I select an item from the popup. > > What am I missing? > > Thanks very much in advance to all for any info.. > >
[jQuery] Re: Newbie question about click()
I believe you can use $("p").toggle("slow"); and it will achieve the result you are after, no need for 2 seperate functions. On 6/15/07, Giovanni Battista Lenoci <[EMAIL PROTECTED]> wrote: Hi, I'm a newbie in jquery please be patient :-) I'm playin with jquery mixing some tutorials. I'm trying to open a with some text within with the animation control, and a link. Then when I opened the I want to change the behaviour of the link. When I click on the link I do the animation, and then call the changebutton function that would be change the link in something that can close the opened I've noticed that the function passed in the click event seems to be appended instead of replaced. I can't find in the docs where this beahviour is explained. Please apologize me for my bad english. Here some code: function changebutton() { $("#switch").click(function() { alert('what I\'m doing?'); /* $("p").animate({ height: 'toggle', opacity: 'toggle' }, "slow", changebutton);*/ }); } $(document).ready(function() { $("#switch").click(function() { $("p").animate({ height: 'show', opacity: 'show' }, "slow", changebutton); }); }); p { border:1px solid red; width:300px; display:none; } Open Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat. Duis autem vel eum iriure dolor in hendrerit in vulputate velit esse molestie consequat, vel illum dolore eu feugiat nulla facilisis at vero eros et accumsan et iusto odio dignissim qui blandit praesent luptatum zzril delenit augue duis dolore te feugait nulla facilisi. Nam liber tempor cum soluta nobis eleifend option congue nihil imperdiet doming id quod mazim placerat facer possim assum. Typi non habent claritatem insitam; est usus legentis in iis qui facit eorum claritatem. Investigationes demonstraverunt lectores legere me lius quod ii legunt saepius. Claritas est etiam processus dynamicus, qui sequitur mutationem consuetudium lectorum. Mirum est notare quam littera gothica, quam nunc putamus parum claram, anteposuerit litterarum formas humanitatis per seacula quarta decima et quinta decima. Eodem modo typi, qui nunc nobis videntur parum clari, fiant sollemnes in futurum.
[jQuery] Re: newbie question: keypress vs keydown
Thanks for help Richard What bugs me is that keydown should be fired once. I wonder if it works for you guys that way. I am using the flag. The flag will be assigned x times during the keydown, which "works" however... var SHIFTKEY_FLAG=false; $(document).keydown( function(e){ if(e.shiftKey){ SHIFTKEY_FLAG=true; console.log(SHIFTKEY_FLAG);} }); $(document).keyup( function(e){ if(e.shiftKey){ SHIFTKEY_FLAG=false; console.log(SHIFTKEY_FLAG);} }); Testing Peter's keydown event at http://www.quirksmode.org/js/keys.html results in multiple firing when the key is pressed down across common browsers. It is confusing, then there is no difference between keydown and keypress. Jan On Jun 8, 12:18 pm, "Richard D. Worth" <[EMAIL PROTECTED]> wrote: > On 6/8/07, kotouc <[EMAIL PROTECTED]> wrote: > > > > > > > Hi, > > my problem is that this code returns: > > > keydown > > keypress > > keydown > > keypress > > keydown > > keypress > > keydown > > keypress > > keyup > > > jQuery 1.1.2 and FF1.5 > > > Further running: > > $('textarea').keydown(function(e){console.log(e);}); > > > When I press and hold the key down it keeps firing the keydown! > > > Jan > > That's an interesting finding. If you're on interested in the first keydown, > you could set a flag on keydown and clear it on keyup and ignore the other > repeated keydowns if that flag is set. > > - Richard
[jQuery] Re: newbie question: keypress vs keydown
On 6/8/07, kotouc <[EMAIL PROTECTED]> wrote: Hi, my problem is that this code returns: keydown keypress keydown keypress keydown keypress keydown keypress keyup jQuery 1.1.2 and FF1.5 Further running: $('textarea').keydown(function(e){console.log(e);}); When I press and hold the key down it keeps firing the keydown! Jan That's an interesting finding. If you're on interested in the first keydown, you could set a flag on keydown and clear it on keyup and ignore the other repeated keydowns if that flag is set. - Richard