[jQuery] clone() help
Hi, I'm new to jquery and went over quite a few tutorials -- some work great for me, with no problems at all. But I'm having trouble with the .clone() method. I am trying to build an order form, and have a button#add, which when clicked I want it to add another div.product-template (that includes a select list, options, quantity and add to cart button). So, my code says: http://pastie.caboo.se/189769 but... when I click on the button#add, once nothing happens, second time it adds the .product-template but any functions I had attached to the select list don't work. third click gets rid of my second .product- template. In my document I have: snip ... div#orderform form button#add fieldset#step1 div.product-template rest of options come here fieldset#step2 snip ... Would anyone know how to correct this? TIA, Elle
[jQuery] clueTip plugin: Passing values via AJAX to the clueTip, then passing values back to the parent page to update div content
Hi there,
First up a big thanks to Karl for writing a great jQuery plugin. And
sorry if this is a bit of a newbie issue. My question is related to
AJAX content. I have a page that has a variety of links, that look
like the following:
a class=jTip title=TITLE href=this.php?
construction=1155492714online=1160506275installation=1161683112
rel=this.php?
construction=1155492714online=1160506275installation=1161683112
This is just a series of key-value pairs that list the type of action
and the epoch time that action took place.
There is a div on this page that I want to insert content into, lets
call it 'mydynamiccontent':
div id=mydynamiccontent
pThis content will get replaced/p
/div
My clueTip call looks like:
$(document).ready(function() {
$('a.jTip').cluetip({
cluetipClass: 'jtip',
arrows: true,
hoverIntent: false,
mouseOutClose: true,
sticky: true,
activation: 'click',
closeText: 'X',
closePosition: 'title',
ajaxCache: true
});
)};
When the user clicks on the link, the clueTip window pops up and show
the content that looks like (using the example above, the source of
'this.php' with the GET parameters passed):
this.php
!DOCTYPE html PUBLIC -//W3C//DTD XHTML 1.0 Transitional//EN http://
www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd
html xmlns=http://www.w3.org/1999/xhtml; xml:lang=en lang=en
head
meta http-equiv=Content-Type content=text/html; charset=utf-8/
/head
body
ul class=reportlist
li class=constructionconstruction: a href=#1155492714/
a/li
li class=onlineonline: a href=#1160506275/a/li
li class=installationinstallation: a href=#1161683112/a/
li
/ul
/body
/html
Great. This works as expected. What I now want is for those links in
the unordered list in the clueTip window to have an onClick event that
updates the contents of the 'mydynamiccontent' div on the initial
page. So my question is, do I define that in a clueTip ajax call? Or
do I define it in some jQuery code in 'this.php'? If the latter, how
can I ensure I load the content back into the correct div on the main
page?
Thanks in advance!
[jQuery] cycle addSlideFn, timing using only a single slide as default
I have been working with the addSlideFn. I love the idea, but I am having some problems implementing it. I have some ideas for improving it, but first here is what I ran into: I got addSlideFn to work in a somewhat simple case. Then I was having problems though when I tried to set a delay. The newly loaded slides would interrupt the ongoing slideshow. I also used a nowrap option, and depending on the timing the slideshow would end before the new slides were added and loaded to the DOM. Since load times over the internet vary, I don't know how robust that is. I tried to decouple the addSlideFn from the slideshow (not using onBefore) so that I cold load all of the new slides before starting the slideshow (using a delay), but I couldn't (addSlideFn not a function..). Also, I tried to just use only one slide in the html, and add all of the others through javascript. I got an error saying I only had one slide in my slideshow. One way to hide all other slides if javascript is disabled or during loading is to make sure overflow:hidden; is set in the parent container. Here is what I think is the ideal way to load a complex, progressively enhanced slideshow (please pitch in other ideas!) - only one silde element in the html - create a setTimeout function that would wait until the DOM and page elements are loaded. Could be just a simple timer or it could check to see if all of the page elements are loaded. Once loaded or timer finishes, slide markup is added to the DOM and the media is loaded - when the slides added to the DOM and loaded, trigger the slideshow I like this solution because: 1. It allows you to present content after the clunky page loading process happens (if you have a heavy page) 2. It could potentially speed up perceived page load because it is loading heavy images in the background after all other page elements are loaded 3. It would be a simple configuration (for us, maybe not Mike or whoever is doing the coding!) 4. It follows progressive enhancement - if no javascript, then only one slide loads 5. Could potentially allow all of the javascript (jQuery, plugin, and configuration) at the bottom of the page, which could also speed up perceived load times. (I have been reading a lot about the speed optimization work Yahoo is doing and using the yslow tool). This might even be possible with the current implementation of cycle but I don't know how to do it. Any ideas? thanks
[jQuery] Re: listen plugin along with cluetip plugin
Hi Ariel, Hi Karl,
guess what it seems to work, like this:
$(table.sortable).listen('mouseover', 'td', function(){
$('a.clueTip', $(this)).cluetip({
sticky: true,
width: 800,
hoverIntent: {
sensitivity: 3,
interval: 300,
timeout: 0
}
});
});
On Wed, Apr 30, 2008 at 10:48 PM, Karl Swedberg [EMAIL PROTECTED]
wrote:
Hi Alexandre,
I'm afraid that the cluetip plugin doesn't support event delegation. I
just didn't have it in mind when I built it. Sorry. :(
--Karl
_
Karl Swedberg
www.englishrules.com
www.learningjquery.com
On Apr 30, 2008, at 11:30 AM, Alexandre Plennevaux wrote:
hello!
i have a table displaying 3000 rows and would like to use the cluetip to
display some info about each contact via ajax.
of course, 3000 mouseover event binding is not reasonable so i think my
problem qualifies for the use case addressed by the listen plugin.
but i don't know how to connect the two plugins, since cluetip hides the
event handling behind its function.
here is the code i thought would work:
$(document).ready(function(){
$(table.sortable).tablesorter().listen('hover', 'a.clueTip',
function(){
$(this).cluetip({
sticky: true,
width: 800
});
});
});
any help would be much appreciated !
thanks,
Alexandre
--
Alexandre Plennevaux
LAb[au]
http://www.lab-au.com
[jQuery] click(function(select)
Hi again,
I have a form with products select menu. I would like to show and hide
product specific options as the user selects them. Now, I can show the
product options but I don't know how to hide them if the user selects
a different product.
My HTML is:
snip...
select id=product-type name=product-type class=product-type
option value=select
selected=selected-Select-/option
option value=product a class=productaProduct
A/option
option value=product b class=productbProduct
B/option
/select/p
fieldset class=producta options ... /fieldset
fieldset class=productb options ... /fieldset
snip
My code at the moment is:
$('#orderform').find('.options').hide();
$('.product-type').find('option.producta').click(function(select) {
$('fieldset.producta').slideDown(slow);
});
$('.product-type').find('option.productb').click(function(select) {
$('fieldset.productb').slideDown(slow);
});
So, if I change the user changes his/her mind between product a to
product b, the options stay visible, and I'm not sure how to hide them
again.
Also, if the user already entered information in the fieldset's
fields, should I reset them when I hide them?
Any advice will be great.
Thanks,
Elle
[jQuery] click(function(select) help
Hi again,
I have a form with products select menu. I would like to show and hide
product specific options as the user selects them. Now, I can show the
product options but I don't know how to hide them if the user selects
a different product.
My HTML is:
snip...
select id=product-type name=product-type class=product-type
option value=select
selected=selected-Select-/option
option value=product a class=productaProduct
A/option
option value=product b class=productbProduct
B/option
/select/p
fieldset class=producta options ... /fieldset
fieldset class=productb options ... /fieldset
snip
My code at the moment is:
$('#orderform').find('.options').hide();
$('.product-type').find('option.producta').click(function(select) {
$('fieldset.producta').slideDown(slow);
});
$('.product-type').find('option.productb').click(function(select) {
$('fieldset.productb').slideDown(slow);
});
So, if I change the user changes his/her mind between product a to
product b, the options stay visible, and I'm not sure how to hide them
again.
Also, if the user already entered information in the fieldset's
fields, should I reset them when I hide them?
Any advice will be great.
Thanks,
Elle
[jQuery] click(function(select) help
Hi again,
I have a form with products select menu. I would like to show and hide
product specific options as the user selects them. Now, I can show the
product options but I don't know how to hide them if the user selects
a different product.
My HTML is:
snip...
select id=product-type name=product-type class=product-type
option value=select
selected=selected-Select-/option
option value=product a class=productaProduct
A/option
option value=product b class=productbProduct
B/option
/select/p
fieldset class=producta options ... /fieldset
fieldset class=productb options ... /fieldset
snip
My code at the moment is:
$('#orderform').find('.options').hide();
$('.product-type').find('option.producta').click(function(select) {
$('fieldset.producta').slideDown(slow);
});
$('.product-type').find('option.productb').click(function(select) {
$('fieldset.productb').slideDown(slow);
});
So, if I change the user changes his/her mind between product a to
product b, the options stay visible, and I'm not sure how to hide them
again.
Also, if the user already entered information in the fieldset's
fields, should I reset them when I hide them?
Any advice will be great.
Thanks,
Elle
[jQuery] click(function(select) help
Hi again,
I have a form with products select menu. I would like to show and hide
product specific options as the user selects them. Now, I can show the
product options but I don't know how to hide them if the user selects
a different product.
My HTML is:
snip...
select id=product-type name=product-type class=product-type
option value=select
selected=selected-Select-/option
option value=product a class=productaProduct
A/option
option value=product b class=productbProduct
B/option
/select/p
fieldset class=producta options ... /fieldset
fieldset class=productb options ... /fieldset
snip
My code at the moment is:
$('#orderform').find('.options').hide();
$('.product-type').find('option.producta').click(function(select) {
$('fieldset.producta').slideDown(slow);
});
$('.product-type').find('option.productb').click(function(select) {
$('fieldset.productb').slideDown(slow);
});
So, if I change the user changes his/her mind between product a to
product b, the options stay visible, and I'm not sure how to hide them
again.
Also, if the user already entered information in the fieldset's
fields, should I reset them when I hide them?
Any advice will be great.
Thanks,
Elle
[jQuery] Re: Hide/Close div when clicked outside of it.
I still have the same issue.
Yes, I have wrapper div how it can be solved in this case?
Thanks
On Apr 30, 7:05 pm, Wes Duff [EMAIL PROTECTED] wrote:
Off the top of my head --- Try something like this
$('div#mydiv').clcik(function(){$('div#mydiv').show();}); //click to
show div
$('div:not(#mydiv)').click(function(){$('div#mydiv').hide()}); click
anywhere else to hide div ## Problem just thought of If you are using
a wrapper div then you will have the same problem as before. Well you
get the idea.
This is just off the top of my head but if it donst work you get the
idea.
On Apr 30, 11:17 am, Aleksandr [EMAIL PROTECTED] wrote:
Hi All,
I am showing a div on click of a hyperlink. Now, when i click
elsewhere in
the document other than the div itself, then i want to hide the
showing
div... Is there any easy way to do this?
I've already try:
$('html').click(function() { $('#divLoginBox1').hide(); });
and
$('body').click(function() { $('#divLoginBox1').hide(); });
but this close div when clicked inside of it.
Thanks,
Alex
[jQuery] Re: jQuery and JSON - newbie!
Okay I tried to do what you said.
This is my JSON file:
http://pastebin.com/m616d0550
and this is my js file:
$(document).ready(function() {
$.getJSON('featsCalculator/priestofmitra.js', function(data) {
$('.featButton').hover(function() {
if(data.items.jsname == $(this).attr('id')) {
alert(data.items.jsname);
}
});
});
});
Nothing happens when I hover a .featButton. What's wrong?
[jQuery] Re: Autocomplete: display errors
Could you post a testpage? Jörn On Thu, May 1, 2008 at 4:36 AM, dineshv [EMAIL PROTECTED] wrote: My autocomplete is getting data from a server (using a localhost). I've checked and the data is getting to the browser. But, the items do not display and I'm continually getting the following set of errors: localhost - - [30/Apr/2008 19:29:04] GET / HTTP/1.1 200 - localhost - - [30/Apr/2008 19:29:04] GET /static/css/ac.css HTTP/1.1 200 - localhost - - [30/Apr/2008 19:29:10] GET /ac? q=chaselimit=25timestamp=1209608950312 HTTP/1.1 200 - localhost - - [30/Apr/2008 19:29:15] GET /static/js/jquery- autocomplete/lib/jquery.js?_=1209608955375 HTTP/1.1 200 - localhost - - [30/Apr/2008 19:29:15] GET /static/js/jquery- autocomplete/lib/jquery.dimensions.js?_=1209608955390 HTTP/1.1 200 - localhost - - [30/Apr/2008 19:29:15] GET /static/js/jquery- autocomplete/lib/jquery.bgiframe.min.js?_=1209608955390 HTTP/1.1 200 - localhost - - [30/Apr/2008 19:29:17] GET /static/js/jquery- autocomplete/lib/jquery.ajaxQueue.js?_=1209608955406 HTTP/1.1 200 - localhost - - [30/Apr/2008 19:29:18] GET /static/js/jquery- autocomplete/jquery.autocomplete.js?_=1209608955421 HTTP/1.1 200 - localhost - - [30/Apr/2008 19:29:18] GET /static/js/movie.js? _=1209608955437 HTTP/1.1 200 - Any ideas? Dinesh
[jQuery] Jquery AJAX form submission
Hello,
I am currently using Jquery's post method to submit a form. And I use the
responseText to update certain other DIV in the page. Since I am migrating
the All-No-AJAX pages to AJAX pages, I am forced import the entire HTML (not
data alone) with Javascript into the existing DOM. Unfortunately
$(document).ready(function(){}) doesnt get executed upon successfully
receiving AJAX response. I guess this is the normal behaviour. But I would
want that Javascript to be executed. The form plugin doesnt come to rescue
since it doesnt support HTML type. Kindly advice on the right strategy to
use.
Work Around : To make it work, I have removed the $(document).ready() hook,
and am calling the Javascript init() methods at the end of the page. I
certainly know that this is not the correct approach.
*$(form).submit(function(){
if(!$(#eFrm).valid())
{
return false;
}
var pData = $(#eFrm).serialize();
$(div.mainContent).html(Loading);
$.post(
'./search.html?ajax=true',pData,function(data){$(div.mainContent).html(data);},html);
return false;
});
*
--
Thanks
Ram
[jQuery] Re: listen plugin along with cluetip plugin
hey, that's great news! Thanks for working on it, even after my
pessimistic reply. :-)
--Karl
_
Karl Swedberg
www.englishrules.com
www.learningjquery.com
On May 1, 2008, at 4:07 AM, Alexandre Plennevaux wrote:
Hi Ariel, Hi Karl,
guess what it seems to work, like this:
$(table.sortable).listen('mouseover', 'td', function(){
$('a.clueTip', $(this)).cluetip({
sticky: true,
width: 800,
hoverIntent: {
sensitivity: 3,
interval: 300,
timeout: 0
}
});
});
On Wed, Apr 30, 2008 at 10:48 PM, Karl Swedberg
[EMAIL PROTECTED] wrote:
Hi Alexandre,
I'm afraid that the cluetip plugin doesn't support event delegation.
I just didn't have it in mind when I built it. Sorry. :(
--Karl
_
Karl Swedberg
www.englishrules.com
www.learningjquery.com
On Apr 30, 2008, at 11:30 AM, Alexandre Plennevaux wrote:
hello!
i have a table displaying 3000 rows and would like to use the
cluetip to display some info about each contact via ajax.
of course, 3000 mouseover event binding is not reasonable so i
think my problem qualifies for the use case addressed by the
listen plugin.
but i don't know how to connect the two plugins, since cluetip hides
the event handling behind its function.
here is the code i thought would work:
$(document).ready(function(){
$(table.sortable).tablesorter().listen('hover', 'a.clueTip',
function(){
$(this).cluetip({
sticky: true,
width: 800
});
});
});
any help would be much appreciated !
thanks,
Alexandre
--
Alexandre Plennevaux
LAb[au]
http://www.lab-au.com
[jQuery] Re: Jquery AJAX form submission
Have a look at the Taconite plug-in for updating objects after from is
submitted.
Look at LiveQuery plug-in for binding objects returned via your ajax
results.
I use these and it works awesome.
On May 1, 7:30 am, Ramanathan RV [EMAIL PROTECTED] wrote:
Hello,
I am currently using Jquery's post method to submit a form. And I use the
responseText to update certain other DIV in the page. Since I am migrating
the All-No-AJAX pages to AJAX pages, I am forced import the entire HTML (not
data alone) with Javascript into the existing DOM. Unfortunately
$(document).ready(function(){}) doesnt get executed upon successfully
receiving AJAX response. I guess this is the normal behaviour. But I would
want that Javascript to be executed. The form plugin doesnt come to rescue
since it doesnt support HTML type. Kindly advice on the right strategy to
use.
Work Around : To make it work, I have removed the $(document).ready() hook,
and am calling the Javascript init() methods at the end of the page. I
certainly know that this is not the correct approach.
* $(form).submit(function(){
if(!$(#eFrm).valid())
{
return false;
}
var pData = $(#eFrm).serialize();
$(div.mainContent).html(Loading);
$.post(
'./search.html?ajax=true',pData,function(data){$(div.mainContent).html(da
ta);},html);
return false;
});
*
--
Thanks
Ram
[jQuery] Re: clone() help
Hi Elle,
Here are a few thoughts.
Your code:
$(#add).click(function() {
$(.product-template).clone().appendTo(.product-template:last-
child);
});
- Do you have this inside a document.ready?
$(document).ready(function() {
$(#add).click(function() {
$(.product-template).clone().appendTo(.product-template:last-
child);
});
});
- To clone the events along with the DOM elements you can
do .clone(true) instead of .clone()
- The problem with the click not working could have to do with the
:last-child part. I'd change it to :last and also change the
insertion method from .appendTo() to .insertAfter()
- Probably a good idea to only clone the first .product-template each
time.
Try something like this:
$(document).ready(function() {
$(#add).click(function() {
$(div.product-template:first).clone(true).insertAfter(div.product-
template:last);
});
});
Hope that points you in the right direction.
--Karl
_
Karl Swedberg
www.englishrules.com
www.learningjquery.com
On May 1, 2008, at 1:53 AM, Waz and Elle wrote:
Hi,
I'm new to jquery and went over quite a few tutorials -- some work
great for me, with no problems at all. But I'm having trouble with
the .clone() method.
I am trying to build an order form, and have a button#add, which when
clicked I want it to add another div.product-template (that includes a
select list, options, quantity and add to cart button).
So, my code says:
http://pastie.caboo.se/189769
but... when I click on the button#add, once nothing happens, second
time it adds the .product-template but any functions I had attached to
the select list don't work. third click gets rid of my
second .product-
template.
In my document I have:
snip ...
div#orderform
form
button#add
fieldset#step1
div.product-template
rest of options come here
fieldset#step2
snip ...
Would anyone know how to correct this?
TIA,
Elle
[jQuery] Re: click(function(select) help
$('#orderform').find('.options').hide();
$('.product-type').find('option.producta').click(function(select) {
$('fieldset.producta').slideDown(slow);
});
$('.product-type').find('option.productb').click(function(select) {
$('fieldset.productb').slideDown(slow);
});
Maybe something like this?
$('.product-type').bind(change, function() {
var $newfields = $(#orderform fieldset.+
(this.className||'none'));
var $oldfields = $('#orderform fieldset:visible');
if ( $oldfields.length )
$oldfields.slideUp(slow, function() {
$newfields.slideDown(slow);
});
else
$newfields.slideDown(slow);
});
[jQuery] Re: Autocomplete: display errors
-Original Message- From: dineshv [mailto:[EMAIL PROTECTED] Sent: Wednesday, April 30, 2008 10:36 PM To: jQuery (English) Subject: [jQuery] Autocomplete: display errors My autocomplete is getting data from a server (using a localhost). I've checked and the data is getting to the browser. But, the items do not display and I'm continually getting the following set of errors: I find Firefox with Firebug installed to be really helpful debugging these kind of odd errors - you can watch what's going on 'behind the scenes' and see what is being returned during the autocomplete. Jim
[jQuery] JCarousel, broken in IE
Hey, can anybody please indentify the problem with this? http://webhero.co.uk/portfolio The page works fine in FireFox (of course), but the JQuery JCarousel plug-in fails in Internet Explorer 6/7. Thanks for your help! -- View this message in context: http://www.nabble.com/JCarousel%2C-broken-in-IE-tp16993230s27240p16993230.html Sent from the jQuery General Discussion mailing list archive at Nabble.com.
[jQuery] Re: click(function(select) help
Instead of adding click listeners to the option elements, add a change
listener to the overall select menu. Once the change event is fired,
determine which value is choosen, then show/hide the appropriate
option fieldset. NOTE: You may want to change the values of the option
elements so that they don't contain spaces. I'm not sure if those
spaces will cause problems or not.
$(document).ready(function(){
$(#product-type).change(function(){
if($(this).val() == product a){
$('fieldset.producta').slideDown(slow);
$('fieldset.productb').slideUp(slow);
}
else {
$('fieldset.productb').slideDown(slow);
$('fieldset.producta').slideUp(slow);
}
});
});
The above code is untested, but that is the basic idea of what you
would need to do.
On May 1, 4:57 am, Waz and Elle [EMAIL PROTECTED] wrote:
Hi again,
I have a form with products select menu. I would like to show and hide
product specific options as the user selects them. Now, I can show the
product options but I don't know how to hide them if the user selects
a different product.
My HTML is:
snip...
select id=product-type name=product-type class=product-type
option value=select
selected=selected-Select-/option
option value=product a class=productaProduct
A/option
option value=product b class=productbProduct
B/option
/select/p
fieldset class=producta options ... /fieldset
fieldset class=productb options ... /fieldset
snip
My code at the moment is:
$('#orderform').find('.options').hide();
$('.product-type').find('option.producta').click(function(select) {
$('fieldset.producta').slideDown(slow);
});
$('.product-type').find('option.productb').click(function(select) {
$('fieldset.productb').slideDown(slow);
});
So, if I change the user changes his/her mind between product a to
product b, the options stay visible, and I'm not sure how to hide them
again.
Also, if the user already entered information in the fieldset's
fields, should I reset them when I hide them?
Any advice will be great.
Thanks,
Elle
[jQuery] Re: ui selectable
Make sure you're calling .selectable() on the container element, not the child element(s). In your example, that should be $(#iconScroller).selectable(); Also, in case you're not aware, there's a dedicated jQuery UI mailing list: http://groups.google.com/group/jquery-ui/ - Richard On Wed, Apr 30, 2008 at 3:40 PM, Sam Sherlock [EMAIL PROTECTED] wrote: sorted the first issue (I need to change some css) and found the answer to the second question to be yes however I don't see multiple selectees being dragged any how, I have enough to be making head way on - S 2008/4/30 Sam Sherlock [EMAIL PROTECTED]: Hi All, I am making a AJax File Manager using jQuery and a bunch of plugins within the interface I am having some trouble with selectable here is my code (from within a document ready block) $(#iconScroller div.folder, #iconScroller div.file).selectable(); here is my mark up div id=iconScroller div class=folder ptest/p /div div class=folder ptest2/p /div div class=folder ptest3/p/div div class=folder ptest4/p/div /div can you make selectable divs? 2nd question is it possible to combine selectable draggable? thx - S
[jQuery] Re: Hide/Close div when clicked outside of it.
Let me see if I have this clear. Once I do I will write you up a
script.
When someone clicks a link a href=#Show Login Box/a you want
to display a div that shows the login box.
When someone clicks somewhere else on the screen and not on the link
you want to hide the login box?
On May 1, 5:08 am, Aleksandr [EMAIL PROTECTED] wrote:
I still have the same issue.
Yes, I have wrapper div how it can be solved in this case?
Thanks
On Apr 30, 7:05 pm, Wes Duff [EMAIL PROTECTED] wrote:
Off the top of my head --- Try something like this
$('div#mydiv').clcik(function(){$('div#mydiv').show();}); //click to
show div
$('div:not(#mydiv)').click(function(){$('div#mydiv').hide()}); click
anywhere else to hide div ## Problem just thought of If you are using
a wrapper div then you will have the same problem as before. Well you
get the idea.
This is just off the top of my head but if it donst work you get the
idea.
On Apr 30, 11:17 am, Aleksandr [EMAIL PROTECTED] wrote:
Hi All,
I am showing a div on click of a hyperlink. Now, when i click
elsewhere in
the document other than the div itself, then i want to hide the
showing
div... Is there any easy way to do this?
I've already try:
$('html').click(function() { $('#divLoginBox1').hide(); });
and
$('body').click(function() { $('#divLoginBox1').hide(); });
but this close div when clicked inside of it.
Thanks,
Alex
[jQuery] UI Sortables conflict?
Hi, I've been tasked with adding some components to an existing, large site that is using jQuery 1.2.2 and jQuery UI 1.0 and jQuery dimensions, amongst other things. When testing locally using the latest versions of jQuery and ui, everything worked fine, but when I uploaded it to the test server everything but sortables worked. The .sortable() call would cause this error in Firefox: uncaught exception: [Exception... Could not convert JavaScript argument nsresult: 0x80570009 (NS_ERROR_XPC_BAD_CONVERT_JS) location: JS frame :: http://patrick.zellers.com/wcsstore/MasterStorefront/javascript/lib/jquery-1.2.2.js :: anonymous :: line 853 data: no] I managed to narrow it down to the dimensions plug-in. If I removed it everything (semi)worked, unfortunately this is not an option -- the site's been through QA and I am not allowed to change the library. Anyone know of any solutions or workarounds? Other than using draggables to recreate the functionality as best as I can, which would be difficult and tedious.
[jQuery] Re: accessing the content of iframe
You can use it using the function contents() . For example if you want
to hide an element inside an iframe:
$('#iframeID').contents().find('#innerElementID').hide();
Piyush
---
http://piyush.goel.googlepage.com/
On Apr 29, 8:38 am, Teonator [EMAIL PROTECTED] wrote:
Hi,
Let say I have page A with an iframe (# ifrmContent) where its src is
page B. The page B have a checkbox (# chkAgree). How am I going to
access the checkbox in page B using the selector from page A (parent)?
Could someone guide me a bit?
Cheers,
Teon
[jQuery] didactic question: collapsing div's
Hi everybody, could you help please with the right js-code (jquery is welcome) code here: http://screenlabor.de/ronny/test2.html I have 3 divs with id's like: food, stills, interieur. Each div is representing a category and contains some thumbnails and a bigger picture. Only one div/category is visible at the same time, the others are hidden with display:none. I want to set up a simple function that allows me toggle only one div at the same time, the others should stay hidden (--swapping): div id=food class=gallery style=display:block;content/div div id=stills class=gallery style=display:none;content/div div id=interieur class=gallery style=display:none;content/ div the logic for jquery should be sth like this, right? a) find all divs with class 'gallery' b) find out if it is set hidden or visible c) if it is visible do nothing d) if it is hidden, set this div visible, set others hidden What would be the apropiate jqiery code? Can you lead me to the proper jquery code in IRC #jouery step by step? Thanks and sincere Dennis About: - Im a beginner for javascript but advanced for xhtml/css and want to ask some questions which will have some didactic character. (My aim is to learn, not to get things/examples done by the community :0)
[jQuery] Re: treeview - async - problems reinitializing tree
sorry, didn't realize how badly the formatting was! Let me try again.
We ran into a problem when trying to set up a refresh button on
an async treeview implementation. Our tree contents will be changing
all the
time. Basically, we need to know how to blow away the contents of the
UL and
then re-insert them. What's happening is that on each click of the
refresh
we're getting an additional set of hitarea divs.
For the refresh button click, currently we're using
$('#openExistingTree').empty();
then to re-initialize:
$('#openExistingTree').treeview({ url: CalcBldrOpenExisting.ashx });
after the initial load, the markup looks fine. After clicking
'refresh' once, it looks like this (note duplicate divs):
ul class=treeList treeview id=openExistingTree
li class=expandable id=3
div class=hitarea hasChildren-hitarea expandable-hitarea/
div
div class=hitarea hasChildren-hitarea expandable-hitarea/
div
span/span
ul/ul
/li
li class=expandable id=4
div class=hitarea hasChildren-hitarea expandable-hitarea/
div
div class=hitarea hasChildren-hitarea expandable-hitarea/
div
span/span
ul/ul
/li
li class=hasChildren expandable lastExpandable id=5
div class=hitarea hasChildren-hitarea expandable-hitarea
lastExpandable-hitarea/div
div class=hitarea hasChildren-hitarea expandable-hitarea/
div
span/span
ul/ul
/li
/ul
Additional notes from our developer:
The initial json returned is:
[{'text': 'Private Drafts','id': 3, 'hasChildren': true},{'text':
'Shared Drafts','id': 4, 'hasChildren': true},{'text': 'Published
Calculations','id': 5, 'hasChildren': true}]
Then, when the user clicks on ‘Private Drafts’, I return the
following:
[{ 'text': 'a class=\openExisting\ title=\Matthews test calc\
href=\javascript:void(0);\ elemName=\Matthews test calc\ onclick=
\Apx.CalcBuilder.openCalc(this, 1);\Matthews test calc/a br/
span class=\resolution\Hour, Location, Participant/span'}]
After clearing the tree list, I reinitialize and the returned json is
IDENTICAL to that shown above, but the treeview jquery code does not
interpret it the same way.
--
Any help would be appreciated!
Rolf
[jQuery] Very Challenging (Drop-Drag) Text Resize Scroller
Hello everyone, I am in the process of creating a Text Resize Scroller for my employer. I have the skin created which consists of a background image that looks like a stretched out Less than symbol “” with a vertical rectangular handle to scroll left and right to make the text grow Or shrink. Here is what I had in mind. First set variables Var 1. current text size Var 2 . how much to increment the text size when dragged to the next area of the scroller Var 3. scroller snap in areas (so we know how much to scroll by when the user drags the mouse) Set a function to do drop and drag Set snap in areas of incrementing and de incrementing the handle of the scroller Depending on where the handle came from should tell the function to either grow the text or shrink the text If that isn’t tricky enough, when the user has selected the text size they want they click the save button. The save button then needs to dynamically change the css media=”print” so when the user prints the webpage The user will see the larger print they chose on the webpage. To dynamically change the css for the media=”print” I was thinking of just doing a style type=”css/text” at the Top and use JQuery to access these attributes and change the text size. Any help on getting the idea down will be great. I know many of us are up for a great challenge and when this Script is done and in working order I will post the final script and images so everyone can use it. Thanks
[jQuery] Re: Jquery spell checker
Any leads on this? This is a common request of IE6 users. I would like to have an elegant solution using jQuery. On Apr 4, 8:53 am, rsmolkin [EMAIL PROTECTED] wrote: Has anyone seen aspellcheckerfor text areas written in Jquery? I'm looking for one that is either stand-alone or can be used via AJAX connecting to ColdFusion. I would like to add aspellcheckerto all text areas that will work like Gmail. Thanks, -Roman
[jQuery] Re: treeview - async - problems reinitializing tree
I had to handle this situation over a week ago.
I just wrote a couple lines to remove all tree attributes from the generated
source and then rebuilt the tree.
$('.sample ul:eq(0)').removeClass('treeview');
$('.sample li').removeClass();
$('.sample ul div').remove();
$('.sample ul').removeAttr('style');
$('.sample ul').tree();
See my working sample here.
http://www.2whoa.com/apps/demo/apex-admin/hierarchy.html
Works great on IE6 and FF. Haven't tested it on a Mac yet.
I hope that helps.
rolfsf [EMAIL PROTECTED] wrote:
sorry, didn't realize how badly the formatting was! Let me try again.
We ran into a problem when trying to set up a refresh button on
an async treeview implementation. Our tree contents will be changing
all the
time. Basically, we need to know how to blow away the contents of the
UL and
then re-insert them. What's happening is that on each click of the
refresh
we're getting an additional set of hitarea divs.
For the refresh button click, currently we're using
$('#openExistingTree').empty();
then to re-initialize:
$('#openExistingTree').treeview({ url: CalcBldrOpenExisting.ashx });
after the initial load, the markup looks fine. After clicking
'refresh' once, it looks like this (note duplicate divs):
div
div
div
div
lastExpandable-hitarea
div
Additional notes from our developer:
The initial json returned is:
[{'text': 'Private Drafts','id': 3, 'hasChildren': true},{'text':
'Shared Drafts','id': 4, 'hasChildren': true},{'text': 'Published
Calculations','id': 5, 'hasChildren': true}]
Then, when the user clicks on Private Drafts, I return the
following:
[{ 'text': 'href=\javascript:void(0);\ elemName=\Matthews test calc\
onclick=
\Apx.CalcBuilder.openCalc(this, 1);\Matthews test calc
Hour, Location, Participant'}]
After clearing the tree list, I reinitialize and the returned json is
IDENTICAL to that shown above, but the treeview jquery code does not
interpret it the same way.
--
Any help would be appreciated!
Rolf
-
Be a better friend, newshound, and know-it-all with Yahoo! Mobile. Try it now.
[jQuery] Re: Hide/Close div when clicked outside of it.
Yes you right.
Also I have close link inside of the div.
Everything is working, only outside click left.
On May 1, 3:08 pm, Wes Duff [EMAIL PROTECTED] wrote:
Let me see if I have this clear. Once I do I will write you up a
script.
When someone clicks a link a href=#Show Login Box/a you want
to display a div that shows the login box.
When someone clicks somewhere else on the screen and not on the link
you want to hide the login box?
On May 1, 5:08 am, Aleksandr [EMAIL PROTECTED] wrote:
I still have the same issue.
Yes, I have wrapper div how it can be solved in this case?
Thanks
On Apr 30, 7:05 pm, Wes Duff [EMAIL PROTECTED] wrote:
Off the top of my head --- Try something like this
$('div#mydiv').clcik(function(){$('div#mydiv').show();}); //click to
show div
$('div:not(#mydiv)').click(function(){$('div#mydiv').hide()}); click
anywhere else to hide div ## Problem just thought of If you are using
a wrapper div then you will have the same problem as before. Well you
get the idea.
This is just off the top of my head but if it donst work you get the
idea.
On Apr 30, 11:17 am, Aleksandr [EMAIL PROTECTED] wrote:
Hi All,
I am showing a div on click of a hyperlink. Now, when i click
elsewhere in
the document other than the div itself, then i want to hide the
showing
div... Is there any easy way to do this?
I've already try:
$('html').click(function() { $('#divLoginBox1').hide(); });
and
$('body').click(function() { $('#divLoginBox1').hide(); });
but this close div when clicked inside of it.
Thanks,
Alex
[jQuery] Making a bookmarklet to swap images
Here's a rough guide on making a bookmarklet to change the images in a
page on hover. This looks for images with without in the src and
replaces them with with. For example, img src=a-without.jpg
becomes img src=a-with.jpg. This is useful for testing new
versions of an image on a page.
First, the jQuery:
jQuery([EMAIL PROTECTED]).hover(
function(){
withLink=jQuery(this).attr(src).replace('without','with');
jQuery(this).attr(src,withLink);},
function(){
withOutLink=jQuery(this).attr(src).replace('with','without');
jQuery(this).attr(src,withOutLink);
})
Second, wrap it in javascript:(function(){ ... })() and remove the
whitespace:
javascript:(function(){jQuery([EMAIL PROTECTED]).hover(function()
{withLink=jQuery(this).attr(src).replace('without','with');jQuery(this).attr(src,withLink);},function()
{withOutLink=jQuery(this).attr(src).replace('with','without');jQuery(this).attr(src,withOutLink);})})
()
Save this as a bookmark and click on it on any page with jQuery.
[jQuery] Re: Jquery spell checker
Fontzter wrote on 5/1/2008 10:09 AM: Any leads on this? This is a common request of IE6 users. I would like to have an elegant solution using jQuery. There's always this, if you want to purchase a stand-alone solution (doesn't use jQuery): http://www.thesolutioncafe.com/ajax-spell-checker.html Otherwise, the Prototype-based Spellify is probably your best bet: http://www.spellify.com/ - Bil
[jQuery] Re: Problems with jqm in IE
*bump* :)
Any ideas? Thanks!
On Apr 29, 10:49 pm, the_woodsman [EMAIL PROTECTED] wrote:
Hi guys,
After some laborious use of alerts, I've tracked down my bug in IE,
and it relates to $().jqm().
I think It's a live query style issue (I'm not actually using live
query!).
I have a function that attaches events to elements, and this is called
again when new elements are added via AJAX.
I have the following code:
attachEvents: function()
{
// do stuff...
if(!$('#dialog').jqm)
{
alert('jqm fn does not exist!!');
}
/* make modal popup from #dialog */
$('#dialog').jqm(
// ... blah blah blah
So, the attachEvents function gets called multiple times.
In FF, everything is fine.
In IE, the second time you call attachEvents, $('#dialog') still
alerts as an object, but it doesn't have a .jqm() method!
Unsurprisingly, the error is Object doesn't support this property or
method.
Any suggestions?? I'm pretty stumped :|
[jQuery] Way to designate links as form submitters?
Anyway to do that? Have certain links, say with an id of link, to be programmed to submit a form when clicked? Rick
[jQuery] Re: Way to designate links as form submitters?
As a follow-up to my question, I found this method
that utilizes regular JS, but I'd like to be able to
cause any link with a certain id to act as a Submit Link.
Here's the code I found to create a text submit link:
script language=JavaScript type=text/javascript
!--
function getsupport ( selectedtype )
{
document.supportform.supporttype.value = selectedtype ;
document.supportform.submit() ;
}
--
/script
form name=supportform method=post action=yourscriptname.cgi
input type=hidden name=supporttype /
a href=javascript:getsupport('Paid')Paid Support/a or
a href=javascript:getsupport('Free')Free Support/a
Thanks for any help in changing this to jQuery!
Rick
-Original Message-
From: jquery-en@googlegroups.com [mailto:[EMAIL PROTECTED] On Behalf Of Rick
Faircloth
Sent: Thursday, May 01, 2008 12:08 PM
To: jquery-en@googlegroups.com
Subject: [jQuery] Way to designate links as form submitters?
Anyway to do that?
Have certain links, say with an id of link,
to be programmed to submit a form when clicked?
Rick
[jQuery] Re: Way to designate links as form submitters?
Hey,
THis shouldn't be tricky, as long as you cna easily find which form
you want to submit!
Are there multiple forms on the page to choose between?
Something like this *should* submit the first form on the page
(untested) ...
$('.submitLink')
.click(
function()
{
$('form').get(0).submit();
return false;
}
);
On May 1, 5:32 pm, Rick Faircloth [EMAIL PROTECTED] wrote:
As a follow-up to my question, I found this method
that utilizes regular JS, but I'd like to be able to
cause any link with a certain id to act as a Submit Link.
Here's the code I found to create a text submit link:
script language=JavaScript type=text/javascript
!--
function getsupport ( selectedtype )
{
document.supportform.supporttype.value = selectedtype ;
document.supportform.submit() ;}
--
/script
form name=supportform method=post action=yourscriptname.cgi
input type=hidden name=supporttype /
a href=javascript:getsupport('Paid')Paid Support/a or
a href=javascript:getsupport('Free')Free Support/a
Thanks for any help in changing this to jQuery!
Rick
-Original Message-
From: jquery-en@googlegroups.com [mailto:[EMAIL PROTECTED] On Behalf Of
Rick Faircloth
Sent: Thursday, May 01, 2008 12:08 PM
To: jquery-en@googlegroups.com
Subject: [jQuery] Way to designate links as form submitters?
Anyway to do that?
Have certain links, say with an id of link,
to be programmed to submit a form when clicked?
Rick
[jQuery] Re: Jquery spell checker
I would assume this would have to include some sort of database interaction. I will be considering a PHP/MySQL/jQuery solution. Cheers. Joe www.subprint.com On May 1, 10:54 am, Bil Corry [EMAIL PROTECTED] wrote: Fontzter wrote on 5/1/2008 10:09 AM: Any leads on this? This is a common request of IE6 users. I would like to have an elegant solution using jQuery. There's always this, if you want to purchase a stand-alone solution (doesn't use jQuery): http://www.thesolutioncafe.com/ajax-spell-checker.html Otherwise, the Prototype-based Spellify is probably your best bet: http://www.spellify.com/ - Bil
[jQuery] Re: Way to designate links as form submitters?
Rick,
Try this (untested):
$(document).ready(function() {
$.each(.formlink), function() {
$(this).click(function() {
$(#supporttype).val($(this).attr(id);
$(#supportform).submit();
});
});
});
form id=supportform name=supportform method=post
action=yourscriptname.cgi
input type=hidden id=supporttype name=supporttype /
a class=formlink id=PaidPaid Support/a or
a class=formlink id=FreeFree Support/a
HTH,
Carl
Rick Faircloth wrote:
As a follow-up to my question, I found this method
that utilizes regular JS, but I'd like to be able to
cause any link with a certain id to act as a Submit Link.
Here's the code I found to create a text submit link:
script language=JavaScript type=text/javascript
!--
function getsupport ( selectedtype )
{
document.supportform.supporttype.value = selectedtype ;
document.supportform.submit() ;
}
--
/script
form name=supportform method=post action=yourscriptname.cgi
input type=hidden name=supporttype /
a href=javascript:getsupport('Paid')Paid Support/a or
a href=javascript:getsupport('Free')Free Support/a
Thanks for any help in changing this to jQuery!
Rick
-Original Message-
From: jquery-en@googlegroups.com [mailto:[EMAIL PROTECTED] On Behalf Of Rick
Faircloth
Sent: Thursday, May 01, 2008 12:08 PM
To: jquery-en@googlegroups.com
Subject: [jQuery] Way to designate links as form submitters?
Anyway to do that?
Have certain links, say with an id of link,
to be programmed to submit a form when clicked?
Rick
[jQuery] Re: treeview - async - problems reinitializing tree
Thanks ripple.
So are you saying you had to remove and clear the individual elements
and attributes, rather than using empty() or remove() on the UL?
Why wouldn't removing or emptying the contents of the UL do the same
thing?
I guess I'm confused as to what or where (why!) information about the
contents of the UL is being cached if we've reset it to an empty ul/
ul
rolf
On May 1, 8:13 am, ripple [EMAIL PROTECTED] wrote:
I had to handle this situation over a week ago.
I just wrote a couple lines to remove all tree attributes from the
generated source and then rebuilt the tree.
$('.sample ul:eq(0)').removeClass('treeview');
$('.sample li').removeClass();
$('.sample ul div').remove();
$('.sample ul').removeAttr('style');
$('.sample ul').tree();
See my working sample
here.http://www.2whoa.com/apps/demo/apex-admin/hierarchy.html
Works great on IE6 and FF. Haven't tested it on a Mac yet.
I hope that helps.
[jQuery] Get System Error with jCarousel and Thickbox 3
Hi , I was trying to use jCarousel and Thickbox 3 plugin . From the jCarousel, examples folder - used the special_thickbox.html and replaced the URI to point at REST webservice call image output as shown below instead of static .jpg image links. http://re3.yt-thm-a01.yimg.com/image/25/m4/3024464321 http://re3.yt-thm-a01.yimg.com/image/25/m4/3022951145 The initial thumbnail display works fine but on click of the image , get a System Error at Line 0. IE error window. Browser is IE 6. Has anyone faced this issue before ? Any resolution ? Thanks in Advance ! Thanks Samant
[jQuery] Re: treeview - async - problems reinitializing tree
I didn't remove the contents within the elements(uldata/ullidata/li). I
only had to remove the html and (div/div, etc) attributes/characteristics
applied by treeview, cause on a rebuild it would reapply the attributes,
resulting in it breaking.
I had to bring the lists down to the simple html and then rebuild.
I'm not sure how someone else would have gone about this, but there's not
much info around on working with trees to make them as dynamic as I needed to.
I'm not sure why you write about removing the contents in a ul/ul? At
what point would that beneficial? Your working with the ajax tree, but how much
ajax interaction are using? Only at onload time?
rolfsf [EMAIL PROTECTED] wrote:
Thanks ripple.
So are you saying you had to remove and clear the individual elements
and attributes, rather than using empty() or remove() on the UL?
Why wouldn't removing or emptying the contents of the UL do the same
thing?
I guess I'm confused as to what or where (why!) information about the
contents of the UL is being cached if we've reset it to an empty ul
rolf
On May 1, 8:13 am, ripple wrote:
I had to handle this situation over a week ago.
I just wrote a couple lines to remove all tree attributes from the
generated source and then rebuilt the tree.
$('.sample ul:eq(0)').removeClass('treeview');
$('.sample li').removeClass();
$('.sample ul div').remove();
$('.sample ul').removeAttr('style');
$('.sample ul').tree();
See my working sample
here.http://www.2whoa.com/apps/demo/apex-admin/hierarchy.html
Works great on IE6 and FF. Haven't tested it on a Mac yet.
I hope that helps.
-
Be a better friend, newshound, and know-it-all with Yahoo! Mobile. Try it now.
[jQuery] Re: Cluetip showing content below fold
thanks for the info.
Another thing you can check is whether you are including the
Dimensions plugin. (it's a dependancy.) If it's in there, then the
next thing I'd like to know is the version # you're using for jquery
core, dimensions, and cluetip. Of course, if you have a page you can
show me with the problem, that would be even better. The more
information I have regarding your particular situation, the better I
can help you.
The plugin is already doing the iteration ( return this.each() ),
so that shouldn't be relevant.
--Karl
_
Karl Swedberg
www.englishrules.com
www.learningjquery.com
On May 1, 2008, at 8:19 AM, sprak wrote:
That's already in place on the page; here is the exact doctype we are
using:
!DOCTYPE html PUBLIC -//W3C//DTD XHTML 1.0 Transitional//EN
http://
www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd
html xmlns=http://www.w3.org/1999/xhtml; xmlns:v=urn:schemas-
microsoft-com:vml xml:lang=en lang=en dir=ltr
Here are a few other details that might be of use; the script
$(document).ready(function() { $('td.sricon img').cluetip({showTitle:
false, positionBy: 'mouse'}); } );
returns multiple elements and is applying a cluetip to each element.
I tried modifying the script to
use .each() to iterate over the elements in case the position
calculations were being done once and
applied to each item. This did not work either.
The whole page is a MediaWiki setup, so there are various wiki related
JS libraries included on the
page along with a JS library used to render our menus. Looking
through the cluetip code and the code
for these libraries, I'm not seeing anything that would conflict with
each other. However, I will look
into turning those libraries off temporarily and see if that does
anything.
Thank you.
Regards.
- Luis
On Apr 30, 4:42 pm, Karl Swedberg [EMAIL PROTECTED] wrote:
it's possible that the problem has to do with the page being in
quirks
mode, though I can't tell for sure without more information.
Could you try using a doctype system identifier to put the page
into
standards mode?
For example:
!DOCTYPE html PUBLIC -//W3C//DTD XHTML 1.0 Transitional//EN
http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd;
or
!DOCTYPE HTML PUBLIC -//W3C//DTD HTML 4.01//EN
http://www.w3.org/TR/html4/strict.dtd;
thanks.
--Karl
_
Karl Swedbergwww.englishrules.comwww.learningjquery.com
[jQuery] Re: Get System Error with jCarousel and Thickbox 3
I think the issue with the enlarge image view is in the below snippet of
code as
the URLs dont jabe .jpg extension . Any workaround ?
function mycarousel_getItemHTML(item)
{
var url_m = item.url.replace(/_s.jpg/g, '_m.jpg');
On 5/1/08, Samant [EMAIL PROTECTED] wrote:
Hi ,
I was trying to use jCarousel and Thickbox 3 plugin .
From the jCarousel, examples folder - used the special_thickbox.html
and replaced the URI to point at REST webservice call image output as
shown below instead of
static .jpg image links.
http://re3.yt-thm-a01.yimg.com/image/25/m4/3024464321
http://re3.yt-thm-a01.yimg.com/image/25/m4/3022951145
The initial thumbnail display works fine but on click of the image ,
get a System Error at Line 0. IE error window.
Browser is IE 6.
Has anyone faced this issue before ? Any resolution ? Thanks in
Advance !
Thanks
Samant
[jQuery] Re: treeview - async - problems reinitializing tree
Our tree will potentially change within the time that someone is using it. In fact, the user will be creating and saving new nodes; Other users will be creating and saving new nodes. Both users need to be able to refresh the tree to see nodes added by themselves and others. The async tree starts as an empty ul/ul. We want to return to that initial state when we click a refresh button. A completely clean slate, then reload with the fresh data as if we had just opened it for the first time. On May 1, 10:40 am, ripple [EMAIL PROTECTED] wrote: I'm not sure why you write about removing the contents in a ul/ul? At what point would that beneficial? Your working with the ajax tree, but how much ajax interaction are using? Only at onload time?
[jQuery] async treeview - Can we have a callback method that is invoked when the return status is not 200?
Another request for the Async Treeview - in our application, we have an automatic session time out after a set period of idle time. After that timeout, the server will return a 302 Redirect status. We then popup a dialog or redirect to the login page. We need to have a callback method that is invoked when the return status is not 200 OK Is there an easy way to get that? Thanks, rolf
[jQuery] Re: Jquery spell checker
Joe wrote on 5/1/2008 12:00 PM: I would assume this would have to include some sort of database interaction. I will be considering a PHP/MySQL/jQuery solution. Spellify uses Google's spellchecker - good if you want just regular spell checking, bad if you need custom spell checking for specialized applications (e.g. medical terminology, legal jargon, etc.). So if someone were to step up and convert Spellify to jQuery, it would be nice to allow custom dictionaries to be specified, and even better, allow the user to save any custom words. I think JSpell (the paid solution I mentioned) does all that and more. I've never used JSpell, so can't speak to how good/bad it is. The other option, since Firefox already has a built-in spell checker, is to have your IE users install a plug-in to do spell checking: http://www.iespell.com/ - Bil
[jQuery] addUnique
Just thought that this might help someone's pain. I have a group of
objects and I wanted to add an additional object to it, simply by
doing this:
jQuery('#divMain img').add('#newImg');
The problem was that in my situation '#divMain img' sometimes already
contains '#newImg', and when it does the add function would add a
second copy of it, which messed things up further down the line. What
I really needed was a way of uniquly adding an object to a selection.
A bit of tinkering later and here's the function:
jQuery.fn.addUnique = function(selector) {
return this.filter(function (index) {
return (jQuery(this).get(0) != jQuery(selector).get(0))
}).add(selector);
};
You can just call it like this:
jQuery('#divMain img').addUnique('#newImg');
[jQuery] Re: treeview - async - problems reinitializing tree
That's pretty much how mine will work as well. Although I haven't had to add the ajax part. I just needed to create it to display to another team how it's supposed to work. With looking at an older message of yours, your getting the same results I was getting. That's when I removed all the treeview applied html and attributes and that got it working right. I assume your using a button or submit for the refresh as your saving it. On that note I would remove all the treeview attributes at that time, just before the save. rolfsf [EMAIL PROTECTED] wrote: Our tree will potentially change within the time that someone is using it. In fact, the user will be creating and saving new nodes; Other users will be creating and saving new nodes. Both users need to be able to refresh the tree to see nodes added by themselves and others. The async tree starts as an empty . We want to return to that initial state when we click a refresh button. A completely clean slate, then reload with the fresh data as if we had just opened it for the first time. On May 1, 10:40 am, ripple wrote: I'm not sure why you write about removing the contents in a ? At what point would that beneficial? Your working with the ajax tree, but how much ajax interaction are using? Only at onload time? - Be a better friend, newshound, and know-it-all with Yahoo! Mobile. Try it now.
[jQuery] dimensiosn plugin
i am a little unclear on how exactly to get the position of an element using
jquery dimensions plugin.
documentation says it returns An object with top and left properties that
are numbers representing the offset in pixels.
and it says the object looks like this:
{ top: 10, left: 10 }
so how do i access it? like a string? do i have to use string functions to
pull out the height and width individually?
--
View this message in context:
http://www.nabble.com/dimensiosn-plugin-tp16995030s27240p16995030.html
Sent from the jQuery General Discussion mailing list archive at Nabble.com.
[jQuery] Re: dimensiosn plugin
However you assign it's value is how you'd reference it:
var img = $();
var top = img.top ;
is my guess.
-Original Message-
From: jquery-en@googlegroups.com [mailto:[EMAIL PROTECTED] On
Behalf Of bdee1
Sent: Thursday, May 01, 2008 2:56 PM
To: jquery-en@googlegroups.com
Subject: [jQuery] dimensiosn plugin
i am a little unclear on how exactly to get the position of an element using
jquery dimensions plugin.
documentation says it returns An object with top and left properties that
are numbers representing the offset in pixels.
and it says the object looks like this:
{ top: 10, left: 10 }
so how do i access it? like a string? do i have to use string functions to
pull out the height and width individually?
--
View this message in context:
http://www.nabble.com/dimensiosn-plugin-tp16995030s27240p16995030.html
Sent from the jQuery General Discussion mailing list archive at Nabble.com.
[jQuery] How to stop other elements on the page from dimming
Hi All - Is there a way to stop the other elements on the page from dimming when a fade occurs?
[jQuery] Re: Can't set type=search attribute to input fields on Safari 3.0
I can confirm this is happening. We had to revert back to an older
jQuery (1.1.4). Any ideas if a ticket has been filed for this bug?
-Cody
On Mar 22, 3:36 pm, claudiopro [EMAIL PROTECTED] wrote:
Apparently, jQuery can't set the type attribute of html input fields
to look like Cocoasearchfields inSafari.
jQuery version: 1.2.3Safariversion: 3.1 (525.13)
Proof follows:
html
head
script src=jquery-1.2.3.min.js/script
script
$(function() {
// this works:
//document.getElementById('s_f').setAttribute('type', 'search');
// these don't work:
$('#s_f').attr('type', 'search');
$('#s_f').attr({type: 'search'});});
/script
/head
body
input type=text id=s_f /
/body
/html
Best regards,
--
Claudio Procidahttp://www.emeraldion.it
[jQuery] Re: Very Challenging (Drop-Drag) Text Resize Scroller
This is an interesting problem to me (not that I have much time to put
into it, ug :-) ... I did a little googling and found this, which may
give you some ideas (albeit using moo):
http://www.wscreative.co.uk/blog/posts/2008/04/08/text-resizing-with-javascript-and-a-scrollbar/
(try the slider at the top of the page)
I was looking for a solid jquery slider control the other day and came
up short. Seems like a no-brainer to have a good one around. The one in
YUI looked best for what I wanted to use. Maybe someone knows of a good
jquery-based one?
For the print issue, I don't know. Is there something you're doing in
the media='print' file that can't be applied to the screen view? Maybe
you could make a .print class in the screen view and add that to the
objects you want altered for print (like .print { display:none } to hide
nav stuff)?
- Jack
Wes Duff wrote:
Hello everyone, I am in the process of creating a Text Resize Scroller
for my employer.
I have the skin created which consists of a background image that
looks like a stretched out
Less than symbol “” with a vertical rectangular handle to scroll left
and right to make the text grow
Or shrink.
Here is what I had in mind.
First set variables
Var 1. current text size
Var 2 . how much to increment the text size when dragged to the
next area of the scroller
Var 3. scroller snap in areas (so we know how much to scroll by
when the user drags the mouse)
Set a function to do drop and drag
Set snap in areas of incrementing and de incrementing the handle of
the scroller
Depending on where the handle came from should tell the function to
either grow the text or shrink the text
If that isn’t tricky enough, when the user has selected the text size
they want they click the save button.
The save button then needs to dynamically change the css
media=”print” so when the user prints the webpage
The user will see the larger print they chose on the webpage.
To dynamically change the css for the media=”print” I was thinking of
just doing a style type=”css/text” at the
Top and use JQuery to access these attributes and change the text
size.
Any help on getting the idea down will be great. I know many of us are
up for a great challenge and when this
Script is done and in working order I will post the final script and
images so everyone can use it.
Thanks
[jQuery] Re: How to stop other elements on the page from dimming
Unless those other elements are being included in the fade, they shouldn't be effected. -Original Message- From: jquery-en@googlegroups.com [mailto:[EMAIL PROTECTED] On Behalf Of Austin S. Sent: Thursday, May 01, 2008 2:37 PM To: jQuery (English) Subject: [jQuery] How to stop other elements on the page from dimming Hi All - Is there a way to stop the other elements on the page from dimming when a fade occurs?
[jQuery] Re: dimensiosn plugin
Since it returns an object, you can use either dot notation or bracket
notation. So, to get the top position of an element, you could do
this ...
$(element).offset().top
or this ...
$(element).offset()['top']
hope that helps.
--Karl
_
Karl Swedberg
www.englishrules.com
www.learningjquery.com
On May 1, 2008, at 3:56 PM, bdee1 wrote:
i am a little unclear on how exactly to get the position of an
element using
jquery dimensions plugin.
documentation says it returns An object with top and left
properties that
are numbers representing the offset in pixels.
and it says the object looks like this:
{ top: 10, left: 10 }
so how do i access it? like a string? do i have to use string
functions to
pull out the height and width individually?
--
View this message in context:
http://www.nabble.com/dimensiosn-plugin-tp16995030s27240p16995030.html
Sent from the jQuery General Discussion mailing list archive at
Nabble.com.
[jQuery] Re: How to stop other elements on the page from dimming
Are you using FF Mac? If so, it's an opacity bug in the browser. Try
setting this in the stylesheet:
body { -moz-opacity: 0.; }
--Karl
_
Karl Swedberg
www.englishrules.com
www.learningjquery.com
On May 1, 2008, at 4:47 PM, Andy Matthews wrote:
Unless those other elements are being included in the fade, they
shouldn't
be effected.
-Original Message-
From: jquery-en@googlegroups.com [mailto:[EMAIL PROTECTED]
On
Behalf Of Austin S.
Sent: Thursday, May 01, 2008 2:37 PM
To: jQuery (English)
Subject: [jQuery] How to stop other elements on the page from dimming
Hi All -
Is there a way to stop the other elements on the page from dimming
when a
fade occurs?
[jQuery] Troubling IE problem
I recently completed using jQuery to build a navigation structure for the site I manage at work. The site is http://www.msi.umn.edu. The script giving problems is http://www.msi.umn.edu/js/leftnav.js. The difficulty seems to be in the step where I add a span to menu items that have a sub-menu using .prepend(). The span holds my expanded/collapsed graphics and gets a .toggle() to expand and collapse the appropriate menus and other behaviors. IE 7 isn't inserting the span and, thus, my navigation scheme fails when using IE7. I'm fortunate that most of my users are using Firefox or Safari, but there's still a significant portion of IE users getting the shaft out there. I'd appreciate anyone being able to take a look and shoot me ideas for fixing the problem. -- Peter Hentges JBRU
[jQuery] the dropdown menu flashes on the screen on page load.
I have two drop-down lists in the main menu at the top of the page. When you click on link items in the top menu (different menu) which is below the main menu the drop-down menu flashs then disapears as the rest of the page loads.
[jQuery] Re: Hide/Close div when clicked outside of it.
The Easiest method would be to create a wrapper div that takes up
the entire screen and assign an onClick event to that, which would
then contain the other div. For example:
div id=wrapper
div id=divLoginBox1
Login box content
/div
/div
The CSS for the DIV id=wrapper would be something like:
#wrapper {
position:absolute;
height:100%;
width: 100%;
}
Then the JS would be:
$(#wrapper').click(function() { $('#divLoginBox1').hide(); });
That should do it. You could leave the #wrapper background
transparent or add in some opacity to a background color to emulate a
faded effect to the page content. I believe this is similar to how
well established libraries like thickbox handle the same
functionality.
On May 1, 11:14 am, Aleksandr [EMAIL PROTECTED] wrote:
Yes you right.
Also I have close link inside of the div.
Everything is working, only outside click left.
On May 1, 3:08 pm, Wes Duff [EMAIL PROTECTED] wrote:
Let me see if I have this clear. Once I do I will write you up a
script.
When someone clicks a link a href=#Show Login Box/a you want
to display a div that shows the login box.
When someone clicks somewhere else on the screen and not on the link
you want to hide the login box?
On May 1, 5:08 am, Aleksandr [EMAIL PROTECTED] wrote:
I still have the same issue.
Yes, I have wrapper div how it can be solved in this case?
Thanks
On Apr 30, 7:05 pm, Wes Duff [EMAIL PROTECTED] wrote:
Off the top of my head --- Try something like this
$('div#mydiv').clcik(function(){$('div#mydiv').show();}); //click to
show div
$('div:not(#mydiv)').click(function(){$('div#mydiv').hide()}); click
anywhere else to hide div ## Problem just thought of If you are using
a wrapper div then you will have the same problem as before. Well you
get the idea.
This is just off the top of my head but if it donst work you get the
idea.
On Apr 30, 11:17 am, Aleksandr [EMAIL PROTECTED] wrote:
Hi All,
I am showing a div on click of a hyperlink. Now, when i click
elsewhere in
the document other than the div itself, then i want to hide the
showing
div... Is there any easy way to do this?
I've already try:
$('html').click(function() { $('#divLoginBox1').hide(); });
and
$('body').click(function() { $('#divLoginBox1').hide(); });
but this close div when clicked inside of it.
Thanks,
Alex
[jQuery] jtip plugin
I'm using this plugin for the first time and noticing something odd. The tooltip loads as you would expect, but at the bottom left hand side of my screen I see another tooltip loading(with the same title) with the animated loading image in the body of the window and nothing else. Very strange. Anyone else noticed something like this?
[jQuery] Re: How to stop other elements on the page from dimming
Ah, interesting. Thanks for the tip Karl!
Anyone know if FF/Mac folks are planning on fixing this bug?
Thanks,
M
On May 1, 1:59 pm, Karl Swedberg [EMAIL PROTECTED] wrote:
Are you using FF Mac? If so, it's an opacity bug in the browser. Try
setting this in the stylesheet:
body { -moz-opacity: 0.; }
--Karl
_
Karl Swedbergwww.englishrules.comwww.learningjquery.com
On May 1, 2008, at 4:47 PM, Andy Matthews wrote:
Unless those other elements are being included in the fade, they
shouldn't
be effected.
-Original Message-
From: jquery-en@googlegroups.com [mailto:[EMAIL PROTECTED]
On
Behalf Of Austin S.
Sent: Thursday, May 01, 2008 2:37 PM
To: jQuery (English)
Subject: [jQuery] How to stop other elements on the page from dimming
Hi All -
Is there a way to stop the other elements on the page from dimming
when a
fade occurs?
[jQuery] Re: Looking for plugin: Cookie parser? (one cookie, multiple values?)
Beautiful! Exactly what I am looking for. Thanks tlphipps, I greatly appreciate the help!!! Cheers, Micky On Apr 29, 2:48 pm, tlphipps [EMAIL PROTECTED] wrote: I think you might be talking about something like the cookiejar plugin:http://www.jdempster.com/2007/08/11/jquery-cookiejar/ I can vouch for it as working great in addition to the tablesorter. On Apr 29, 12:19 pm, MickyHulse[EMAIL PROTECTED] wrote: Hi all, Long story short, I would like to avoid setting multiple cookies for my site... One cookie that holds multiple values, for different objects and/or items, would be perfect! :) Before I go reinventing the wheel on this one, I was just wondering if anyone has wrote some code (or a plugin) that handles this? Many thanks in advance! Cheers, Micky
[jQuery] Re: the dropdown menu flashes on the screen on page load.
You'll need to give us more information, a demo or at least some code, before we can help you diagnose. On Thu, May 1, 2008 at 5:18 PM, all4one [EMAIL PROTECTED] wrote: I have two drop-down lists in the main menu at the top of the page. When you click on link items in the top menu (different menu) which is below the main menu the drop-down menu flashs then disapears as the rest of the page loads. -- Ted
[jQuery] Re: Troubling IE problem
It seems like all your doing is an accordion feature from page to page. Why?
And it doesn't work at all in IE(6 7).
You might want to re-evaluate the script and how your handing it. Just a few
comments to ponder on.
1. Using the hover function to highlight a link seems like overkill for
scripting. Leave that to css. That's what css is made for. That would remove 8
lines of code.
2. Using accordions to go from a page to new page on every click, make's
little sense. Accordions are used mostly for containing grouped content and not
for navigation controls.
3. Instead of having the script write the images to the page with all the
prepend span-image stuff. Have the image as a css background.
Example:
$(this).css('background', 'url(images/blackDownTriangle.png));
4. Since your using png images your going to run into a problem with IE6.
Include pngfix.js or change the images to gif.
The whole script could really be simplfied into less than half the code it is
now.
I wouldn't use an accordion for this type of navigation to begin with.
Sorry if your offended by the comments.
JBRU [EMAIL PROTECTED] wrote:
I recently completed using jQuery to build a navigation structure for
the site I manage at work. The site is http://www.msi.umn.edu.
The script giving problems is http://www.msi.umn.edu/js/leftnav.js.
The difficulty seems to be in the step where I add a span to menu
items that have a sub-menu using .prepend(). The span holds my
expanded/collapsed graphics and gets a .toggle() to expand and
collapse the appropriate menus and other behaviors.
IE 7 isn't inserting the span and, thus, my navigation scheme fails
when using IE7. I'm fortunate that most of my users are using Firefox
or Safari, but there's still a significant portion of IE users getting
the shaft out there.
I'd appreciate anyone being able to take a look and shoot me ideas for
fixing the problem.
--
Peter Hentges
JBRU
-
Be a better friend, newshound, and know-it-all with Yahoo! Mobile. Try it now.
[jQuery] Re: Can't set type=search attribute to input fields on Safari 3.0
I filed a ticket, but it was marked as nofix. Apparently there are
inconsistencies in changing the type attribute in input fields and
they aren't meant to have their type attribute changed. So the
alternative is to simply remove the input field and create a new one
of the desired type using jQuery (rather than changing just the
attribute).
-Cody
On May 1, 2:35 pm, Cody [EMAIL PROTECTED] wrote:
I can confirm this is happening. We had to revert back to an older
jQuery (1.1.4). Any ideas if a ticket has been filed for this bug?
-Cody
On Mar 22, 3:36 pm, claudiopro [EMAIL PROTECTED] wrote:
Apparently, jQuery can't set the type attribute of html input fields
to look like Cocoasearchfields inSafari.
jQuery version: 1.2.3Safariversion: 3.1 (525.13)
Proof follows:
html
head
script src=jquery-1.2.3.min.js/script
script
$(function() {
// this works:
//document.getElementById('s_f').setAttribute('type', 'search');
// these don't work:
$('#s_f').attr('type', 'search');
$('#s_f').attr({type: 'search'});});
/script
/head
body
input type=text id=s_f /
/body
/html
Best regards,
--
Claudio Procidahttp://www.emeraldion.it
[jQuery] Re: addUnique
The problem was that in my situation '#divMain img' sometimes already contains '#newImg', and when it does the add function would add a second copy of it, which messed things up further down the line. That actually sounds like a bug. What version of jQuery are you using? AFAICT, jQuery().add() is supposed to use jQuery.merge to avoid duplicates. Can you create a test case and post a bug report?
[jQuery] Re: UI Sortables conflict?
uncaught exception: [Exception... Could not convert JavaScript argument nsresult: 0x80570009 (NS_ERROR_XPC_BAD_CONVERT_JS) I saw that error once when I was trying to get the style properties of a text node. Can you narrow down the location and call stack with Firebug?
[jQuery] event binding on dynamically created elements? stumped
Hello...
I'm creating an input element like this:
$(this).after('input type=text name=symptom
value=Enter Symptom class=focusClear/
');
then I want to clear the value on focus like so:
$('.focusClear').focus(function(){
$(this).val('');
});
Obviously this doesnt work cine jquery doesnt know about the element
yet. Do I need to write it as an extension?
Thanks!
[jQuery] Re: event binding on dynamically created elements? stumped
In this case, the simplest thing is probably to use .find() to
discover the new element, i.e.:
$(this)
.after('input type=text name=symptom value=Enter Symptom
class=focusClear /')
.parent()
.find('input.focusClear')
.focus(function(){
$(this).val('');
});
- jason
On May 1, 8:07 pm, jquertil [EMAIL PROTECTED] wrote:
Hello...
I'm creating an input element like this:
$(this).after('input type=text name=symptom
value=Enter Symptom class=focusClear/
');
then I want to clear the value on focus like so:
$('.focusClear').focus(function(){
$(this).val('');
});
Obviously this doesnt work cine jquery doesnt know about the element
yet. Do I need to write it as an extension?
Thanks!
[jQuery] Re: event binding on dynamically created elements? stumped
Once your new object has been added to the document you should have total
access to ii and when you create the new object that's when you attach the
event.
I can't tell by the code you posted, when these things are executed.
jquertil [EMAIL PROTECTED] wrote:
Hello...
I'm creating an input element like this:
$(this).after(' [input] value=Enter Symptom class=focusClear/
');
then I want to clear the value on focus like so:
$('.focusClear').focus(function(){
$(this).val('');
});
Obviously this doesnt work cine jquery doesnt know about the element
yet. Do I need to write it as an extension?
Thanks!
-
Be a better friend, newshound, and know-it-all with Yahoo! Mobile. Try it now.
[jQuery] ready firing twice on the page
Hi all, I am trying to load some partials on page load and they are not necessarily aware of each other (different people will be developing them and they're pulled together on a page before sending to the client). Since it's designed this way there is a $(document).ready block on each partial with some code to initialize each partial. The strange thing is that when the page loads, the ready block is triggered twice for each partial. It has the same behavior in IE and FireFox. There is a ready block on the main page but it doesn't get called twice, just the blocks on the partials do. It all gets sent to the client at once so I'm not sure what the difference between the page ready block and the others is and why they all don't fire twice or all just fire once (preferred!). Has anyone seen behavior like this before and have some ideas what might be going on? Is there some kind of element ready that I can use instead of the document? Thanks for any help!
[jQuery] Omission in the documentatoin?
Hey all, I think that I found an error in the documentation, and if not an error then an omission. The documentation for jQuery.extend (http://docs.jquery.com/Core/ jQuery.extend) says that it is used to extend the jQuery object. However if you look at the instructions on authoring plugins (http:// docs.jquery.com/Plugins/Authoring) or the jQuery UI source code you see its also (when you pass in multiple objects) to add the members of the first to the second. I can guess the behaviour but it would be useful to have some real documentation on this behavior, especially since the the recommended way to build plugins. Thanks! Adam
[jQuery] Re: event binding on dynamically created elements? stumped
I haven't tested this but it might work for you:
$j('input type=text name=symptom value=Enter Symptom
class=focusClear/').insertAfter(this).focus(function(){
$(this).val('');
});
That should have the right context (your new node, not this) and you
don't have to look it up again in another line.
HTH!
On May 1, 5:07 pm, jquertil [EMAIL PROTECTED] wrote:
Hello...
I'm creating an input element like this:
$(this).after('input type=text name=symptom
value=Enter Symptom class=focusClear/
');
then I want to clear the value on focus like so:
$('.focusClear').focus(function(){
$(this).val('');
});
Obviously this doesnt work cine jquery doesnt know about the element
yet. Do I need to write it as an extension?
Thanks!
[jQuery] Ajax .click function after .get
Hello guys
I am just starting to play with and learn jquery. I have come to some
problems and were able to solve them.
I think that its something obvious that i am missing in the .get()
I am trying to create a page that will never refresh so for the
navigation bar i decided to use the ajax .get function to change the
innerhtml of a special div tag. But when i do that the new content
that is in the html does not seem to work with my jquery rules that i
have
$(a[href^=#]).not(.point).click(function(){
$(#main).html('div id=loadingLoading Contentbr /img
src=images/loader.gif alt=Loading//div');
$.get(ajaxreader.php?idpage=+$(this).attr(id),function(data){
$(#main).html(data);
});
});
the links inside the html that get changed are also href=#something
so they should work but they don't.
Any help or tips will be appreciated?
If you have a better way to do refreshless sites using jquery can you
please tell me?
Thanks in advance
[jQuery] Re: How to stop other elements on the page from dimming
It's fixed in the Firefox 3 beta. :-)
--Karl
_
Karl Swedberg
www.englishrules.com
www.learningjquery.com
On May 1, 2008, at 6:09 PM, Micky Hulse wrote:
Ah, interesting. Thanks for the tip Karl!
Anyone know if FF/Mac folks are planning on fixing this bug?
Thanks,
M
On May 1, 1:59 pm, Karl Swedberg [EMAIL PROTECTED] wrote:
Are you using FF Mac? If so, it's an opacity bug in the browser. Try
setting this in the stylesheet:
body { -moz-opacity: 0.; }
--Karl
_
Karl Swedbergwww.englishrules.comwww.learningjquery.com
On May 1, 2008, at 4:47 PM, Andy Matthews wrote:
Unless those other elements are being included in the fade, they
shouldn't
be effected.
-Original Message-
From: jquery-en@googlegroups.com [mailto:[EMAIL PROTECTED]
On
Behalf Of Austin S.
Sent: Thursday, May 01, 2008 2:37 PM
To: jQuery (English)
Subject: [jQuery] How to stop other elements on the page from
dimming
Hi All -
Is there a way to stop the other elements on the page from dimming
when a
fade occurs?
[jQuery] event trigger doesnt work ?
I have a field with onblur function like this
input type='text' name='myname' id='myname' value=''
onblur='dosomething(this.value);'/
and then in a button i put
$('#myname').trigger('blur'); ...
it seems the trigger wont call dosomething when i call $
('#myname').trigger('blur');
