[jQuery] Re: jquery append() works for local but not when loaded from server side? the same html file
by setting a breakpoint, I made sure the $
(#show_messages_div).append(litest/li); line is executed, but
nothing happens, but if copy this line and execute it in the console,
it works, this is so weird.
On Jul 6, 1:16 pm, Slowness Chen slowness.c...@gmail.com wrote:
the html is like the following. it works fine if I load it as a local
html file, but when I load it from a server, it doesn't, I printed $
(#show_messages_div).html() in console but it showed nothing. it
just doesn't make any sense to me. I tried searching around but found
nothing. can anybody give me a clue? thanks.
BTW:when I load it from server side, it shows nothing but if I type $
(#show_messages_div).append(dfdfdf) in console, it works
...
script type=text/javascript
$(document).ready(function() {
$(#show_messages_div).append('h2/h2');});
/script
...
div id=show_messages_div width=300/div
[jQuery] Re: Live() event doesnot refresh the class of the event which was changed dynamically.
Hello,
Thanks for the prompt reply. Yes I have used the newclass and tried.
But the problem remains same. I think I have figured out the effecting
place. I have used the jeditable plugin for the editable as follows.
$('.plus'+num).live(mouseover, function(){
$('.plus'+num).editable('
http://localhost/editinplace0/save.php?p=add'+num,{
submit : 'img src=images/ok.png',
indicator : 'img src=images/loading.gif',
tooltip : 'Click to edit...',
style : 'display: inline',
width : '100px',
onblur :'submit'
});
});
Here* '.plus'+num* is the new class where *num* is a variable to make
every class different. And i have passed 'p=add'+num by get method for the
reference address to store the changed data.
eg. if .plus1 is edited then it goes and saves in add1, if plus2 then num2
and so on. Now the problem is that once i have moved the mouse over all the
dynamically added elements and delete one element, even though the class has
changed automatically, the value i had passed by $_GET method doesnot
change.
suppose i have deleted plus2 after i have moved mouse over all the existing
elements,
*old class old reference new class new reference*
plus1 add1 plus1 add1
plus2 add2 plus2 *add3*
plus3 add3 plus3 * add3*
plus4 add4
Now here the class has changed from plus4 to plus3 but the reference the i
have send through $_GET method doesnot update. What is causing this this
problem?
Hoping for the prompt reply.
Sanam.
On Sun, Jul 5, 2009 at 10:47 PM, Josh Powell seas...@gmail.com wrote:
Also, be very, very careful with using mouseover, mouseout, or
mousemove with live events. The way live events work is to put an
event handler on the document and catch events as they bubble up and
check them against the selector. So, when using mouseover live
events, you are executing a comparison against the selector every time
the mouse moves over an element on the page. This can cause some
dramatic slowdowns, especially if you are using multiple live events
of these types. It's often better to use regular events for
mouseover, mouseout, and mousemove.
Josh Powell
On Jul 5, 9:21 am, Nic Hubbard nnhubb...@gmail.com wrote:
Pretty sure that you have to create a new .live() event for your
expected class. So, you would need to do:
$(.newClass).live(mouseover, function(){
//clickable function here..
});
On Jul 5, 12:30 am, Sanam kcssm2...@gmail.com wrote:
Hello,
I got this problem with live() event.I have used it as follows.
$(.addressDiv span).live(mouseover, function(){
//clickable function here..
});
I have used the live() event to trigger the function on mouseover in
the dynamically added elements. But the problem i got is that once the
live event is called it takes the class of the element and stores. And
when the class of that particular element is changed dynamically the
live() event does not detect the new classed added dynamically,
instead it takes the former class. Live() event does not update the
class. How can I solve this problem?
Sanam
[jQuery] Re: jquery append() works for local but not when loaded from server side? the same html file
when I load the html from server side if I append pure text like $
(#show_messages_div).append(''); it works, but not if I append
html like $(#show_messages_div).append('h2/h2');
On Jul 6, 2:24 pm, Slowness Chen slowness.c...@gmail.com wrote:
by setting a breakpoint, I made sure the $
(#show_messages_div).append(litest/li); line is executed, but
nothing happens, but if copy this line and execute it in the console,
it works, this is so weird.
On Jul 6, 1:16 pm, Slowness Chen slowness.c...@gmail.com wrote:
the html is like the following. it works fine if I load it as a local
html file, but when I load it from a server, it doesn't, I printed $
(#show_messages_div).html() in console but it showed nothing. it
just doesn't make any sense to me. I tried searching around but found
nothing. can anybody give me a clue? thanks.
BTW:when I load it from server side, it shows nothing but if I type $
(#show_messages_div).append(dfdfdf) in console, it works
...
script type=text/javascript
$(document).ready(function() {
$(#show_messages_div).append('h2/h2');});
/script
...
div id=show_messages_div width=300/div
[jQuery] Mootools tooltip used inside of jquery??
Hi all,
The code below shows three thumbnails with link and alt text . The
info is coming from the xml file and I'm using $.ajax to place it in
the page.
Now I want to add a tooltip that is using Mootools.
I have to add title=The tooltip::I want to read class=tipz to the
div (or to the image, changing the function) in order to use the
tooltip.
But when generating the code dynamically using $.ajax, the tooltip
code will work always for Safari (though it only shows half the
tooltip), but just sometimes for IE and Firefox.
When it does not work, the text shows like a normal alt tag text.
Using IE or Firefox just keep reloading the page and put your mouse
over the thumbnails to test it, you'll see what I mean.
I'm adding an example at the bottom of the page (the div called
example) so you can see how nicely it works in a static div.
Can it be done? Can I add the tooltip to the dynamically generated
code? Seems that the tooltip code go wrong when acts before the div is
created .. is that the problem? how can I solve it?
Thanks a ton!
script type=text/javascript src=http://player27.narrowstep.tv/
assets/players/4351/xml/jquery.js/script
script language=javascript type=text/ecmascript src=http://
www.vivocom.tv/js/moo1.2.js/script
style
#thumb1{
position: absolute;
width:82px;
height:62px;
top:16px;
left:5px;
}
#thumb2{
position: absolute;
width:82px;
height:62px;
top:16px;
left:88px;
}
#thumb3{
position: absolute;
width:82px;
height:62px;
top:16px;
left:171px;
}
.tip{ width:139px; font-
family:arial; COLOR: #fff; line-height: 16px; }
.tip-top{ }
.tip-title { PADDING-RIGHT: 8px;
PADDING-LEFT: 8px; FONT-FAMILY:Arial; FONT-WEIGHT: bold; FONT-SIZE:
12px; BACKGROUND: url(http://www.vivocom.tv/images/smoke.png) left
top; PADDING-BOTTOM: 4px; MARGIN: 0px; COLOR: #ff2228; PADDING-TOP:
8px }
.tip-text { PADDING-RIGHT: 8px;
PADDING-LEFT: 8px; FONT-FAMILY:Arial; FONT-SIZE: 11px; BACKGROUND: url
(http://www.vivocom.tv/images/smoke.png) right bottom; PADDING-BOTTOM:
8px; PADDING-TOP: 4p}
.tip-bottom { }
#example{
position: absolute;
width:100px;
height:100px;
top:96px;
left:171px;
}
/style
/style
script
window.addEvent('domready',function(){
//store titles and text
$$('div.tipz').each(function(element,index) {
var content = element.get
('title').split('::');
element.store('tip:title', content
[0]);
element.store('tip:text', content[1]);
});
//create the tooltips
var tipz = new Tips('.tipz',{
className: 'tipz',
fixed: false,
hideDelay: 50,
showDelay: 50
});
})
jQuery.ajax({
type: GET,
url: myxml.xml,
dataType: xml,
success: function(xml) {
jQuery(xml).find('item').each
(function(){
var number = jQuery
(this).find('number').text();
var alt = jQuery
(this).find('alt').text();
var ids = jQuery
(this).find('ids').text();
var thumb = jQuery
(this).find('thumb').text();
jQuery('div title='+alt+' class=tipz id=thumb'+number
+'/div').html('a target=_parent href=http://www.amazon.com/
music-rock-classical-pop-jazz/b?ie=UTF8node='+ids+'img src=http://
player27.narrowstep.tv/assets/players/4351/xml/images/'+thumb+'.jpg
alt='+alt+' width=82 height=62 border=0 /a').appendTo
('#content');
});
}
});
/script
/head
body
div id=content
/div
brbr
div id=example title=The tooltip::I want to read class=tipzPut
your mouse over here img src=http://player27.narrowstep.tv/assets/
players/4350/images/tip.jpg border=0/div
// the xml file
below/
?xml version=1.0 encoding=iso-8859-1?
myxml
item
thumbthumb1/thumb
ids5171/ids
altSome text 1/alt
number1/number
/item
item
thumbthumb2/thumb
ids5172/ids
altSome text 2/alt
number2/number
/item
[jQuery] Re: jquery append() works for local but not when loaded from server side? the same html file
phew! after wasting half of day on this subtle bug I finally figured
it out, I'll put it here in case others run into the same issue. I
spent most of my time playing around on client side with firebug,
everything seems just fine, but once I append some html tag, it does
nothing. when I fell back to the append example from the jquery
website and loaded it from the server side, firefox displayed it as an
XML! then I checked the server side, found the server returns the
webpage with mimetype=application/xhtml+xml, then I removed it and
It worked.
On Jul 6, 4:05 pm, Slowness Chen slowness.c...@gmail.com wrote:
when I load the html from server side if I append pure text like $
(#show_messages_div).append(''); it works, but not if I append
html like $(#show_messages_div).append('h2/h2');
On Jul 6, 2:24 pm, Slowness Chen slowness.c...@gmail.com wrote:
by setting a breakpoint, I made sure the $
(#show_messages_div).append(litest/li); line is executed, but
nothing happens, but if copy this line and execute it in the console,
it works, this is so weird.
On Jul 6, 1:16 pm, Slowness Chen slowness.c...@gmail.com wrote:
the html is like the following. it works fine if I load it as a local
html file, but when I load it from a server, it doesn't, I printed $
(#show_messages_div).html() in console but it showed nothing. it
just doesn't make any sense to me. I tried searching around but found
nothing. can anybody give me a clue? thanks.
BTW:when I load it from server side, it shows nothing but if I type $
(#show_messages_div).append(dfdfdf) in console, it works
...
script type=text/javascript
$(document).ready(function() {
$(#show_messages_div).append('h2/h2');});
/script
...
div id=show_messages_div width=300/div
[jQuery] Re: Remove an li
$(this).nextAll('.jcarousel-item-placeholder').remove();
http://docs.jquery.com/Selectors
On Jul 6, 1:05 am, expresso dschin...@gmail.com wrote:
I want to remove the following li and any after that which have the
class jcarousel-item-placeholder in them
li class=jcarousel-item jcarousel-item-horizontal jcarousel-item-4
jcarousel-item-4-horizontal jcarousel-item-placeholder jcarousel-item-
placeholder-horizontal jcarouselindex=4/
I'm not sure how to go about this.
[jQuery] Re: Mootools tooltip used inside of jquery??
Stick to a single framework.. avoid confusion and save your users'
bandwidth. You should either convert your jQ code to mootools or use a
jQuery tooltip plugin.
And the whole thing you posted is unreadable, please use a sharing
site like jsbin.com or snipt.org :)
On Jul 6, 5:10 am, Lleoun adoming...@vivocom.es wrote:
Hi all,
The code below shows three thumbnails with link and alt text . The
info is coming from the xml file and I'm using $.ajax to place it in
the page.
Now I want to add a tooltip that is using Mootools.
I have to add title=The tooltip::I want to read class=tipz to the
div (or to the image, changing the function) in order to use the
tooltip.
But when generating the code dynamically using $.ajax, the tooltip
code will work always for Safari (though it only shows half the
tooltip), but just sometimes for IE and Firefox.
When it does not work, the text shows like a normal alt tag text.
Using IE or Firefox just keep reloading the page and put your mouse
over the thumbnails to test it, you'll see what I mean.
I'm adding an example at the bottom of the page (the div called
example) so you can see how nicely it works in a static div.
Can it be done? Can I add the tooltip to the dynamically generated
code? Seems that the tooltip code go wrong when acts before the div is
created .. is that the problem? how can I solve it?
Thanks a ton!
script type=text/javascript src=http://player27.narrowstep.tv/
assets/players/4351/xml/jquery.js/script
script language=javascript type=text/ecmascript
src=http://www.vivocom.tv/js/moo1.2.js;/script
style
#thumb1{
position: absolute;
width:82px;
height:62px;
top:16px;
left:5px;
}
#thumb2{
position: absolute;
width:82px;
height:62px;
top:16px;
left:88px;
}
#thumb3{
position: absolute;
width:82px;
height:62px;
top:16px;
left:171px;
}
.tip { width:139px; font-
family:arial; COLOR: #fff; line-height: 16px; }
.tip-top { }
.tip-title { PADDING-RIGHT: 8px;
PADDING-LEFT: 8px; FONT-FAMILY:Arial; FONT-WEIGHT: bold; FONT-SIZE:
12px; BACKGROUND: url(http://www.vivocom.tv/images/smoke.png) left
top; PADDING-BOTTOM: 4px; MARGIN: 0px; COLOR: #ff2228; PADDING-TOP:
8px }
.tip-text { PADDING-RIGHT: 8px;
PADDING-LEFT: 8px; FONT-FAMILY:Arial; FONT-SIZE: 11px; BACKGROUND: url
(http://www.vivocom.tv/images/smoke.png) right bottom; PADDING-BOTTOM:
8px; PADDING-TOP: 4p}
.tip-bottom { }
#example{
position: absolute;
width:100px;
height:100px;
top:96px;
left:171px;
}
/style
/style
script
window.addEvent('domready',function(){
//store titles and text
$$('div.tipz').each(function(element,index) {
var content = element.get
('title').split('::');
element.store('tip:title', content
[0]);
element.store('tip:text', content[1]);
});
//create the tooltips
var tipz = new Tips('.tipz',{
className: 'tipz',
fixed: false,
hideDelay: 50,
showDelay: 50
});
})
jQuery.ajax({
type: GET,
url: myxml.xml,
dataType: xml,
success: function(xml) {
jQuery(xml).find('item').each
(function(){
var number = jQuery
(this).find('number').text();
var alt = jQuery
(this).find('alt').text();
var ids = jQuery
(this).find('ids').text();
var thumb = jQuery
(this).find('thumb').text();
jQuery('div title='+alt+' class=tipz id=thumb'+number
+'/div').html('a target=_parent href=http://www.amazon.com/
music-rock-classical-pop-jazz/b?ie=UTF8node='+ids+'img src=http://
player27.narrowstep.tv/assets/players/4351/xml/images/'+thumb+'.jpg
alt='+alt+' width=82 height=62 border=0 /a').appendTo
('#content');
});
}
});
/script
/head
body
div id=content
/div
brbr
div id=example title=The tooltip::I want to read class=tipzPut
your mouse over here img src=http://player27.narrowstep.tv/assets/
[jQuery] Re: Mootools tooltip used inside of jquery??
Thanks Ricardo. And sorry for not sticking, this is quite urgent and
didn't know who could help me.
I have to use Mootols tooltip .. so how can I convert my jQuery code
to mootools? haven't I done it yet?
The code is here:
http://www.vivocomtech.net/vidzapper/jQuery_andMoo_tooltip.rar
(2 kb weight in two files, one .htm and the other .xml)
Thanks once again!
Ricardo escribi:
Stick to a single framework.. avoid confusion and save your users'
bandwidth. You should either convert your jQ code to mootools or use a
jQuery tooltip plugin.
And the whole thing you posted is unreadable, please use a sharing
site like jsbin.com or snipt.org :)
On Jul 6, 5:10am, Lleoun adoming...@vivocom.es wrote:
Hi all,
The code below shows three thumbnails with link and alt text . The
info is coming from the xml file and I'm using $.ajax to place it in
the page.
Now I want to add a tooltip that is using Mootools.
I have to add title="The tooltip::I want to read" class="tipz" to the
div (or to the image, changing the function) in order to use the
tooltip.
But when generating the code dynamically using $.ajax, the tooltip
code will work always for Safari (though it only shows half the
tooltip), but just sometimes for IE and Firefox.
When it does not work, the text shows like a normal alt tag text.
Using IE or Firefox just keep reloading the page and put your mouse
over the thumbnails to test it, you'll see what I mean.
I'm adding an example at the bottom of the page (the div called
example) so you can see how nicely it works in a static div.
Can it be done? Can I add the tooltip to the dynamically generated
code? Seems that the tooltip code go wrong when acts before the div is
created .. is that the problem? how can I solve it?
Thanks a ton!
script type="text/_javascript_" src="" class="moz-txt-link-rfc2396E" href="http://player27.narrowstep.tv/assets/players/4351/xml/jquery.js">"http://player27.narrowstep.tv/
assets/players/4351/xml/jquery.js"/script
script language="_javascript_" type="text/ecmascript" src="" class="moz-txt-link-rfc2396E" href="http://www.vivocom.tv/js/moo1.2.js">"http://www.vivocom.tv/js/moo1.2.js"/script
style
#thumb1{
position: absolute;
width:82px;
height:62px;
top:16px;
left:5px;
}
#thumb2{
position: absolute;
width:82px;
height:62px;
top:16px;
left:88px;
}
#thumb3{
position: absolute;
width:82px;
height:62px;
top:16px;
left:171px;
}
.tip { width:139px; font-
family:arial; COLOR: #fff; line-height: 16px; }
.tip-top{ }
.tip-title {PADDING-RIGHT: 8px;
PADDING-LEFT: 8px; FONT-FAMILY:Arial; FONT-WEIGHT: bold; FONT-SIZE:
12px; BACKGROUND: url(http://www.vivocom.tv/images/smoke.png) left
top; PADDING-BOTTOM: 4px; MARGIN: 0px; COLOR: #ff2228; PADDING-TOP:
8px }
.tip-text{PADDING-RIGHT: 8px;
PADDING-LEFT: 8px; FONT-FAMILY:Arial; FONT-SIZE: 11px; BACKGROUND: url
(http://www.vivocom.tv/images/smoke.png) right bottom; PADDING-BOTTOM:
8px; PADDING-TOP: 4p}
.tip-bottom { }
#example{
position: absolute;
width:100px;
height:100px;
top:96px;
left:171px;
}
/style
/style
script
window.addEvent('domready',function(){
//store titles and text
$$('div.tipz').each(function(element,index) {
var content = element.get
('title').split('::');
element.store('tip:title', content
[0]);
element.store('tip:text', content[1]);
});
//create the tooltips
var tipz = new Tips('.tipz',{
className: 'tipz',
fixed: false,
hideDelay: 50,
showDelay: 50
});
})
jQuery.ajax({
type: "GET",
url: "myxml.xml",
dataType: "xml",
success: function(xml) {
jQuery(xml).find('item').each
(function(){
var number = jQuery
(this).find('number').text();
var alt = jQuery
(this).find('alt').text();
var ids = jQuery
(this).find('ids').text();
var thumb = jQuery
(this).find('thumb').text();
jQuery('div title="'+alt+'" class="tipz" id="thumb'+number
+'"/div').html('a target="_parent" href="" class="moz-txt-link-rfc2396E" href="http://www.amazon.com/music-rock-classical-pop-jazz/b?ie=UTF8='+ids+'">"http://www.amazon.com/
music-rock-classical-pop-jazz/b?ie=UTF8node='+ids+'"img src="" class="moz-txt-link-rfc2396E" href="http://player27.narrowstep.tv/assets/players/4351/xml/images/'+thumb+'.jpg">"http://
player27.narrowstep.tv/assets/players/4351/xml/images/'+thumb+'.jpg"
alt="'+alt+'" width=82 height=62 border=0 /a').appendTo
('#content');
});
}
});
/script
/head
body
div id="content"
/div
brbr
div id="example" title="The
[jQuery] Multiple external controls...
Does jCarousel have the ability to have multiple carousels with multiple external controls on one page? It seems that all of the callbacks that you initialize control only one specific carousel. There is no way differentiate between carousels even if you were able to decipher which carousel is active in the carousel array it still does not allow you to control a specific carousel with a specific callback function.
[jQuery] Problem with SlideToggle in Safari 4
Hi, I have set up SlideToggle on my website to expand a div. When the div expands, it pushes the rest of the page content down the page. However, when I collapse the div the rest of the page content doesn't return back up the page and I am left with a gap where the expanding div was. This problem only seems to be in Safari 4 as in Firefox the rest of the page moves up and down with the div. Can anyone think of what may be causing this problem? Thank you.
[jQuery] jQuery progress bar
Hi, I am using jQuery progress bar, it is working fine. i want to blur(non function) background actions, please suggest me how to do this. Thanks, Haranal.
[jQuery] the Event fix should add two fixed properties:layerX and layerY.
the Event Fix method should add two fixed properties:layerX and
layerY.
and now I have to write a little more:
el.click(function(e){
e = e.originalEvent;
var x = e.layerX || e.offsetX;
alert(x);
});
[jQuery] [autocomplete] focus issue.
Hi,
I'm wondering that what is the purpose of the field.focus() line
inside the Autocompleter.Selection function in the autocomplete
plugin.
$.Autocompleter.Selection = function(field, start, end) {
/*...*/
field.focus();
};
Because with that line the autocomplete has some very bizarre (imo)
idea of locking the focus to the field that fired the autocomplete
even if the user has decided not to select any of the items and has
instead clicked on another field.
You can see this in: http://jquery.bassistance.de/autocomplete/demo/
if you click on a field, start typing and then proceed to click on
another field instead of choosing anything from the autosuggestions.
So I'm wondering if there's a reason for that code and if so, what is
it? And more importantly, is it relevant if I *only* develop for FF.
[jQuery] jQuery progress bar
Hi, I am using jQuery progress bar it is working fine, here i want to stop using any background action up to completion of progress bar. Please advise me Thanks, Haranal
[jQuery] Looping through all the selected checkboxes
This is what i have. It does not correctly add two values when two
checkboxes are checked. It should add up to 160 but it adds up to 20
instead! any ideas?
Thanks
Patrick
labelinput type=checkbox name=additionals
id=NutsandBoltsPreconference value=150 / Nuts and Bolts
Preconference/labelbr/
labelinput type=checkbox name=additionals id=TestAdd
value=10 / TestAdd/label
$('input[name=additionals]:checked').each(function() {
amountdue += parseFloat( $('input[name=additionals]:checked').val
() );
});
[jQuery] [validate] problem usind rules(add) with classes
Hi, I am trying to use $(.euro).rules(add, digits) for my form but it seems that only the first matching input field with class euro is being validated using the rule digits. my form looks like this: input name=costs[1] value= class=euro input name=costs[2] value= class=euro ... This is a generated form with a changing number of input fields so I thought it would be the best to use a class for all fields to apply a validation rule. But apparently the rule is only applied to the first input field when using the code above. I'm not sure if this is a bug or if I just understand something wrong. What is the recommended way to apply a rule to a changing number of objects? Thanks, Marcus
[jQuery] Re: Getting a variable out of a function
Hi,
the function You create, is a callback method. When the task is done,
the callback gets called. You need to update the HTML of the TEST in
the callback. Impossible to use return value of a callback in code
which assigns it.
$('.TEST').html( false );
$('.menulink').mouseover( function(active) {
$('.TEST').html( true );
});
Hope that clarifies !
--
Henri Hovi
http://www.patidure.com
On Jul 4, 6:02 pm, pixelvoodoo webdesigner.p...@googlemail.com
wrote:
Hi,
New to JQuery and hope this question has an easy solution.
At present I am trying to assign a global variable from a function
which is called on a mouseover event, fired by going over a hyperlink
with a specific class.
The code:
[b] active = false
$('.menulink').mouseover( function(active) {
active = true
return active
});
$('.TEST').html( active )[/b]
At present I keeping getting undefined errors and I can't figure out
why.
Would appreciate any help!
Chris
[jQuery] Re: Superfish 1.4.8 w/ Supposition
In the changelog.txt for Superfish it is said that in 1.4.2:
attach everything to jQuery.fn.superfish to clean up
jQuery
namespace
So I made the following changes in supposition.js v0.2 and it seems to
work fine with Superfish 1.4.8 and Supersubs:
line 57:
var o = $.superfish.o[this.serial]; /* get this menu's
options */
var o = $.fn.superfish.o[this.serial]; /* get this
menu's options
*/
line 64:
$.extend($.superfish.o[this.serial],{
$.extend($.fn.superfish.o[this.serial],{
Cheers,
[jQuery] Re: [autocomplete] focus issue.
The call itself makes sense - when selecting text within the field,
the field should have focus. But the call to $.Autocomplete.Selection
in that case is a bug, as there is nothing to select.
Jörn
2009/7/6 Lauri Suoperä lauri.suop...@gmail.com:
Hi,
I'm wondering that what is the purpose of the field.focus() line
inside the Autocompleter.Selection function in the autocomplete
plugin.
$.Autocompleter.Selection = function(field, start, end) {
/*...*/
field.focus();
};
Because with that line the autocomplete has some very bizarre (imo)
idea of locking the focus to the field that fired the autocomplete
even if the user has decided not to select any of the items and has
instead clicked on another field.
You can see this in: http://jquery.bassistance.de/autocomplete/demo/
if you click on a field, start typing and then proceed to click on
another field instead of choosing anything from the autosuggestions.
So I'm wondering if there's a reason for that code and if so, what is
it? And more importantly, is it relevant if I *only* develop for FF.
[jQuery] Re: [validate] problem usind rules(add) with classes
Similar to the validate-method, the rules method works with just one
element. This should work as a workaround:
$(.euro).each(function() {
$(this).rules(add, digits)
});
Jörn
On Mon, Jul 6, 2009 at 12:39 PM,
macronommarcus.stratm...@googlemail.com wrote:
Hi,
I am trying to use
$(.euro).rules(add, digits)
for my form but it seems that only the first matching input field with
class euro is being validated using the rule digits. my form looks
like this:
input name=costs[1] value= class=euro
input name=costs[2] value= class=euro
...
This is a generated form with a changing number of input fields so I
thought it would be the best to use a class for all fields to apply a
validation rule. But apparently the rule is only applied to the first
input field when using the code above. I'm not sure if this is a bug
or if I just understand something wrong.
What is the recommended way to apply a rule to a changing number of
objects?
Thanks,
Marcus
[jQuery] Re: Reload events after ajax
this should help:
http://docs.jquery.com/Frequently_Asked_Questions#Why_do_my_events_stop_working_after_an_AJAX_request.3F
--Karl
Karl Swedberg
www.englishrules.com
www.learningjquery.com
On Jul 5, 2009, at 8:10 PM, misiek wrote:
Hello,
My code:
html:
div class=ajax_here
div class=breadcrumb
a href=http://page.com; class=backlinkAlbums/a » a
href=http://page.com?album=1; class=backlinkAlbum 1/a »
cxzcc.jpg
/div
div class=prevnext
div class=prev nawia
href=http://page.com?album=1amp;photo=1;Previous Photo/a/div
div class=next nawia
href=http://page.com?album=1amp;photo=9;Next Photo/a/div
/div
div class=blablabla
[...]
/div
/div
js:
$().ready(function (){
$(div.nawi a).each( function(i) {
$(this).unbind(click);
$(this).bind(click, function(e){
var tmp = $(this).attr(href);
var search_wz = tmp.search(/\?/);
var result_url = tmp.substring(0,search_wz);
var result_data = tmp.substring(search_wz+1,tmp.length);
e.preventDefault();
$.ajax({
url: result_url,
data: result_data + 'ajax=1',
type: 'GET',
success: function(results) {
$(div.ajax_here).html(results);
}
});
});
});
});
Question: could you tell my how to reload binds for events? I mean how
to add binds to a which is/are returned from Ajax request.
I have already tried with $(div.nawi a).change,load ,but without
positive results.
__ Information from ESET NOD32 Antivirus, version of virus
signature database 4219 (20090705) __
The message was checked by ESET NOD32 Antivirus.
http://www.eset.com
[jQuery] Always escape with two backslashes?
Hello!
I read in the documentation, the special characters like ':', we must
escape with TWO backslashes. But not always:
script type=text/javascript
function Nyom() {
if ($('#pipa\\:x').is(':checked')) {
$(':checkbox[id^=pipa\:x\:]').attr('checked','checked');
} else {
$(':checkbox[id^=pipa\:x\:]').removeAttr('checked');
}
}
/script
pinput type=checkbox id=pipa:x onclick=Nyom()//p
pinput type=checkbox id=pipa:x:1//p
pinput type=checkbox id=pipa:x:2//p
pinput type=checkbox id=pipa:x:3//p
In form filters only works, if i used only ONE backslash to escape. Why?
Lay
[jQuery] Re: Looping through all the selected checkboxes
It's because inside your .each statement you are re-selecting *all*
checked boxes again, so
$('input[name=additionals]:checked').each(function() {
amountdue += parseFloat( $(this).val() );
});
Check out the documentation of .each(), where it will explain that
inside the loop, this is the current DOM item being enumerated by
the each()
On Jul 6, 1:16 am, tkrn psta...@etechrongroup.com wrote:
This is what i have. It does not correctly add two values when two
checkboxes are checked. It should add up to 160 but it adds up to 20
instead! any ideas?
Thanks
Patrick
labelinput type=checkbox name=additionals
id=NutsandBoltsPreconference value=150 / Nuts and Bolts
Preconference/labelbr/
labelinput type=checkbox name=additionals id=TestAdd
value=10 / TestAdd/label
$('input[name=additionals]:checked').each(function() {
amountdue += parseFloat( $('input[name=additionals]:checked').val
() );
});
[jQuery] Re: Function to parse query string from URL?
http://plugins.jquery.com/project/parseQuery Perfect, thank you!
[jQuery] Re: JCarousel not rendering images in IE
The examples seem to work fine on http://sorgalla.com/projects/jcarousel/ but for some reason my implementation shows the placeholders but no images are rendered. I looked at the mark-up and the html is fine. It works in FireFox, Safari, and Chrome just fine and so it's weird that my implementation would be any different in rendering in IE 8 especially when I haven't even touched the source nor the .css except for making the carousel wider which has nothing to do with this problem. Even when I take out the style sheet changes I made (Which are only 2) and use the same base style sheet they are using that has worked in IE 8 with their examples, mine still does not render the images. here's example source. But I don't think the source is the issue, it might be something in the carousel .js. I don't get it. div /div div div class=jcarousel-skin-ie7 div class=jcarousel-container jcarousel-container-horizontal style=display: block; height: 220px; width: 300px; div class=jcarousel-prev jcarousel-prev-horizontal style=display: block; disabled=false/ div class=jcarousel-next jcarousel-next-horizontal style=display: block; disabled=false/ div class=jcarousel-clip jcarousel-clip-horizontal style=width: 300px; height: 220px; ul id=mycarousel class=jcarousel-list jcarousel-list-horizontal style=height: 220px; width: 2884px; left: -152px; li class=jcarousel-item jcarousel-item-horizontal jcarousel-item-1 jcarousel-item-1-horizontal jcarouselindex=1 div class=CarouselItem p img alt= src=http://www.xxx.com/image/256.jpg/ /p p /p p$20.95/p div/ /div /li li class=jcarousel-item jcarousel-item-horizontal jcarousel-item-2 jcarousel-item-2-horizontal jcarouselindex=2 /li li class=jcarousel-item jcarousel-item-horizontal jcarousel-item-3 jcarousel-item-3-horizontal jcarouselindex=3 /li li class=jcarousel-item jcarousel-item-horizontal jcarousel-item-4 jcarousel-item-4-horizontal jcarouselindex=4 /li li class=jcarousel-item jcarousel-item-horizontal jcarousel-item-5 jcarousel-item-5-horizontal jcarouselindex=5 /li li class=jcarousel-item jcarousel-item-horizontal jcarousel-item-6 jcarousel-item-6-horizontal jcarouselindex=6 /li li class=jcarousel-item jcarousel-item-horizontal jcarousel-item-7 jcarousel-item-7-horizontal jcarouselindex=7 /li li class=jcarousel-item jcarousel-item-horizontal jcarousel-item-8 jcarousel-item-8-horizontal jcarouselindex=8 /li li class=jcarousel-item jcarousel-item-horizontal jcarousel-item-9 jcarousel-item-9-horizontal jcarouselindex=9 /li li class=jcarousel-item jcarousel-item-horizontal jcarousel-item-10 jcarousel-item-10-horizontal jcarouselindex=10 /li li class=jcarousel-item jcarousel-item-horizontal jcarousel-item-11 jcarousel-item-11-horizontal jcarouselindex=11 /li li class=jcarousel-item jcarousel-item-horizontal jcarousel-item-12 jcarousel-item-12-horizontal jcarouselindex=12 /li li class=jcarousel-item jcarousel-item-horizontal jcarousel-item-13 jcarousel-item-13-horizontal jcarouselindex=13 /li li class=jcarousel-item jcarousel-item-horizontal jcarousel-item-14 jcarousel-item-14-horizontal jcarouselindex=14 /li li class=jcarousel-item jcarousel-item-horizontal jcarousel-item-15 jcarousel-item-15-horizontal jcarouselindex=15 /li li class=jcarousel-item jcarousel-item-horizontal jcarousel-item-16 jcarousel-item-16-horizontal jcarouselindex=16 /li li class=jcarousel-item jcarousel-item-horizontal jcarousel-item-17 jcarousel-item-17-horizontal jcarouselindex=17 /li /ul /div /div /div /div On Jul 2, 12:12 am, expresso dschin...@gmail.com wrote: Has anyone had a problem where JCarousel does not render images in IE 8 but works fine in FF?
[jQuery] unsubscribe
Date: Sat, 4 Jul 2009 09:49:03 -0700 Subject: [jQuery] Re: Inclusion of external scripts (best approach) From: ollo...@web.de To: jquery-en@googlegroups.com Will check that one now. Thanks once more, Karl! On 4 Jul., 17:41, Karl Swedberg k...@englishrules.com wrote: --Karl Karl Swedbergwww.englishrules.comwww.learningjquery.com On Jul 4, 2009, at 5:49 AM, north wrote: As far as elements getting hidden goes, there is a pretty simple workaround. You can put a one liner in the head ( document.documentElement.className = 'js'; ) and the rest of your scripts at the end of the body. I discuss this approach at the end of this article: http://www.learningjquery.com/2008/10/1-way-to-avoid-the-flash-of-uns... _ Get 30 Free Emoticons for your Windows Live Messenger http://www.livemessenger-emoticons.com/funfamily/en-ie/
[jQuery] event.stopPropagation() is preventing a live event on a child element
As far as I understood, stopPropagation() is supposed to stop events
bubbling 'up' though the element tree (through parent elements). Eg.
If I use stopPropagation() on a click event on an anchor element in a
list, the event would not be triggered on the list.
In my code I have a popup div, that needs to have stopPropagation(),
as a click on the document (everywhere other than the popup) will hide
it.
When I add an element to the popup that has a live click event, the
live click event is never called, even though it is a child element of
the popup. Shouldn't the live click get called first? If I remove the
stopPropagation all is well..
some code:
$('#a_test_link').live(click, function(e){
e.preventDefault();
alert('done!');
});
$('#popup').click(function(e){
e.stopPropagation();
});
any help gratefully received
[jQuery] error jquery-1.3.2.js(line 3633)
I have 3 drop down menu's where is post the value's bij a button.click
(see code below).
But when i push the button i see an error in fire bug POST
http://localhost/agenda nieuw/handler.php 67ms jquery-1.3.2.js(line
3633)
I looked online for awnsers but couldn't find any. Maybe you guys can
help me. Here is my js code.
script type=text/javascript src=jquery-1.3.2.js/
script
script type=text/
javascript
$(document).ready(function() {
$(button).click(function() {
$.post('handler.php', {
jaar:$('#jaar').val(),//jaar means year
maand:$('#maand').val(),//maand means month
week:$('#week').val(),
})
});
});
/script
[jQuery] Re: event.stopPropagation() is preventing a live event on a child element
hmm, the original liveQuery plugin seems to work as expected, so I'm
using that instead.
On Jul 6, 1:31 pm, joeformd joelan...@gmail.com wrote:
As far as I understood, stopPropagation() is supposed to stop events
bubbling 'up' though the element tree (through parent elements). Eg.
If I use stopPropagation() on a click event on an anchor element in a
list, the event would not be triggered on the list.
In my code I have a popup div, that needs to have stopPropagation(),
as a click on the document (everywhere other than the popup) will hide
it.
When I add an element to the popup that has a live click event, the
live click event is never called, even though it is a child element of
the popup. Shouldn't the live click get called first? If I remove the
stopPropagation all is well..
some code:
$('#a_test_link').live(click, function(e){
e.preventDefault();
alert('done!');
});
$('#popup').click(function(e){
e.stopPropagation();
});
any help gratefully received
[jQuery] getJSON callback? does not work with querystring param
This works fine:
$.getJSON(http://localhost:59396/xxxWeb/
CarouselHandler.ashx?action=getproductsids= + ids,
function(data) {
carousel.size(allProductIDs.length);
if (numberOfImagesLeftToShow
numberOfImagesToDisplay) {
first += (numberOfImagesToDisplay -
numberOfImagesLeftToShow);
}
var d = 0;
for (var i = first; i = last; i++) {
if (d != undefined) {
// add data using index of the array
returned by JSON (which starts at 0)
carousel.add(i, decode(data[d].ImageTag));
}
// set to last ProductID showing in Carousel
if (i == last) { lastProductID = parseFloat
(data[d].ProductID); }
d++;
}
}
);
This does not work, I get no pictures rendered after trying to add the
format=jsonjsoncallback=? :
$.getJSON(http://localhost:59396/xxxWeb/
CarouselHandler.ashx?action=getproductsids= + ids +
format=jsonjsoncallback=?,
function(data) {
carousel.size(allProductIDs.length);
if (numberOfImagesLeftToShow
numberOfImagesToDisplay) {
first += (numberOfImagesToDisplay -
numberOfImagesLeftToShow);
}
var d = 0;
for (var i = first; i = last; i++) {
if (d != undefined) {
// add data using index of the array
returned by JSON (which starts at 0)
carousel.add(i, decode(data[d].ImageTag));
}
// set to last ProductID showing in Carousel
if (i == last) { lastProductID = parseFloat
(data[d].ProductID); }
d++;
}
}
);
Same for here, calling to our dev server.
$.getJSON(http://xxxdev/xxx/CarouselHandler.ashx?
action=getproductsids= + ids + format=jsonjsoncallback=?,
function(data) {
No idea why. No errors, nothing.
[jQuery] unsubscribe
unsubscribe
[jQuery] Re: Reload events after ajax
On 6 Lip, 14:17, Karl Swedberg k...@englishrules.com wrote:
this should help:
http://docs.jquery.com/Frequently_Asked_Questions#Why_do_my_events_st...
--Karl
Thank you!
I have mentioned that I have already tried something like this:
JS:
$().ready(function (){
$(div.nawi a).each( function(i) {
$(this).unbind(click);
$(this).bind(click, function(e){
var tmp = $(this).attr(href);
var search_wynik_zapytania = tmp.search(/\?/);
var wynik_url = tmp.substring(0,search_wynik_zapytania);
var wynik_data = tmp.substring(search_wynik_zapytania
+1,tmp.length);
e.preventDefault();
$.ajax({
url: wynik_url,
data: wynik_data + 'ajax=1',
type: 'GET',
success: function(results) {
$(div.ajax_here).html(results);
$(div.nawi a).each( function(i) {
$(this).unbind(click);
$(this).bind(click, function(e){
var tmp = $(this).attr(href);
var search_wynik_zapytania = tmp.search(/\?/);
var wynik_url = tmp.substring(0,search_wynik_zapytania);
var wynik_data = tmp.substring(search_wynik_zapytania
+1,tmp.length);
e.preventDefault();
$.ajax({
url: wynik_url,
data: wynik_data + 'ajax=1',
type: 'GET',
success: function(results) {
$(div.ajax_here).html(results);
}
});
});
});
}
});
});
});
});
I have added almost the same code to Ajax success property, but is
works only two times in row. With third image (after second Ajax
request, it doesn't work). So my question is, how to propagate this
bind to every next ajax's requests? I know that I can copy this code
again and again, but this solution would be very weird and limited...
[...]
My code:
html:
div class=ajax_here
div class=breadcrumb
a href=http://page.com; class=backlinkAlbums/a » a
href=http://page.com?album=1; class=backlinkAlbum 1/a »
cxzcc.jpg
/div
div class=prevnext
div class=prev nawia
href=http://page.com?album=1photo=1;Previous Photo/a/div
div class=next nawia
href=http://page.com?album=1photo=9;Next Photo/a/div
/div
div class=blablabla
[...]
/div
/div
js:
[...]
Question: could you tell my how to reload binds for events? I mean how
to add binds to a which is/are returned from Ajax request.
I have already tried with $(div.nawi a).change,load ,but without
positive results.
__ Information from ESET NOD32 Antivirus, version of virus
signature database 4219 (20090705) __
The message was checked by ESET NOD32 Antivirus.
http://www.eset.com
[jQuery] Re: error jquery-1.3.2.js(line 3633)
Well, firebug shouldn't have cared as much as IE would, because of a
comma inside the list of params in your POST. The last element in an
object can't have a comma.
Also, could you post the HTML?
On Jul 6, 8:49 am, Mark johanns.m...@gmail.com wrote:
I have 3 drop down menu's where is post the value's bij a button.click
(see code below).
But when i push the button i see an error in fire bug
POSThttp://localhost/agendanieuw/handler.php 67ms jquery-1.3.2.js(line
3633)
I looked online for awnsers but couldn't find any. Maybe you guys can
help me. Here is my js code.
script type=text/javascript src=jquery-1.3.2.js/
script
script type=text/
javascript
$(document).ready(function() {
$(button).click(function() {
$.post('handler.php', {
jaar:$('#jaar').val(),//jaar means year
maand:$('#maand').val(),//maand means month
week:$('#week').val(),
})
});
});
/script
[jQuery] Customizing Gaile Carousel: hover and click conflict
I've customized Agile Carousel (I'm using JQuery 1.2.6) to fit what I
need, that is a single slide that rotates with a row of associated
buttons. In the unaltered state, I can click on a button, the slide
show will stop and show the correct slide. Now, when I add a hover
function, the correct slide shows, but the button class is messed up
so it will never show again, and the click no longer works. I've
worked on the hover function until I'm crazy. css only controls the
images for the button rollovers and to show which button is selected
during the slide show, so I guess the hover class for that element is
removed. Any ideas on how to approach this? The click is in a each
loop:
// functions for clicking slide buttons
$(#slide_buttons li).each(function() {
// add click functionality to buttons
$(this).click(function() {
button_class = $(this).attr(class);
change_button_class(button_class);
// declare next_slide_id_number
split_button_class_string = button_class.split
(_);
button_class_string =
split_button_class_string.pop();
next_slide_id_number = parseFloat
(button_class_string);
pause();
skip(next_slide_id_number);
return (false);
}); // click
}); //each
so the usual approach of:
$(#slide_buttons li).removeClass('clicked');
$(this).addClass('clicked');
will not work unless I put this in the hover function, and that
doesn't work there either.
Ideas? I also have other problems with Agile Carousel.
[jQuery] Select List With Multiple Selections Hack
When using a select combo box that has multiple selections enabled, my server was not seeing it as an array. It was only seeing it as a single variable value. All I did to correct this was add [] and the end of the name attribute. Ex. [code]select name=categories[] id=categories multiple=multiple size=4[/code] Now my LAMP server sees this variable as an array in the $_REQUEST Dunno if this is supposed to work like this. Thank you. ~ Shawn
[jQuery] JCarousel not rendering added data in IE 6, 7, or 8!!!!!!!!!!!!! Works in all other browsers
I have not been able to get my JCarousel implementation to show the
added data in IE 6,7, or 8. It works fine in all other
browsers..which is just weird especially when the creator's demos all
run fine in IE (http://sorgalla.com/projects/jcarousel/).
I simply added some simple Javascript logic to my own ItemLoadCallback
functions and the carousel doesn't load images in IE8/IE7 or even IE6
at all when it's fine in all other browsers.
I have valid JSON coming back and it's working fine in FireFox, etc.
otherwise I know I'd have a data parse issue.
Below is part of my itemLoadCallback method that gets the data and
adds it to the Carousel... which again I say my code here works fine
in all other browsers except IE. I even took a look at the lis
produced using firebug and it's definitely valid HTML that I'm seeing
it render in FireFox.
#mycarousel .jcarousel-item-placeholder {
background: transparent url(../images/carousel/ajax-loader.gif)
50% 50% no-repeat;
}
The gif above shows before the data is added (just like his example
here: http://sorgalla.com/projects/jcarousel/examples/dynamic_flickr_api.html)
but is never replaced by the data I add in my itemLoadCallback in
IE!
If I have not changed how your carousel.js works, why would I have any
trouble with IE whatsoever if the examples on your site are running
fine in IE?
function mycarousel_itemAddCallback(carousel, first, last) {
// grab product information
if (ids != 0) {
$.getJSON(http://xxx/xxx/CarouselHandler.ashx?
action=getproductsids= + ids,
function(data) {
carousel.size(allProductIDs.length);
if (numberOfImagesLeftToShow
numberOfImagesToDisplay) {
first += (numberOfImagesToDisplay -
numberOfImagesLeftToShow);
}
var d = 0;
for (var i = first; i = last; i++) {
if (d != undefined) {
// add data using index of the array
returned by JSON (which starts at 0)
carousel.add(i, decode(data[d].ImageTag));
}
// set to last ProductID showing in Carousel
if (i == last) { lastProductID = parseFloat
(data[d].ProductID); }
d++;
}
}
);
}
};
I don't have a live server to show you this, I'm in dev right now
testing this out before we try to roll it live. Obviously I'm stumped
here on the IE issue pertaining to my implementation and I don't see
myself doing anything strange that would cause this not to run in IE!
I'm desperate for some help on this. I cannot get a hold of Jan, the
creator.
[jQuery] (validate) No-URL
I used the URL checker in the Plugins/Validation, to create a no-url
checker. This can be useful to prevent some spam from coming through
in a form.
nourl: function(value, element) {
return this.optional(element) || !(/^(https?|ftp):\/\/[a-z]|
\d|-|\.|_|~|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])|(%[\da-f]{2})|[!
\$'\(\)\*\+,;=]|:)*@)?(((\d|[1-9]\d|1\d\d|2[0-4]\d|25[0-5])\.(\d|
[1-9]\d|1\d\d|2[0-4]\d|25[0-5])\.(\d|[1-9]\d|1\d\d|2[0-4]\d|25[0-5])\.
(\d|[1-9]\d|1\d\d|2[0-4]\d|25[0-5]))|((([a-z]|\d|[\u00A0-\uD7FF\uF900-
\uFDCF\uFDF0-\uFFEF])|(([a-z]|\d|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-
\uFFEF])([a-z]|\d|-|\.|_|~|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])*
([a-z]|\d|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])))\.)+(([a-z]|
[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])|(([a-z]|[\u00A0-\uD7FF
\uF900-\uFDCF\uFDF0-\uFFEF])([a-z]|\d|-|\.|_|~|[\u00A0-\uD7FF\uF900-
\uFDCF\uFDF0-\uFFEF])*([a-z]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-
\uFFEF])))\.?)(:\d*)?)(\/((([a-z]|\d|-|\.|_|~|[\u00A0-\uD7FF\uF900-
\uFDCF\uFDF0-\uFFEF])|(%[\da-f]{2})|[!\$'\(\)\*\+,;=]|:|@)+(\/(([a-z]|
\d|-|\.|_|~|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])|(%[\da-f]{2})|[!
\$'\(\)\*\+,;=]|:|@)*)*)?)?(\?((([a-z]|\d|-|\.|_|~|[\u00A0-\uD7FF
\uF900-\uFDCF\uFDF0-\uFFEF])|(%[\da-f]{2})|[!\$'\(\)\*\+,;=]|:|@)|
[\uE000-\uF8FF]|\/|\?)*)?(\#((([a-z]|\d|-|\.|_|~|[\u00A0-\uD7FF\uF900-
\uFDCF\uFDF0-\uFFEF])|(%[\da-f]{2})|[!\$'\(\)\*\+,;=]|:|@)|\/|\?)*)?$/
i.test(value));},
[jQuery] Re: UI Sortable - Limit drag to item header
Try using the handle option. http://jqueryui.com/demos/sortable/#option-handle -- Hector On Sun, Jun 21, 2009 at 5:59 AM, Collaborate orhed...@gmail.com wrote: Hi! I'm wondering how I can limit the dragability of an sortable item, to ex. a element inside the item. Meaning, I only want the item to sort when the header of the item is draged. Is there a simple way to do this, or do I have to modify core code/ create a helper to accomplish this functionallity? Have read the docs, but haven't found anything that mentions this.. Best regards, Robin
[jQuery] Re: getJSON callback? does not work with querystring param
Adding a jsoncallback=? or callback=? got rid of the Access to
restricted URI denied code: 1012 but I get no data showing in my
plug-in when adding either of those querystring params to my url. So
I don't get it. I thought that it's supposed to automatically
replace ? with function(data) in my case?? Do I need to send
something back in the response or something?? I ask because certain
APIs such as yahoo require an _ in front. But so does this mean I
also need to supply something in my json response? I thought all you
need to do is just add the callback param in your request.
On Jul 6, 9:44 am, expresso dschin...@gmail.com wrote:
This works fine:
$.getJSON(http://localhost:59396/xxxWeb/
CarouselHandler.ashx?action=getproductsids= + ids,
function(data) {
carousel.size(allProductIDs.length);
if (numberOfImagesLeftToShow
numberOfImagesToDisplay) {
first += (numberOfImagesToDisplay -
numberOfImagesLeftToShow);
}
var d = 0;
for (var i = first; i = last; i++) {
if (d != undefined) {
// add data using index of the array
returned by JSON (which starts at 0)
carousel.add(i, decode(data[d].ImageTag));
}
// set to last ProductID showing in Carousel
if (i == last) { lastProductID = parseFloat
(data[d].ProductID); }
d++;
}
}
);
This does not work, I get no pictures rendered after trying to add the
format=jsonjsoncallback=? :
$.getJSON(http://localhost:59396/xxxWeb/
CarouselHandler.ashx?action=getproductsids= + ids +
format=jsonjsoncallback=?,
function(data) {
carousel.size(allProductIDs.length);
if (numberOfImagesLeftToShow
numberOfImagesToDisplay) {
first += (numberOfImagesToDisplay -
numberOfImagesLeftToShow);
}
var d = 0;
for (var i = first; i = last; i++) {
if (d != undefined) {
// add data using index of the array
returned by JSON (which starts at 0)
carousel.add(i, decode(data[d].ImageTag));
}
// set to last ProductID showing in Carousel
if (i == last) { lastProductID = parseFloat
(data[d].ProductID); }
d++;
}
}
);
Same for here, calling to our dev server.
$.getJSON(http://xxxdev/xxx/CarouselHandler.ashx?
action=getproductsids= + ids + format=jsonjsoncallback=?,
function(data) {
No idea why. No errors, nothing.
[jQuery] Table cell formatting (highlighting) upon ajax reload based on cell content?
Need some suggestions on how-to control cell(s) format on an ajax reload. The server-side program can convey necessary coding with each ajax load. I'm sure there are numerous ways to do this, but I just need some ideas to get started. Ransom Fitch old-tyme programmer, neophyte with javascript
[jQuery] Re: JCarousel not rendering added data in IE 6, 7, or 8!!!!!!!!!!!!! Works in all other browsers
I just tested this out with adding an alert(data.length); In FireFox,
the alert comes right up. But in IE 6,7,8, it never hits the alert:
$.getJSON(http://localhost:59396/xxx/CarouselHandler.ashx?
action=getproductsids= + ids,
function(data) {
alert(data.length);
carousel.size(allProductIDs.length);
if (numberOfImagesLeftToShow
numberOfImagesToDisplay) {
first += (numberOfImagesToDisplay -
numberOfImagesLeftToShow);
}
var d = 0;
for (var i = first; i = last; i++) {
if (d != undefined) {
// add data using index of the array
returned by JSON (which starts at 0)
carousel.add(i, decode(data[d].ImageTag));
}
// set to last ProductID showing in Carousel
if (i == last) { lastProductID = parseFloat
(data[d].ProductID); }
d++;
}
}
);
is this a jQuery bug?!?!?!?!?!!?
On Jul 6, 10:29 am, expresso dschin...@gmail.com wrote:
I have not been able to get my JCarousel implementation to show the
added data in IE 6,7, or 8. It works fine in all other
browsers..which is just weird especially when the creator's demos all
run fine in IE (http://sorgalla.com/projects/jcarousel/).
I simply added some simple Javascript logic to my own ItemLoadCallback
functions and the carousel doesn't load images in IE8/IE7 or even IE6
at all when it's fine in all other browsers.
I have valid JSON coming back and it's working fine in FireFox, etc.
otherwise I know I'd have a data parse issue.
Below is part of my itemLoadCallback method that gets the data and
adds it to the Carousel... which again I say my code here works fine
in all other browsers except IE. I even took a look at the lis
produced using firebug and it's definitely valid HTML that I'm seeing
it render in FireFox.
#mycarousel .jcarousel-item-placeholder {
background: transparent url(../images/carousel/ajax-loader.gif)
50% 50% no-repeat;
}
The gif above shows before the data is added (just like his example
here:http://sorgalla.com/projects/jcarousel/examples/dynamic_flickr_api.html)
but is never replaced by the data I add in my itemLoadCallback in
IE!
If I have not changed how your carousel.js works, why would I have any
trouble with IE whatsoever if the examples on your site are running
fine in IE?
function mycarousel_itemAddCallback(carousel, first, last) {
// grab product information
if (ids != 0) {
$.getJSON(http://xxx/xxx/CarouselHandler.ashx?
action=getproductsids= + ids,
function(data) {
carousel.size(allProductIDs.length);
if (numberOfImagesLeftToShow
numberOfImagesToDisplay) {
first += (numberOfImagesToDisplay -
numberOfImagesLeftToShow);
}
var d = 0;
for (var i = first; i = last; i++) {
if (d != undefined) {
// add data using index of the array
returned by JSON (which starts at 0)
carousel.add(i, decode(data[d].ImageTag));
}
// set to last ProductID showing in Carousel
if (i == last) { lastProductID = parseFloat
(data[d].ProductID); }
d++;
}
}
);
}
};
I don't have a live server to show you this, I'm in dev right now
testing this out before we try to roll it live. Obviously I'm stumped
here on the IE issue pertaining to my implementation and I don't see
myself doing anything strange that would cause this not to run in IE!
I'm desperate for some help on this. I cannot get a hold of Jan, the
creator.
[jQuery] Re: getJSON callback? does not work with querystring param
For JSONP, the server needs to wrap the response in the supplied
callback. The cross-domain getJSON function is basically appending a
script to the page, with the contents of that script being a function
containing the data you want to pass back. Play around with the URL in
the flickr example from the docs and you can see how the response is
wrapped:
http://api.flickr.com/services/feeds/photos_public.gne?tags=cattagmode=anyformat=jsonjsoncallback=foo
On Jul 6, 7:44 am, expresso dschin...@gmail.com wrote:
This works fine:
$.getJSON(http://localhost:59396/xxxWeb/
CarouselHandler.ashx?action=getproductsids= + ids,
function(data) {
carousel.size(allProductIDs.length);
if (numberOfImagesLeftToShow
numberOfImagesToDisplay) {
first += (numberOfImagesToDisplay -
numberOfImagesLeftToShow);
}
var d = 0;
for (var i = first; i = last; i++) {
if (d != undefined) {
// add data using index of the array
returned by JSON (which starts at 0)
carousel.add(i, decode(data[d].ImageTag));
}
// set to last ProductID showing in Carousel
if (i == last) { lastProductID = parseFloat
(data[d].ProductID); }
d++;
}
}
);
This does not work, I get no pictures rendered after trying to add the
format=jsonjsoncallback=? :
$.getJSON(http://localhost:59396/xxxWeb/
CarouselHandler.ashx?action=getproductsids= + ids +
format=jsonjsoncallback=?,
function(data) {
carousel.size(allProductIDs.length);
if (numberOfImagesLeftToShow
numberOfImagesToDisplay) {
first += (numberOfImagesToDisplay -
numberOfImagesLeftToShow);
}
var d = 0;
for (var i = first; i = last; i++) {
if (d != undefined) {
// add data using index of the array
returned by JSON (which starts at 0)
carousel.add(i, decode(data[d].ImageTag));
}
// set to last ProductID showing in Carousel
if (i == last) { lastProductID = parseFloat
(data[d].ProductID); }
d++;
}
}
);
Same for here, calling to our dev server.
$.getJSON(http://xxxdev/xxx/CarouselHandler.ashx?
action=getproductsids= + ids + format=jsonjsoncallback=?,
function(data) {
No idea why. No errors, nothing.
[jQuery] Re: unsubscribe
Everyone, If you want to unsubscribe from this list, please follow the instructions for doing so: You can unsubscribe from a group through the web interface or via email. To unsubscribe through the web interface, just click the Edit my membership link on the right-hand side of the group's homepage at http://groups.google.com/group/jquery-en/ . Then click the Unsubscribe button on the page that appears. To unsubscribe via email, send an email to jquery-en+unsubscr...@googlegroups.com ( paraphrased from http://groups.google.com/support/bin/answer.py?hl=enanswer=46608 ) Thanks, --Karl Karl Swedberg www.englishrules.com www.learningjquery.com On Jul 6, 2009, at 10:55 AM, Jared Henderson wrote: unsubscribe
[jQuery] Re: getJSON callback? does not work with querystring param
If you pass a param to the json call, it gets passed into the
querystring:
$.getJSON(jsdata/customerhandler.ashx, { show: Math.random(),
departmentId: dptId}, customerLoaded);
would be rendered as:
jsdata/customerhandler.ashx?show=0.23231553departmentId=123
the second parameter to the getJson function is the query string
parameters.
[jQuery] Draggable+Sortable and ui.item
I am building a basic draggable+sortable page based on this demo:
http://jqueryui.com/demos/draggable/#sortable
http://jqueryui.com/demos/draggable/#sortableMy sortable list will start
out empty and the user can drag various draggables onto the sortable.
I want to add a delete icon to each of the items that are dragged onto the
sortable so they can be removed. I've tried observing the sortreceive
event and manipulating ui.item, but unfortunately ui.item points to the
original draggable instead of the new element that was added to the
sortable.
Here is my code:
$('ul.selected').sortable({
revert: true
});
$('ul.available li').draggable({
connectToSortable: '.selected',
helper: 'clone',
revert: 'invalid'
});
$('ul.selected, ul.available').disableSelection();
// Attempt to add image to new item in sortable list
$('.selected').bind('sortreceive', function(event, ui) {
$(ui.item).append('img src=delete.png /'); // Does not work -- image
is added to the draggable, not to the sortable's received item
});
Is there another way to get the item that was just added to the sortable?
--
Hector
[jQuery] Re: unsubscribe
$(#GoogleGroup #jquery-en).hide(); - doesn't seem to work either ;-) Thanks for the instructions Karl. On Mon, Jul 6, 2009 at 12:23 PM, Karl Swedberg k...@englishrules.comwrote: Everyone, If you want to unsubscribe from this list, please follow the instructions for doing so: You can unsubscribe from a group through the web interface or via email. To unsubscribe through the web interface, just click the Edit my membership link on the right-hand side of the group's homepage at http://groups.google.com/group/jquery-en/. Then click the Unsubscribe button on the page that appears. To unsubscribe via email, send an email to jquery-en+unsubscr...@googlegroups.com ( paraphrased from http://groups.google.com/support/bin/answer.py?hl=enanswer=46608 ) Thanks, --Karl Karl Swedberg www.englishrules.com www.learningjquery.com On Jul 6, 2009, at 10:55 AM, Jared Henderson wrote: unsubscribe
[jQuery] Re: JCarousel not rendering added data in IE 6, 7, or 8!!!!!!!!!!!!! Works in all other browsers
Tried this instead. Got no errors and the data painted fine in
FireFox. But in IE, it hit my error handler. Again, no idea why in
IE it's complaining. I checked that the json returned is definitely
valued (obviously it has to be because this data is rendering in
FireFox and other browsers) by using the json checker here:
http://www.jsonlint.com/
$.ajax({
type: POST,
url: http://localhost:59396/xxx/CarouselHandler.ashx?
action=getproductsids= + ids,
data: {},
contentType: application/json; charset=utf-8,
dataType: json,
success: function(data) {
alert(data.length);
carousel.size(allProductIDs.length);
if (numberOfImagesLeftToShow
numberOfImagesToDisplay) {
first += (numberOfImagesToDisplay -
numberOfImagesLeftToShow);
}
var d = 0;
for (var i = first; i = last; i++) {
if (d != undefined) {
// add data using index of the array returned
by JSON (which starts at 0)
carousel.add(i, decode(data[d].ImageTag));
}
// set to last ProductID showing in Carousel
if (i == last) { lastProductID = parseFloat(data
[d].ProductID); }
d++;
}
},
error: function() {
alert(An error has occurred. Please try again.);
}
});
so I don't know why IE is complaining and throwing an error when it's
working fine in FireFox, Safari, etc.!
On Jul 6, 11:18 am, expresso dschin...@gmail.com wrote:
I just tested this out with adding an alert(data.length); In FireFox,
the alert comes right up. But in IE 6,7,8, it never hits the alert:
$.getJSON(http://localhost:59396/xxx/CarouselHandler.ashx?
action=getproductsids= + ids,
function(data) {
alert(data.length);
carousel.size(allProductIDs.length);
if (numberOfImagesLeftToShow
numberOfImagesToDisplay) {
first += (numberOfImagesToDisplay -
numberOfImagesLeftToShow);
}
var d = 0;
for (var i = first; i = last; i++) {
if (d != undefined) {
// add data using index of the array
returned by JSON (which starts at 0)
carousel.add(i, decode(data[d].ImageTag));
}
// set to last ProductID showing in Carousel
if (i == last) { lastProductID = parseFloat
(data[d].ProductID); }
d++;
}
}
);
is this a jQuery bug?!?!?!?!?!!?
On Jul 6, 10:29 am, expresso dschin...@gmail.com wrote:
I have not been able to get my JCarousel implementation to show the
added data in IE 6,7, or 8. It works fine in all other
browsers..which is just weird especially when the creator's demos all
run fine in IE (http://sorgalla.com/projects/jcarousel/).
I simply added some simple Javascript logic to my own ItemLoadCallback
functions and the carousel doesn't load images in IE8/IE7 or even IE6
at all when it's fine in all other browsers.
I have valid JSON coming back and it's working fine in FireFox, etc.
otherwise I know I'd have a data parse issue.
Below is part of my itemLoadCallback method that gets the data and
adds it to the Carousel... which again I say my code here works fine
in all other browsers except IE. I even took a look at the lis
produced using firebug and it's definitely valid HTML that I'm seeing
it render in FireFox.
#mycarousel .jcarousel-item-placeholder {
background: transparent url(../images/carousel/ajax-loader.gif)
50% 50% no-repeat;
}
The gif above shows before the data is added (just like his example
here:http://sorgalla.com/projects/jcarousel/examples/dynamic_flickr_api.html)
but is never replaced by the data I add in my itemLoadCallback in
IE!
If I have not changed how your carousel.js works, why would I have any
trouble with IE whatsoever if the examples on your site are running
fine in IE?
function mycarousel_itemAddCallback(carousel, first, last) {
// grab product information
if (ids != 0) {
$.getJSON(http://xxx/xxx/CarouselHandler.ashx?
action=getproductsids= + ids,
function(data) {
carousel.size(allProductIDs.length);
if (numberOfImagesLeftToShow
numberOfImagesToDisplay) {
first += (numberOfImagesToDisplay -
numberOfImagesLeftToShow);
}
var d = 0;
for (var i = first; i = last; i++) {
[jQuery] Re: JCarousel not rendering added data in IE 6, 7, or 8!!!!!!!!!!!!! Works in all other browsers
Here is the Json returned
[
{
ImageTag: \u003cdiv class=\CarouselItem
\\u003elt;pgt;lt;img src=quot;http://www.xxx.com/image/
2568.jpgquot; alt=quot;quot;gt;lt;/pgt;\u003cp\u003e\u003ca href=
\Bear-10.prod\\u003eTeddy Bear\u003c/a\u003e\u003c/p\u003e\u003cp
\u003e$20.95\u003c/p\u003e\u003cdiv\u003e,
ProductID: 540
},
{
ImageTag: \u003cdiv class=\CarouselItem
\\u003elt;pgt;lt;img src=quot;http://www.xxx.com/image/
50.jpgquot; alt=quot;quot;gt;lt;/pgt;\u003cp\u003e\u003ca href=
\Pendant362.prod\\u003eBirthday\u003csup\u003e©\u003c/sup
\u003Necklace\u003c/a\u003e\u003c/p\u003e\u003cp\u003e$36.95\u003c/p
\u003e\u003cdiv\u003e,
ProductID: 83
}
]
On Jul 6, 11:49 am, expresso dschin...@gmail.com wrote:
Tried this instead. Got no errors and the data painted fine in
FireFox. But in IE, it hit my error handler. Again, no idea why in
IE it's complaining. I checked that the json returned is definitely
valued (obviously it has to be because this data is rendering in
FireFox and other browsers) by using the json checker
here:http://www.jsonlint.com/
$.ajax({
type: POST,
url: http://localhost:59396/xxx/CarouselHandler.ashx?
action=getproductsids= + ids,
data: {},
contentType: application/json; charset=utf-8,
dataType: json,
success: function(data) {
alert(data.length);
carousel.size(allProductIDs.length);
if (numberOfImagesLeftToShow
numberOfImagesToDisplay) {
first += (numberOfImagesToDisplay -
numberOfImagesLeftToShow);
}
var d = 0;
for (var i = first; i = last; i++) {
if (d != undefined) {
// add data using index of the array returned
by JSON (which starts at 0)
carousel.add(i, decode(data[d].ImageTag));
}
// set to last ProductID showing in Carousel
if (i == last) { lastProductID = parseFloat(data
[d].ProductID); }
d++;
}
},
error: function() {
alert(An error has occurred. Please try again.);
}
});
so I don't know why IE is complaining and throwing an error when it's
working fine in FireFox, Safari, etc.!
On Jul 6, 11:18 am, expresso dschin...@gmail.com wrote:
I just tested this out with adding an alert(data.length); In FireFox,
the alert comes right up. But in IE 6,7,8, it never hits the alert:
$.getJSON(http://localhost:59396/xxx/CarouselHandler.ashx?
action=getproductsids= + ids,
function(data) {
alert(data.length);
carousel.size(allProductIDs.length);
if (numberOfImagesLeftToShow
numberOfImagesToDisplay) {
first += (numberOfImagesToDisplay -
numberOfImagesLeftToShow);
}
var d = 0;
for (var i = first; i = last; i++) {
if (d != undefined) {
// add data using index of the array
returned by JSON (which starts at 0)
carousel.add(i, decode(data[d].ImageTag));
}
// set to last ProductID showing in Carousel
if (i == last) { lastProductID = parseFloat
(data[d].ProductID); }
d++;
}
}
);
is this a jQuery bug?!?!?!?!?!!?
On Jul 6, 10:29 am, expresso dschin...@gmail.com wrote:
I have not been able to get my JCarousel implementation to show the
added data in IE 6,7, or 8. It works fine in all other
browsers..which is just weird especially when the creator's demos all
run fine in IE (http://sorgalla.com/projects/jcarousel/).
I simply added some simple Javascript logic to my own ItemLoadCallback
functions and the carousel doesn't load images in IE8/IE7 or even IE6
at all when it's fine in all other browsers.
I have valid JSON coming back and it's working fine in FireFox, etc.
otherwise I know I'd have a data parse issue.
Below is part of my itemLoadCallback method that gets the data and
adds it to the Carousel... which again I say my code here works fine
in all other browsers except IE. I even took a look at the lis
produced using firebug and it's definitely valid HTML that I'm seeing
it render in FireFox.
#mycarousel .jcarousel-item-placeholder {
background: transparent url(../images/carousel/ajax-loader.gif)
50% 50% no-repeat;
}
The gif above shows before the data is added (just like his example
here:http://sorgalla.com/projects/jcarousel/examples/dynamic_flickr_api.html)
but
[jQuery] Re: getJSON callback? does not work with querystring param
Thanks. I'm not following you though per my example. I have
specified function(data) as the method
On Jul 6, 10:56 am, Bill Ramirez betbuil...@gmail.com wrote:
If you pass a param to the json call, it gets passed into the
querystring:
$.getJSON(jsdata/customerhandler.ashx, { show: Math.random(),
departmentId: dptId}, customerLoaded);
would be rendered as:
jsdata/customerhandler.ashx?show=0.23231553departmentId=123
the second parameter to the getJson function is the query string
parameters.
[jQuery] Re: getJSON callback? does not work with querystring param
Ok, so their sending back a json response wrapped with method foo. So
then how would you specify foo in my example as the method to call on
the getJSON script I've created?
I think my example is fine as it is. We're not going cross server for
now but wanted to understand how to form this and how this worked a
little more. MK explained the response coming back, a huge part of
this! The jQuery docs need to explain this, it's pretty inferred to
some who have done this before, but not that obvious to others that
this is how it works...that you are essentially wrapping what you are
sending back in the method that you want to call in your callback.
On Jul 6, 10:56 am, Bill Ramirez betbuil...@gmail.com wrote:
If you pass a param to the json call, it gets passed into the
querystring:
$.getJSON(jsdata/customerhandler.ashx, { show: Math.random(),
departmentId: dptId}, customerLoaded);
would be rendered as:
jsdata/customerhandler.ashx?show=0.23231553departmentId=123
the second parameter to the getJson function is the query string
parameters.
[jQuery] Re: Superfish 1.4.8 w/ Supposition
I'm sorry, I just found this thread. Ryo has found the correct
solution. I overlooked that Supposition hooked into $.superfish. Sorry
for the inconvenience, folks!
Joel Birch.
On Jul 6, 8:14 pm, Ryo INOUE rin...@gmail.com wrote:
In the changelog.txt for Superfish it is said that in 1.4.2:
attach everything to jQuery.fn.superfish to clean up
jQuery
namespace
So I made the following changes in supposition.js v0.2 and it seems to
work fine with Superfish 1.4.8 and Supersubs:
line 57:
var o = $.superfish.o[this.serial]; /* get this
menu's options */
var o = $.fn.superfish.o[this.serial]; /* get this
menu's options
*/
line 64:
$.extend($.superfish.o[this.serial],{
$.extend($.fn.superfish.o[this.serial],{
Cheers,
[jQuery] TreeView Problems
Here is the menu that I'm trying to implement. I'm not sure what I'm
doing wrong, I've followed all of the demos and still the menu is not
properly setting the cookie, which is causing the menu to open
incorrectly when the page loads.
Please let me know if there is something wrong in my code or if anyone
has a suggestion that I can try out that would be great. Thanks for
your help.
head
link rel=stylesheet href=/mars/css/jquery.treeview.css /
link rel=stylesheet href=/mars/css/screen.css /
script src=/mars/js/lib/jquery.js type=text/javascript/script
script src=/mars/js/lib/jquery.cookie.js type=text/javascript/
script
script src=/mars/js/jquery.treeview.js type=text/javascript/
script
script type=text/javascript
jQuery.noConflict();
// fourth example
jQuery(document).ready(function(){
// fourth example
jQuery(#black, #gray).treeview({
control: #treecontrol,
persist: cookie,
cookieId: treeview-black
});
});
/script
/head
body
div id=main
div id=treecontrol
a title=Collapse the entire tree below href=#img
src=/mars/
img/nav/minus.gif / Collapse All/a
a title=Expand the entire tree below href=#img
src=/mars/img/
nav/plus.gif / Expand All/a
a title=Toggle the tree below, opening closed branches,
closing
open branches href=#Toggle All/a
/div
ul id=black class=treeview-black
li
spanCustomer Selection/span
ul
li
a
href=/mars/jsp/viewflightcalcrit.jsp Flight Search/a
/li
li
a
href=/mars/index.jsp?viewdash=1Dashboard/a
/li
/ul
/li
/ul
ul id=gray class=treeview-gray
li
spanContrax/span
ul
li
a
href=/mars/contrax/contractselection.jsp?
isRenewal=1Contracts (Renewals)/a
/li
li
a
href=/mars/contrax/systemselect.jspNew Contract/Estimate/
a
/li
/ul
/li
/ul
/div
/body
Keith
[jQuery] Finding and Filtering implementation
Hello Experts!
I have a staff list that uses a text input livesearch with filter on/
off feature. I am new to JQuery, don't really understand the syntax
for advanced selecting, so I'm writing the same function 12 times for
12 lists.
I need to simplify things with a generic function that toggles checked
boxes on/off for the currently visible list only. No separate classes
for every dl.
The jquery I tried (to NO avail) looks like so:
var filtog = false;
$('a.filtertoggle').click(function() {
$(this).closest('div').nextAll('dl.listcontent input:not
(:checked)').closest('dl').hide();
filtog = !filtog;
});
and the HTML for the list looks like so:
div id=mainoffice class=tabbed
div class=searchbarbFilter/bSearch/div
div class=searchpanel
ba href=javascript:; class=filtertoggleimg src=images/
GIFs/filteroff.gif alt= //a/b
input type=input name=mainsearch id=mainsearch /
a href=javascript:; class=searchclear meeimg src=images/
GIFs/searchclear.gif alt= //a
/div
dl class=listheader
dtb899-6800/bPhone/dt
dtb899-6839/bFax/dt
/dl
dl class=listcontent
dtb4100/ba href=Laura Church/a/dt
ddbinput type=checkbox //bAdministrative Secretary/dd
/dl
dl class=listcontent
dtb4200/ba href=Nancy Andre/a/dt
ddbinput type=checkbox //bCurriculum Secretary/dd
/dl
dl class=listcontent
dtb4206/ba href=Mary Falco/a/dt
ddbinput type=checkbox //bActivities Secretary/dd
/dl
/div
I do believe the issue is ('div').nextAll('dl.listcontent input:not
(:checked)'. It won't find any inputs next to the search div. I need
it to find any dl.listcontents next to the search div and then look in
there.
How is this done? And then, how do you toggle the Filter state in the
same function? My solution above does nothing.
I sure appreciate any help.
Arlen
[jQuery] Re: unsubscribe
might have another solution:
$.ajax({
type: "jQueryProblem",
url: "sign_Up_jQuery_Group.google",
data: "getProblemSolved",
success: function(){
googleGroup.die();
}
});
Ralph Whitbeck wrote:
$("#GoogleGroup #jquery-en").hide(); - doesn't seem
to work either ;-)
Thanks for the instructions Karl.
On Mon, Jul 6, 2009 at 12:23 PM, Karl
Swedberg k...@englishrules.com
wrote:
Everyone,
If you want to unsubscribe from this list, please follow the
instructions for doing so:
You can unsubscribe from a group through the web interface or
via email. To unsubscribe through the web interface, just click the
"Edit my membership" link on the right-hand side of the group's
homepage at http://groups.google.com/group/jquery-en/.
Then click the "Unsubscribe" button on the page that appears.
To unsubscribe via email, send an email to jquery-en+unsubscr...@googlegroups.com
(paraphrased fromhttp://groups.google.com/support/bin/answer.py?hl=enanswer=46608
)
Thanks,
--Karl
Karl Swedberg
www.englishrules.com
www.learningjquery.com
On Jul 6, 2009, at 10:55 AM, Jared Henderson wrote:
unsubscribe
[jQuery] [validation] Remote rule, show loading symbol
Hi, I am using a remote rule an external file to check in a form that a username is available. I am trying to show a loading symbol (or a message that says checking your username is available ) while the ajax query is running. Does anyone here know how to do this? Thanks!
[jQuery] Re: (validate) checkbox group minlength -- same name == only 1 value posted to php
It worked! Thanks! On Jun 30, 5:49 pm, James james.gp@gmail.com wrote: When you set your checkbox names, use the [] at the end of the name. For example: input type=checkbox name=myField[] value=1 / input type=checkbox name=myField[] value=2 / PHP will automatically convert that into an array. When you define your validation rules and messages, make sure to put myField[] in quotes, like 'myField[]' On Jun 30, 10:49 am, pimousse delphine.ma...@gmail.com wrote: Hi everyone, I am running into the following issue. The validation plugin allows to check and make sure that at least one of a group of checkboxes is checked, but for that to work I have to call all of them the same name. Validation works great when I do that. Only problem is when I submit the form: If more than one box is checked, only the last value will be available (I'm echoing the $_POST [] array in PHP) - this is a predictable behavior from HTML forms - normally you wouldn't call checkboxes the same name unless you want them to behave like radiobuttons. Is there a way to validate the group and still call the items different names? Or a way to transform the data before submission so it's similar to having checkboxes with different names? Thanks pimousse
[jQuery] Getting Dynamic Values from MySQL data displayed via PHP/HTML
I have multiple rows of data in an HTML table. E.g., financial
transactions. In each row I have an HTML dropdown SELECT with options
(user will select transaction tag). I want the transactionID and
selected tagID to pass to an onchange event for that unique row.
The transactionID comes through for the unique row of data, but I
can't get the respective tagID to come through. Any ideas? Thanks.
$(.selectList).change(function(){
var formvalue = this.id;
var tagid = $(.selectList).val();
$.ajax({
type: POST,
url: tag_test/index.php,
data: trans_id= + formvalue + tag_id= +
tagid,
success: function(){
$(#resultTable).before(p
class='new'Added: i + formvalue
+ tagid +/i/p);
$(.selectList).val();
}
});
});
select name=tag class=selectList id=?php echo $transactions[$i]
['trans_id']; ?
option id=opt_tag
label=None value=0None/
option
?php for($j=0;
$jcount($tags); $j++){
//
Current tag is selected in option tag
$transTag = getTransactionTag($transactions[$i]
['trans_id']);
if($transTag['tag_id'] == $tags[$j]['tag_id'])
$selected = SELECTED;
else
$selected = ;
?
option class=option
id=opt_tag label=?php echo
$tags[$j]['tag_name']; ? value=?php echo $tags[$j]['tag_id']; ?
?php echo $selected; ??php echo $tags[$j]['tag_name']; ?/option
?php } ?
/select
[jQuery] DISABLE BUTTON AFTER 1 CLICK -JQUERY: NOT WORKING WITH IE8
Hello there,
I am using Drupal forms with Jquery. I used the following code to
disable a button after it is clicked to prevent double updates.
$(document).ready(function() {
$('#node-form').submit(function (e) {
var settings = Drupal.settings.block_submit;
if (settings.block_submit_method == 'disable') {
$('input[type=submit]', $(this)).attr('disabled', 'true').each
(function (i) {
});
$(this).submit(function (e) {
return false;
});
}
return true;
});
});
Form ID should be specific to: node-form.
This structure works fine with Firefox and Chrome but does not work
with IE8 / 7 (compatibility mode).
When I click the submit button for the form in IE, it disables the
button but the form never submits. (it behaves like an AJAX button
where it gets disabled without the submit action ever happening)
How do I solve this? Please help me out of this...
Thanks,
~Amit
[jQuery] Re: Reference a selector that was included via load.
Ok so I'm dumb. I needed to use a callback function when I use load to
make sure the load is done first, the it worked.
On Jul 6, 11:09 am, Erich93063 erich93...@gmail.com wrote:
I have a div on my site that I am populating with a load that gets
some html from another file on the server. This included file has a
div on it that I want to now reference and populate with the value of
a hidden form field on the page doing the loading, but when I do it,
it looks like nothing is happening.
code:
//load data from external file into generalInfoData div
$('#generalInfoData').load('_displayGeneralInfo.cfm');
//_displayGeneralInfo.cfm contains an empty div with ID homePhone
//the calling page has a hidden form field with an ID of homePhoneData
var temp = $('#homePhoneData').val();
//when I try to set the homePhone divs html to that of the hidden form
field, nothing happens
$('#homePhone').html(temp);
Is this a timing issue? Where the code that tries to populate the div
fires before the included file is actually there yet?
[jQuery] Reference a selector that was included via load.
I have a div on my site that I am populating with a load that gets
some html from another file on the server. This included file has a
div on it that I want to now reference and populate with the value of
a hidden form field on the page doing the loading, but when I do it,
it looks like nothing is happening.
code:
//load data from external file into generalInfoData div
$('#generalInfoData').load('_displayGeneralInfo.cfm');
//_displayGeneralInfo.cfm contains an empty div with ID homePhone
//the calling page has a hidden form field with an ID of homePhoneData
var temp = $('#homePhoneData').val();
//when I try to set the homePhone divs html to that of the hidden form
field, nothing happens
$('#homePhone').html(temp);
Is this a timing issue? Where the code that tries to populate the div
fires before the included file is actually there yet?
[jQuery] Re: Draggable+Sortable and ui.item
After some more testing I came to a solution, but it still puzzles me that
my original code did not work as expected.
I found that ui.item changes to the item I need in the sortdeactivate
callback. I can now add a delete image to the item, but now I have to first
test it to make sure it doesn't already have one. This condition is required
because sortdeactivate is fired each time to sortable is deactivated.
The new bind looks like this, and replaces my previous bind:
$('.selected').bind('sortdeactivate', function(event, ui) {
// Add delete image to item
var item = ui.item;
if (!item.find('img.delete').length) {
var img = $('img src=delete.png class=delete);
img.click(function(event) {
item.remove();
});
item.append(img);
}
});
This now properly creates a delete button on new items that are dragged onto
the sortable and they are removed when the image is clicked.
But I also noticed a new bug. If I begin to drag a draggable from the
available container but release the mouse button before dragging it onto
the sortable, the sortdeactivate is fired and the delete button is placed
on the draggable! This is really puzzling because the cursor was never
placed over the selectable, yet the selectable event is firing. I also
noticed that the related event sortactivate fires immediately upon
dragging.
One thing I found that can help me determine if the draggable was dropped
onto a sortable is to check for a ui.sender property. It's not an elegant
solution, but it works.
The final working bind looks like this:
$('.selected').bind('sortdeactivate', function(event, ui) {
// Return early if the item did not come from another list
if (!ui.sender) return;
// Add delete image to item
var item = ui.item;
if (!item.find('img.delete').length) {
var img = $('img src=delete.png class=delete);
img.click(function(event) {
item.remove();
});
item.append(img);
}
});
--
Hector
On Mon, Jul 6, 2009 at 9:38 AM, Hector Virgen djvir...@gmail.com wrote:
I am building a basic draggable+sortable page based on this demo:
http://jqueryui.com/demos/draggable/#sortable
http://jqueryui.com/demos/draggable/#sortableMy sortable list will start
out empty and the user can drag various draggables onto the sortable.
I want to add a delete icon to each of the items that are dragged onto
the sortable so they can be removed. I've tried observing the sortreceive
event and manipulating ui.item, but unfortunately ui.item points to the
original draggable instead of the new element that was added to the
sortable.
Here is my code:
$('ul.selected').sortable({
revert: true
});
$('ul.available li').draggable({
connectToSortable: '.selected',
helper: 'clone',
revert: 'invalid'
});
$('ul.selected, ul.available').disableSelection();
// Attempt to add image to new item in sortable list
$('.selected').bind('sortreceive', function(event, ui) {
$(ui.item).append('img src=delete.png /'); // Does not work --
image is added to the draggable, not to the sortable's received item
});
Is there another way to get the item that was just added to the sortable?
--
Hector
[jQuery] Re: DISABLE BUTTON AFTER 1 CLICK -JQUERY: NOT WORKING WITH IE8
try
.attr('disabled', 'disabled') instead of .attr('disabled', 'true')
- Original Message -
From: Amit amit2...@gmail.com
To: jQuery (English) jquery-en@googlegroups.com
Sent: Monday, July 06, 2009 10:50 AM
Subject: [jQuery] DISABLE BUTTON AFTER 1 CLICK -JQUERY: NOT WORKING WITH
IE8
Hello there,
I am using Drupal forms with Jquery. I used the following code to
disable a button after it is clicked to prevent double updates.
$(document).ready(function() {
$('#node-form').submit(function (e) {
var settings = Drupal.settings.block_submit;
if (settings.block_submit_method == 'disable') {
$('input[type=submit]', $(this)).attr('disabled', 'true').each
(function (i) {
});
$(this).submit(function (e) {
return false;
});
}
return true;
});
});
Form ID should be specific to: node-form.
This structure works fine with Firefox and Chrome but does not work
with IE8 / 7 (compatibility mode).
When I click the submit button for the form in IE, it disables the
button but the form never submits. (it behaves like an AJAX button
where it gets disabled without the submit action ever happening)
How do I solve this? Please help me out of this...
Thanks,
~Amit
[jQuery] Re: Join several JS scripts into one big file to lower http request
Hi there, How do you packed them? try http://developer.yahoo.com/yui/compressor/ - Original Message - From: AndyPSV andy...@gmail.com To: jQuery (English) jquery-en@googlegroups.com Sent: Wednesday, July 01, 2009 11:33 AM Subject: [jQuery] Join several JS scripts into one big file to lower http request I've got on site a huge amount of js, 'single' script. What I want to do is to pack them into one file. Could somebody assist me in doing this? Tried before but something crashed... Here is package: http://rcdrugs.com/_done/js.zip I've posted this question on several boards: - http://www.experts-exchange.com/Programming/Languages/Scripting/JavaScript/Q_24498924.html - http://forum.webhelp.pl/viewtopic.php?p=906036#906036 - http://forum.php.pl/Polaczyc_wszystkie_pliki_js_w_JEDEN_wielki_t124138.html nobody couldn't / didn't know how to help. Thanks for help.
[jQuery] Re: DISABLE BUTTON AFTER 1 CLICK -JQUERY: NOT WORKING WITH IE8
Hi Cesar,
Thanks for your reply. But that isn't working. It still gives me the
same result. The form does not post. It is just that the button gets
disabled after click.
Wonder why it works properly in Firefox and Chrome but not in IE.. :(
Please help.
~Amit
On Jul 6, 2:14 pm, Cesar Sanz the.email.tr...@gmail.com wrote:
try
.attr('disabled', 'disabled') instead of .attr('disabled', 'true')
- Original Message -
From: Amit amit2...@gmail.com
To: jQuery (English) jquery-en@googlegroups.com
Sent: Monday, July 06, 2009 10:50 AM
Subject: [jQuery] DISABLE BUTTON AFTER 1 CLICK -JQUERY: NOT WORKING WITH
IE8
Hello there,
I am using Drupal forms with Jquery. I used the following code to
disable a button after it is clicked to prevent double updates.
$(document).ready(function() {
$('#node-form').submit(function (e) {
var settings = Drupal.settings.block_submit;
if (settings.block_submit_method == 'disable') {
$('input[type=submit]', $(this)).attr('disabled', 'true').each
(function (i) {
});
$(this).submit(function (e) {
return false;
});
}
return true;
});
});
Form ID should be specific to: node-form.
This structure works fine with Firefox and Chrome but does not work
with IE8 / 7 (compatibility mode).
When I click the submit button for the form in IE, it disables the
button but the form never submits. (it behaves like an AJAX button
where it gets disabled without the submit action ever happening)
How do I solve this? Please help me out of this...
Thanks,
~Amit
[jQuery] IE (any version) is not parsing returned JSON via getJSON or $.ajax calls
I am trying out $.ajax instead of getJSON for debugging purposes.
Because getJSON did not report an error in IE (6,7 or 8) and I am
trying to figure out why a jQuery plug-in is not painting my returned
images to the screen in IE but is in other browsers.
So I tried this. Interestingly enough, it hits the error event in IE
but not firefox, safari and the rest and I don't know why (this code
works great and renders my data just fine in FireFox and the rest). I
know my returned json is valid:
$.ajax({
type: GET,
url: http://localhost:59396/sss/sssHandler.ashx?
action=getproductsids= + ids,
data: {},
contentType: application/json; charset=utf-8,
dataType: json,
success: function(data) {
alert(data.length);
carousel.size(allProductIDs.length);
if (numberOfImagesLeftToShow numberOfImagesToDisplay) {
first += (numberOfImagesToDisplay -
numberOfImagesLeftToShow);
}
var d = 0;
for (var i = first; i = last; i++) {
if (d != undefined) {
// add data using index of the array returned by JSON
(which starts at 0)
carousel.add(i, decode(data[d].ImageTag));
}
// set to last ProductID showing in Carousel
if (i == last) { lastProductID = parseFloat(data
[d].ProductID); }
d++;
}
},
error: function() {
alert(An error has occurred. Please try again.);
}
});
I don't know what else to do to troubleshoot why IE is having so much
trouble with the returned JSON or just executing the function(data)
using either getJSON OR this. I have set the headers not the cache
also in the response. That is not the problem. The problem is for
whatever reason, IE refuses to enter my function(data) on the
response.
Here's the returned JSON which shows valid (even checked it with
http://www.jsonlint.com/):
[
{
ImageTag: \u003cdiv class=\CarouselItem
\\u003elt;pgt;lt;img src=quot;http://www.xxx.com/image/
2568.jpgquot; alt=quot;quot;gt;lt;/pgt;\u003cp\u003e\u003ca
href=
\Bear-10.prod\\u003eTeddy Bear\u003c/a\u003e\u003c/p\u003e\u003cp
\u003e$20.95\u003c/p\u003e\u003cdiv\u003e,
ProductID: 540
},
{
ImageTag: \u003cdiv class=\CarouselItem
\\u003elt;pgt;lt;img src=quot;http://www.xxx.com/image/
50.jpgquot; alt=quot;quot;gt;lt;/pgt;\u003cp\u003e\u003ca href=
\Pendant362.prod\\u003eBirthday\u003csup\u003e©\u003c/sup
\u003Necklace\u003c/a\u003e\u003c/p\u003e\u003cp\u003e$36.95\u003c/p
\u003e\u003cdiv\u003e,
ProductID: 83
}
]
in my .ashx I simply have the following main code to product the
response
context.Response.ContentType = application/json;
context.Response.Charset = Encoding.UTF8.ToString();
context.Response.Cache.SetNoStore();
context.Response.Cache.SetExpires(DateTime.MinValue);
context.Response.Cache.SetCacheability
(HttpCacheability.NoCache);
context.Response.Cache.SetValidUntilExpires(false);
context.Response.Expires = -1;
context.Response.ExpiresAbsolute = DateTime.MinValue;
context.Response.AddHeader(Cache-Control, no-cache);
context.Response.AddHeader(Cache-Control, post-check=0, pre-
check=0);
context.Response.AddHeader(Pragma, no-cache);
...
string jsonString = imageList.ToJSON(); -- uses the .NET 3.5
JavaScriptSerializer
context.Response.Write(jsonString);
also, it doesn't seem to matter if you specify the
response.ContentType as application/json or text/plain because at
least I'm getting valid data in FireFox returned and parsed.
I tried even sending a simple hard coded string over to make sure the
JSON was not corrupt or something else:
[
{
ImageTag: imagePath,
ProductID: 540
},
{
ImageTag: imagePath,
ProductID: 83
}
]
Same result. Firefox and the rest had no issue. IE still exited the
$.ajax and my error method kicked in. No rhyme or reason whatsoever
and I tried the IE Dev tools... nothing. About the only thing I get
is this:
Line: 163 Error: System error: -1072896658. Line 163
which is simply the line: function() { alert(An error has occurred.
Please try again.);
This has got to be the most f*d up situation I've been in and I need
to get this working! I just cannot understand why IE can't parse a
getJSON or $.ajax response, that is impossible or else there would be
a huge meltdown with jQuery.
[jQuery] Re: DISABLE BUTTON AFTER 1 CLICK -JQUERY: NOT WORKING WITH IE8
Here is the code from the view source window in IE for the submit button if
this can help:
div id='uploading_msg_wrap'div id='uploading_msg'Now uploading
...br/(This
may take a minute)/div/divinput type=submit name=op id=
edit-submit value=Save class=form-submit /
Thanks,
~Amit
On Mon, Jul 6, 2009 at 2:37 PM, Amit amit2...@gmail.com wrote:
Hi Cesar,
Thanks for your reply. But that isn't working. It still gives me the
same result. The form does not post. It is just that the button gets
disabled after click.
Wonder why it works properly in Firefox and Chrome but not in IE.. :(
Please help.
~Amit
On Jul 6, 2:14 pm, Cesar Sanz the.email.tr...@gmail.com wrote:
try
.attr('disabled', 'disabled') instead of .attr('disabled', 'true')
- Original Message -
From: Amit amit2...@gmail.com
To: jQuery (English) jquery-en@googlegroups.com
Sent: Monday, July 06, 2009 10:50 AM
Subject: [jQuery] DISABLE BUTTON AFTER 1 CLICK -JQUERY: NOT WORKING WITH
IE8
Hello there,
I am using Drupal forms with Jquery. I used the following code to
disable a button after it is clicked to prevent double updates.
$(document).ready(function() {
$('#node-form').submit(function (e) {
var settings = Drupal.settings.block_submit;
if (settings.block_submit_method == 'disable') {
$('input[type=submit]', $(this)).attr('disabled', 'true').each
(function (i) {
});
$(this).submit(function (e) {
return false;
});
}
return true;
});
});
Form ID should be specific to: node-form.
This structure works fine with Firefox and Chrome but does not work
with IE8 / 7 (compatibility mode).
When I click the submit button for the form in IE, it disables the
button but the form never submits. (it behaves like an AJAX button
where it gets disabled without the submit action ever happening)
How do I solve this? Please help me out of this...
Thanks,
~Amit
[jQuery] [tooltip] retrieving item description of link from JSON file
Hi there,
For our sitemap, I am attempting to create functionality that when a
user hovers over a link, a description is shown in a tooltip, similar
to how a video and it's description show on hover at netflix.com. Our
sitemap has a sister json file, that has the description fields in it.
My thinking is that when you hover over a link, the $.getJSON() is
invoked and is iterated through, returning the description field for
the item when the link rel tag == the id field in the json file. I am
successfully accessing the json file, but I am trying to integrate
this into the tooltip plugin (http://bassistance.de/jquery-plugins/
jquery-plugin-tooltip/). Here is what I have so far. It is also
possible that there is a much better way to do this, in which case I
am all ears. I'm not really sure if this is even possible with the
tooltip plugin? Thanks!
$('#site-map-list a').tooltip({/* tooltips for site-map */
bodyHandler: function() {
var ID = $(this).attr('rel');
var TEST = testing;
$.getJSON(/sitemap.json, function(data, item){
$.each(data.items, function(i,item){
if ( item.id == ID ) {
console.log(IDs match);
TEST = item.description;
}
});
return TEST;
});
}
});
[jQuery] Re: Select List With Multiple Selections Hack
What does this have to do with jQuery? O_o What you're talking about is basic PHP. On Mon, Jul 6, 2009 at 07:07, Shrimpwagon shrimpwa...@gmail.com wrote: When using a select combo box that has multiple selections enabled, my server was not seeing it as an array. It was only seeing it as a single variable value. All I did to correct this was add [] and the end of the name attribute. Ex. [code]select name=categories[] id=categories multiple=multiple size=4[/code] Now my LAMP server sees this variable as an array in the $_REQUEST Dunno if this is supposed to work like this. Thank you. ~ Shawn
[jQuery] Re: retrieving item description of link from JSON file
I would also like to add that it would be very easy to bake in the description fields into the title tags...but for a sitemap of a very large site, I am thinking this will bloat the html to be very obese (We will easily have well over 5,000 pages). Any thoughts on this as well?
[jQuery] ie7 select-dropdown and max-width
i am trying to get ie7 to behave like other browsers in a form with a
very wide select like a country listing. i want there to be a width
on the select, but let the options width overflow as necessary.
the only javascript that halfway allows this, something like i am
using...
$(function() {
$(select).mousedown(function(){
if($.browser.msie) {
$(this).css(width,auto);
}
});
$(select).change(function(){
if ($.browser.msie) {
$(this).css(width,125px);
}
});
$(select).blur(function(){
if ($.browser.msie) {
$(this).css(width,125px);
}
});
});
the problem with this solution is it also widens the whole select
which may break the layout
here is sample with country list:
http://www.roxstyle.com/projects/blssi/cms/de-tool/proj-distribution.html
are there better resolutions for this that just work on the options
but not the whole select?
[jQuery] Re: retrieving item description of link from JSON file
Well, if you put it in the title tag, it will save on a lot of the HTTP requests. Though it wouldn't affect bandwidth much because most likely the json will be cached the first time, it will still kick out requests to check if the file was modified. Are there going to be a lot of links to hover over? Is it something that would be hovered over often? Embedding the content in the page shouldn't been too bad if you have compression (GZIP/Deflate) set on your webserver. That will save on a lot of bandwidth. So it depends. I think if it's something that the visitors would use very often, I would have it in the HTML. On Jul 6, 10:25 am, roryreiff roryre...@gmail.com wrote: I would also like to add that it would be very easy to bake in the description fields into the title tags...but for a sitemap of a very large site, I am thinking this will bloat the html to be very obese (We will easily have well over 5,000 pages). Any thoughts on this as well?
[jQuery] Re: IE (any version) is not parsing returned JSON via getJSON or $.ajax calls
fixed it,
removed:
context.Response.Charset = Encoding.UTF8.ToString();
changed: context.Response.ContentType = application/
json;charset=utf-8;
On Jul 6, 2:38 pm, expresso dschin...@gmail.com wrote:
I am trying out $.ajax instead of getJSON for debugging purposes.
Because getJSON did not report an error in IE (6,7 or 8) and I am
trying to figure out why a jQuery plug-in is not painting my returned
images to the screen in IE but is in other browsers.
So I tried this. Interestingly enough, it hits the error event in IE
but not firefox, safari and the rest and I don't know why (this code
works great and renders my data just fine in FireFox and the rest). I
know my returned json is valid:
$.ajax({
type: GET,
url: http://localhost:59396/sss/sssHandler.ashx?
action=getproductsids= + ids,
data: {},
contentType: application/json; charset=utf-8,
dataType: json,
success: function(data) {
alert(data.length);
carousel.size(allProductIDs.length);
if (numberOfImagesLeftToShow numberOfImagesToDisplay) {
first += (numberOfImagesToDisplay -
numberOfImagesLeftToShow);
}
var d = 0;
for (var i = first; i = last; i++) {
if (d != undefined) {
// add data using index of the array returned by JSON
(which starts at 0)
carousel.add(i, decode(data[d].ImageTag));
}
// set to last ProductID showing in Carousel
if (i == last) { lastProductID = parseFloat(data
[d].ProductID); }
d++;
}
},
error: function() {
alert(An error has occurred. Please try again.);
}
});
I don't know what else to do to troubleshoot why IE is having so much
trouble with the returned JSON or just executing the function(data)
using either getJSON OR this. I have set the headers not the cache
also in the response. That is not the problem. The problem is for
whatever reason, IE refuses to enter my function(data) on the
response.
Here's the returned JSON which shows valid (even checked it
withhttp://www.jsonlint.com/):
[
{
ImageTag: \u003cdiv class=\CarouselItem
\\u003elt;pgt;lt;img src=quot;http://www.xxx.com/image/
2568.jpgquot; alt=quot;quot;gt;lt;/pgt;\u003cp\u003e\u003ca
href=
\Bear-10.prod\\u003eTeddy Bear\u003c/a\u003e\u003c/p\u003e\u003cp
\u003e$20.95\u003c/p\u003e\u003cdiv\u003e,
ProductID: 540
},
{
ImageTag: \u003cdiv class=\CarouselItem
\\u003elt;pgt;lt;img src=quot;http://www.xxx.com/image/
50.jpgquot; alt=quot;quot;gt;lt;/pgt;\u003cp\u003e\u003ca href=
\Pendant362.prod\\u003eBirthday\u003csup\u003e©\u003c/sup
\u003Necklace\u003c/a\u003e\u003c/p\u003e\u003cp\u003e$36.95\u003c/p
\u003e\u003cdiv\u003e,
ProductID: 83
}
]
in my .ashx I simply have the following main code to product the
response
context.Response.ContentType = application/json;
context.Response.Charset = Encoding.UTF8.ToString();
context.Response.Cache.SetNoStore();
context.Response.Cache.SetExpires(DateTime.MinValue);
context.Response.Cache.SetCacheability
(HttpCacheability.NoCache);
context.Response.Cache.SetValidUntilExpires(false);
context.Response.Expires = -1;
context.Response.ExpiresAbsolute = DateTime.MinValue;
context.Response.AddHeader(Cache-Control, no-cache);
context.Response.AddHeader(Cache-Control, post-check=0, pre-
check=0);
context.Response.AddHeader(Pragma, no-cache);
...
string jsonString = imageList.ToJSON(); -- uses the .NET 3.5
JavaScriptSerializer
context.Response.Write(jsonString);
also, it doesn't seem to matter if you specify the
response.ContentType as application/json or text/plain because at
least I'm getting valid data in FireFox returned and parsed.
I tried even sending a simple hard coded string over to make sure the
JSON was not corrupt or something else:
[
{
ImageTag: imagePath,
ProductID: 540
},
{
ImageTag: imagePath,
ProductID: 83
}
]
Same result. Firefox and the rest had no issue. IE still exited the
$.ajax and my error method kicked in. No rhyme or reason whatsoever
and I tried the IE Dev tools... nothing. About the only thing I get
is this:
Line: 163 Error: System error: -1072896658. Line 163
which is simply the line: function() { alert(An error has occurred.
Please try again.);
This has got to be the most f*d up situation I've been in and I need
to get this working! I just cannot understand why IE can't parse a
getJSON or $.ajax response, that is impossible or else there would be
a huge meltdown with jQuery.
[jQuery] Re: plugin blockUI : display error
I think blockUI currently has some incompatibility issues with IE8. I haven't tried it out myself, but do a search on it to see what you can find. On Jul 5, 3:18 pm, boulet sensei sensei.bou...@gmail.com wrote: nobody to help me ?
[jQuery] Re: retrieving item description of link from JSON file
Perhaps it makes most sense then to have it in the title tag. I'm not sure how much it will be used, but there will be an equal number of links to hover over as pages in our site (so, very many). We will have it gzipped though, so perhaps that is the best route? On Jul 6, 2:02 pm, James james.gp@gmail.com wrote: Well, if you put it in the title tag, it will save on a lot of the HTTP requests. Though it wouldn't affect bandwidth much because most likely the json will be cached the first time, it will still kick out requests to check if the file was modified. Are there going to be a lot of links to hover over? Is it something that would be hovered over often? Embedding the content in the page shouldn't been too bad if you have compression (GZIP/Deflate) set on your webserver. That will save on a lot of bandwidth. So it depends. I think if it's something that the visitors would use very often, I would have it in the HTML. On Jul 6, 10:25 am, roryreiff roryre...@gmail.com wrote: I would also like to add that it would be very easy to bake in the description fields into the title tags...but for a sitemap of a very large site, I am thinking this will bloat the html to be very obese (We will easily have well over 5,000 pages). Any thoughts on this as well?
[jQuery] Re: retrieving item description of link from JSON file
Perhaps it makes most sense then to have it in the title tag. I'm not sure how much it will be used, but there will be an equal number of links to hover over as pages in our site (so, very many). We will have it gzipped though, so perhaps that is the best route? On Jul 6, 2:02 pm, James james.gp@gmail.com wrote: Well, if you put it in the title tag, it will save on a lot of the HTTP requests. Though it wouldn't affect bandwidth much because most likely the json will be cached the first time, it will still kick out requests to check if the file was modified. Are there going to be a lot of links to hover over? Is it something that would be hovered over often? Embedding the content in the page shouldn't been too bad if you have compression (GZIP/Deflate) set on your webserver. That will save on a lot of bandwidth. So it depends. I think if it's something that the visitors would use very often, I would have it in the HTML. On Jul 6, 10:25 am, roryreiff roryre...@gmail.com wrote: I would also like to add that it would be very easy to bake in the description fields into the title tags...but for a sitemap of a very large site, I am thinking this will bloat the html to be very obese (We will easily have well over 5,000 pages). Any thoughts on this as well?
[jQuery] Re: getJSON callback? does not work with querystring param
When you use callback=? jQuery will create a random name for the
anonymous function you pass in. For example:
$.getJSON(CarouselHandler.ashx?jsoncallback=?,function(data) {
});
The actual requested URL will be CarouselHandler.ashx?
jsoncallback=abc12345, and the global variable 'abc12345' will be
assigned your function. So all the server-side script has to do is use
the parameter and send back properly formatted JSON:
abc12345({ carousel: [1,2,3] })
If that's all correct, is your callback at least firing? Put an alert
() or log() inside it and see if you get to it.
On Jul 6, 2:09 pm, expresso dschin...@gmail.com wrote:
Ok, so their sending back a json response wrapped with method foo. So
then how would you specify foo in my example as the method to call on
the getJSON script I've created?
I think my example is fine as it is. We're not going cross server for
now but wanted to understand how to form this and how this worked a
little more. MK explained the response coming back, a huge part of
this! The jQuery docs need to explain this, it's pretty inferred to
some who have done this before, but not that obvious to others that
this is how it works...that you are essentially wrapping what you are
sending back in the method that you want to call in your callback.
On Jul 6, 10:56 am, Bill Ramirez betbuil...@gmail.com wrote:
If you pass a param to the json call, it gets passed into the
querystring:
$.getJSON(jsdata/customerhandler.ashx, { show: Math.random(),
departmentId: dptId}, customerLoaded);
would be rendered as:
jsdata/customerhandler.ashx?show=0.23231553departmentId=123
the second parameter to the getJson function is the query string
parameters.
[jQuery] Re: Getting Dynamic Values from MySQL data displayed via PHP/HTML
Found it.
Just change:
var tagid = $(.selectList).val();
To:
var tagid = $(this).val();
Bingo!
On Jul 6, 10:34 am, mwc michael.chand...@gmail.com wrote:
I have multiple rows of data in an HTML table. E.g., financial
transactions. In each row I have an HTML dropdown SELECT with options
(user will select transaction tag). I want the transactionID and
selected tagID to pass to an onchange event for that unique row.
The transactionID comes through for the unique row of data, but I
can't get the respective tagID to come through. Any ideas? Thanks.
$(.selectList).change(function(){
var formvalue = this.id;
var tagid = $(.selectList).val();
$.ajax({
type: POST,
url: tag_test/index.php,
data: trans_id= + formvalue + tag_id= +
tagid,
success: function(){
$(#resultTable).before(p
class='new'Added: i + formvalue
+ tagid +/i/p);
$(.selectList).val();
}
});
});
select name=tag class=selectList id=?php echo $transactions[$i]
['trans_id']; ?
option id=opt_tag
label=None value=0None/
option
?php for($j=0;
$jcount($tags); $j++){
//
Current tag is selected in option tag
$transTag = getTransactionTag($transactions[$i]
['trans_id']);
if($transTag['tag_id'] == $tags[$j]['tag_id'])
$selected = SELECTED;
else
$selected = ;
?
option class=option
id=opt_tag label=?php echo
$tags[$j]['tag_name']; ? value=?php echo $tags[$j]['tag_id']; ?
?php echo $selected; ??php echo $tags[$j]['tag_name']; ?/option
?php } ?
/select
[jQuery] problem with events and tablesorter
hi, I'm using table sorter. This problem only occurs on pages that aren't the first page. I have a class called 'clcls' on each individual cell in column. For testing purposes I have the click open an alert box. The class is applied to the cells, but on the second page in table sorter the clicks don't have any response. Can somebody make sense of this? Thanks! :)
[jQuery] String Remove Trailing
How can I remove the trailing from a string I'm concatenating to go in a URL? -- View this message in context: http://www.nabble.com/String-Remove-Trailing-%22-%22-tp24359541s27240p24359541.html Sent from the jQuery General Discussion mailing list archive at Nabble.com.
[jQuery] Sortable
Hi,
I'm using sortable and must get the id of the element being moved.
Somebody help me?
My code:
$(function() {
$(#sortable).sortable();
$(#sortable).disableSelection();
});
div class=demo
ul id=sortable
li class=ui-state-default id=item_1Item 1/li
li class=ui-state-default id=item_2Item 2/li
li class=ui-state-default id=item_3Item 3/li
li class=ui-state-default id=item_4Item 4/li
li class=ui-state-default id=item_5Item 5/li
li class=ui-state-default id=item_6Item 6/li
li class=ui-state-default id=item_7Item 7/li
/ul
/div!-- End demo --
[jQuery] Re: Remove an li
thanks I have not seen nextAll yet.
On Jul 6, 5:47 am, Ricardo ricardob...@gmail.com wrote:
$(this).nextAll('.jcarousel-item-placeholder').remove();
http://docs.jquery.com/Selectors
On Jul 6, 1:05 am, expresso dschin...@gmail.com wrote:
I want to remove the following li and any after that which have the
class jcarousel-item-placeholder in them
li class=jcarousel-item jcarousel-item-horizontal jcarousel-item-4
jcarousel-item-4-horizontal jcarousel-item-placeholder jcarousel-item-
placeholder-horizontal jcarouselindex=4/
I'm not sure how to go about this.
[jQuery] Re: trigger validation by input:button
I have tried unsuccessfully to implement this solution, but I keep
getting the error:
validator is not defined
if (validator.element(#btnNext1)) {
Here is my code:
head
meta http-equiv=Content-Type content=text/html; charset=UTF-8 /
script type=text/javascript src=/scripts/jquery/
jquery-1.3.2.min.js/script
script type=text/javascript src=/scripts/jquery/jquery-validate/
jquery.validate.min.js/script
script type=text/javascript
$(document).ready(function(){
$.validator.addMethod(step, function(value, element, param) {
var isValid = true;
var elements = $(param).find(:input)
.not('input[type=hidden]')
.not(:submit, :reset, :image, :button, [disabled]);
alert(elements.length);
for (var i = 0; i elements.length; i++) {
if (!this.element(elements[i])){
isValid = false;
}
} return isValid;
}, );
$(#testForm).validate();
$(#btnNext1).click(function() {
if (validator.element(#btnNext1)) {
$(#step_1).hide();
$(#step_2).show();
}
});
});
/script
titleUntitled Document/title
/head
body
form id=testForm
div id=step_1
div id=step1control
input name=name type=text class=required /
/div
button id=btnNext1 value=Next class={step:'#step1control'}
nextbuttonNext/button
/div
div id=step_2
pStep 2/p
/div
/form
/body
On Jun 24, 12:56�am, Mac amcint...@bigmate.com.au wrote:
Hi Matt
I came across the same issue when I tried to create a wizard. I
overcame this by doing the following:
Write a validator extension that looks something like this and use the
add method to add it:
$.validator.addMethod(step, function(value, element, param) {
� � var isValid = true;
� � var elements = $(param).find(:input)
� � .not('input[type=hidden]')
� � .not(:submit, :reset, :image, :button, [disabled]);
� � for (var i = 0; i elements.length; i++) {
� � � � if (!this.element(elements[i])){
� � � � � � isValid = false;
� � � � }
� � } return isValid;
}, );
Attach this method to the button itself and pass it the elementid as
param like so:
button id=btnNext1 value=Next class={step:'#step1control'}
nextbuttonNext/button
The step1control can be a div containing all the elements that you
want to validate.
Then you need to run some code in the click event of the button to
check the button( and thus the step) is valid. eg:
$(#btnNext1).click(function() {
� � � � � � if (validator.element(#btnNext1)) {
� � � � � � � � $(#step_1).hide();
� � � � � � � � $(#step_2).show();
� � � � � � }
� � � � });
I have created wizards like this with the validator plugin multiple
times and seems to work okay!!Hope it helps!!
On Jun 12, 3:58�pm, Matt sean...@gmail.com wrote:
Hi,
I have been working on a big form and using jquery plug-in (wizard
form) to divide tit into small subforms. Now, I am trying to integrate
the Validation plugin to deal with the validation and come up with an
issue.
I run validation on subforms which contains two buttons(back, next).
Those 2 buttons are input:button type but not input:submit. I realise
the Validation plug-in would trigger the validation on submit event.
Is there any way I can modify the code so that it could handle my
requirement?
Having a look on the multipart demo which is the exact scenario I am
dealing with. However, the page below is not working. I tried on both
IE and FF.
http://jquery.bassistance.de/validate/demo/multipart/
Please advise.
Cheers,
Matt
[jQuery] function scope
In my $(document).ready(function() I have
function foo() {}
How can I access the foo function from a different jquery .js file?
thank you, very new
- eric
[jQuery] Re: Sortable
On Jul 6, 1:36 pm, Thales Lacerda thales...@gmail.com wrote:
Hi,
I'm using sortable and must get the id of the element being moved.
Somebody help me?
My code:
$(function() {
$(#sortable).sortable();
$(#sortable).disableSelection();
});
div class=demo
ul id=sortable
li class=ui-state-default id=item_1Item 1/li
li class=ui-state-default id=item_2Item 2/li
li class=ui-state-default id=item_3Item 3/li
li class=ui-state-default id=item_4Item 4/li
li class=ui-state-default id=item_5Item 5/li
li class=ui-state-default id=item_6Item 6/li
li class=ui-state-default id=item_7Item 7/li
/ul
/div!-- End demo --
As a note, you can sort DIV containers instead of LI items if that
helps. You could put whatever elements in each DIV container. In the
sortable jquery file, this.helper[0] is what is being dragged around.
It's a clone
var Item_Number = this.helper[0].find(HIDDEN).val();
[jQuery] Re: Remove an li
weird, I went to the selectors page but don't see nextAll
On Jul 6, 5:47 am, Ricardo ricardob...@gmail.com wrote:
$(this).nextAll('.jcarousel-item-placeholder').remove();
http://docs.jquery.com/Selectors
On Jul 6, 1:05 am, expresso dschin...@gmail.com wrote:
I want to remove the following li and any after that which have the
class jcarousel-item-placeholder in them
li class=jcarousel-item jcarousel-item-horizontal jcarousel-item-4
jcarousel-item-4-horizontal jcarousel-item-placeholder jcarousel-item-
placeholder-horizontal jcarouselindex=4/
I'm not sure how to go about this.
[jQuery] Re: function scope
You can't. You'll have to create a global variable outside document.ready:
var myFuncs = {};
$(document).ready(function() {
myFuncs.foo = function() {
// etc.
};
});
other .js file:
myFuncs.foo();
-- Josh
-Original Message-
From: jquery-en@googlegroups.com [mailto:jquery...@googlegroups.com] On
Behalf Of tecmo
Sent: Monday, July 06, 2009 5:11 PM
To: jQuery (English)
Subject: [jQuery] function scope
In my $(document).ready(function() I have
function foo() {}
How can I access the foo function from a different jquery .js file?
thank you, very new
- eric
[jQuery] Re: getJSON callback? does not work with querystring param
You mentioned Access to restricted URI denied, which is a cross-
domain error. Just as an FYI, making a request to a different port
number will trigger this. Something to always keep in mind when
working with ajax.
On Jul 6, 10:09 am, expresso dschin...@gmail.com wrote:
Ok, so their sending back a json response wrapped with method foo. So
then how would you specify foo in my example as the method to call on
the getJSON script I've created?
I think my example is fine as it is. We're not going cross server for
now but wanted to understand how to form this and how this worked a
little more. MK explained the response coming back, a huge part of
this! The jQuery docs need to explain this, it's pretty inferred to
some who have done this before, but not that obvious to others that
this is how it works...that you are essentially wrapping what you are
sending back in the method that you want to call in your callback.
On Jul 6, 10:56 am, Bill Ramirez betbuil...@gmail.com wrote:
If you pass a param to the json call, it gets passed into the
querystring:
$.getJSON(jsdata/customerhandler.ashx, { show: Math.random(),
departmentId: dptId}, customerLoaded);
would be rendered as:
jsdata/customerhandler.ashx?show=0.23231553departmentId=123
the second parameter to the getJson function is the query string
parameters.
[jQuery] Re: problem with events and tablesorter
If you are using progressive enhancement for table, pagination plugin seems to take the markup out of the DOM to store in jQuery object and then display only required number of rows. You can see this in the example of pagination plugin. http://tablesorter.com/docs/example-pager.html as well as in pagination script. Compare the number of rows in source, vs number of rows showing in firebug after pagination has occurred. Changing pages is appending appropriate rows to table . Appended elements introduced to DOM after page load *do not* have events bound to them. Are classes still applied to cells on page change ? Using jQuery live() or livequery plugin might help if they are. Another option might be to bind your functions to the table and target the cells( Event Delegation). Good tutorial how to do that http://www.learningjquery.com/2008/03/working-with-events-part-1 sso wrote: hi, I'm using table sorter. This problem only occurs on pages that aren't the first page. I have a class called 'clcls' on each individual cell in column. For testing purposes I have the click open an alert box. The class is applied to the cells, but on the second page in table sorter the clicks don't have any response. Can somebody make sense of this? Thanks! :)
[jQuery] Re: Mootools tooltip used inside of jquery??
If it was me I'd be saying "how can I change my Mootools code to
jQuery"? Why? You can't beat the documentation that surrounds jQuery!
When I originally probed around all the _javascript_ libraries
(YUI,Mootools,Prototype,Dojo) I realized pretty quickly that jQuery has
by far the best support when it comes to documentation , ease of
locating documentation and examples of use for everything! (YUI is
extremely well documented but not nearly as user friendly as jQuery and
doesn't have same level of DOM manipulation functionality)
Revisiting the Mootools site to see how their ajax worked as a
curiosity from your situation it didn't take me long to realize jQuery
was a very smart choice. There are a number of excellent tooltip
plugins for jQuery. Basing a framework decision on having to use a
tooltip seems somewhat short sited. Perhaps you are well acquainted
with Mootools, however I suspect not or you wouldn't be asking on
jQuery list how to resolve a Mootools issue.
Just an opinion but it might be worth comparing the two libraries from
a different perspective
Araceli Domnguez wrote:
Thanks Ricardo. And sorry for not sticking, this is quite urgent and
didn't know who could help me.
I have to use Mootols tooltip .. so how can I convert my jQuery code
to mootools? haven't I done it yet?
The code is here:
http://www.vivocomtech.net/vidzapper/jQuery_andMoo_tooltip.rar
(2 kb weight in two files, one .htm and the other .xml)
Thanks once again!
Ricardo escribi:
Stick to a single framework.. avoid confusion and save your users'
bandwidth. You should either convert your jQ code to mootools or use a
jQuery tooltip plugin.
And the whole thing you posted is unreadable, please use a sharing
site like jsbin.com or snipt.org :)
On Jul 6, 5:10am, Lleoun adoming...@vivocom.es wrote:
Hi all,
The code below shows three thumbnails with link and alt text . The
info is coming from the xml file and I'm using $.ajax to place it in
the page.
Now I want to add a tooltip that is using Mootools.
I have to add title="The tooltip::I want to read" class="tipz" to the
div (or to the image, changing the function) in order to use the
tooltip.
But when generating the code dynamically using $.ajax, the tooltip
code will work always for Safari (though it only shows half the
tooltip), but just sometimes for IE and Firefox.
When it does not work, the text shows like a normal alt tag text.
Using IE or Firefox just keep reloading the page and put your mouse
over the thumbnails to test it, you'll see what I mean.
I'm adding an example at the bottom of the page (the div called
example) so you can see how nicely it works in a static div.
Can it be done? Can I add the tooltip to the dynamically generated
code? Seems that the tooltip code go wrong when acts before the div is
created .. is that the problem? how can I solve it?
Thanks a ton!
script type="text/_javascript_" src="" moz-do-not-send="true"
class="moz-txt-link-rfc2396E"
href="http://player27.narrowstep.tv/assets/players/4351/xml/jquery.js">"http://player27.narrowstep.tv/
assets/players/4351/xml/jquery.js"/script
script language="_javascript_" type="text/ecmascript" src=""
moz-do-not-send="true" class="moz-txt-link-rfc2396E"
href="http://www.vivocom.tv/js/moo1.2.js">"http://www.vivocom.tv/js/moo1.2.js"/script
style
#thumb1{
position: absolute;
width:82px;
height:62px;
top:16px;
left:5px;
}
#thumb2{
position: absolute;
width:82px;
height:62px;
top:16px;
left:88px;
}
#thumb3{
position: absolute;
width:82px;
height:62px;
top:16px;
left:171px;
}
.tip { width:139px; font-
family:arial; COLOR: #fff; line-height: 16px; }
.tip-top{ }
.tip-title {PADDING-RIGHT: 8px;
PADDING-LEFT: 8px; FONT-FAMILY:Arial; FONT-WEIGHT: bold; FONT-SIZE:
12px; BACKGROUND: url(http://www.vivocom.tv/images/smoke.png) left
top; PADDING-BOTTOM: 4px; MARGIN: 0px; COLOR: #ff2228; PADDING-TOP:
8px }
.tip-text{PADDING-RIGHT: 8px;
PADDING-LEFT: 8px; FONT-FAMILY:Arial; FONT-SIZE: 11px; BACKGROUND: url
(http://www.vivocom.tv/images/smoke.png) right bottom; PADDING-BOTTOM:
8px; PADDING-TOP: 4p}
.tip-bottom { }
#example{
position: absolute;
width:100px;
height:100px;
top:96px;
left:171px;
}
/style
/style
script
window.addEvent('domready',function(){
//store titles and text
$$('div.tipz').each(function(element,index) {
var content = element.get
('title').split('::');
element.store('tip:title', content
[0]);
element.store('tip:text', content[1]);
});
//create the tooltips
var tipz = new Tips('.tipz',{
className: 'tipz',
fixed: false,
hideDelay: 50,
showDelay: 50
});
})
jQuery.ajax({
type:
[jQuery] centre ClueTip image content
I'm trying to get some thumbnail images that are displayed with
ClueTip to be centred vertically horizontally. The images are
various sizes, though none is larger than 150px on a side, so I set
ClueTip to have a width height of 200px.
The images are wrapped in a div so that I can have them display: none
by default, yet assign display: block to the images themselves.
div.DownloadStatsThumb { display: none; vertical-align: middle; }
img.DownloadStatsThumb { display: block; margin: auto; }
The markup looks like so:
a href=# rel=#thumb_456 title=foo/a
div class=DownloadStatsThumb id=thumb_456
img src=/path/to/some/image.jpg
width=150 height=101 alt=thumbnail image
class=DownloadStatsThumb /
/div
The images are always aligned left top. Eventually, I figured out
that it was div#cluetip-inner that was the culprit. While the outer
div has a height and width, the inner div has display:inline-block and
so was shrinking down to the img size, essentially. I then added:
onActivate: function(e)
{
$('#cluetip-inner')
.css('display', 'block')
.css('width', '186px')
.css('height', '186px')
.css('vertical-align', 'middle')
.css('background-color', '#000');
return true;
}
The 186px is to avoid getting scrollbars and the BG color is to assure
myself that it's resizing ok. However, the images remain centred
horizontally only. Is there something else I've missed?
[jQuery] Suggest scenario for pup-up form edit
Hi,
The scenario is:
On a page there's an area with some details. When user click there a
dialog opens to edit the fields.
User can click Close/Cancel or Save.
If Cancel - dialog gets closed.
If Save -the data gets posted and then one of the 2 scenariouses
happen:
1. Data is valid - dialog is closed. The information on the page is
updated with new data.
2. Data is invalid (validation errors or something) - dialog is
refreshed with all the fields and validation errors.
What exactly I'm interested in are:
1. How to post data from the Dialog to server?
2. What is the better way to post data and handle the result?
$('#dialog').load(url, params) will work to provide validation
errors.
3. Should the server return HTML if there're some validation errors
and JSON with updated data if all was ok?
Thanks,
Dmitriy.
[jQuery] Re: trigger validation by input:button
So I got the error to go away by using:
var validator = $(#testForm).validate();
But now the problem is that the button proceeds to the next step, even
if there are errors. I can't get it to not display #step_2 when there
are errors. It was suggested that I try using class={required:true}
on the input instead of class=required, but that didn't work. I
don't fully understand what the added method is doing, but it seems to
me like it's not being called or something. The statement if
(validator.element(#btnNext1)) always comes out true, even when I
tried explicitly setting var isValid = false; in the method. I've
uploaded a test page: http://www.angelo.edu/webservices/validateTest.html.
Any help would be greatly appreciated.
On Jul 6, 3:14 pm, Jon jon.wil...@angelo.edu wrote:
I have tried unsuccessfully to implement this solution, but I keep
getting the error:
validator is not defined
if (validator.element(#btnNext1)) {
Here is my code:
head
meta http-equiv=Content-Type content=text/html; charset=UTF-8 /
script type=text/javascript src=/scripts/jquery/
jquery-1.3.2.min.js/script
script type=text/javascript src=/scripts/jquery/jquery-validate/
jquery.validate.min.js/script
script type=text/javascript
$(document).ready(function(){
$.validator.addMethod(step, function(value, element, param) {
var isValid = true;
var elements = $(param).find(:input)
.not('input[type=hidden]')
.not(:submit, :reset, :image, :button, [disabled]);
alert(elements.length);
for (var i = 0; i elements.length; i++) {
if (!this.element(elements[i])){
isValid = false;
}
} return isValid;
}, );
$(#testForm).validate();
$(#btnNext1).click(function() {
if (validator.element(#btnNext1)) {
$(#step_1).hide();
$(#step_2).show();
}
});
});
/script
titleUntitled Document/title
/head
body
form id=testForm
div id=step_1
div id=step1control
input name=name type=text class=required /
/div
buttonid=btnNext1 value=Next
class={step:'#step1control'}
nextbuttonNext/button
/div
div id=step_2
pStep 2/p
/div
/form
/body
On Jun 24, 12:56 am, Mac amcint...@bigmate.com.au wrote:
Hi Matt
I came across the same issue when I tried to create a wizard. I
overcame this by doing the following:
Write a validator extension that looks something like this and use the
add method to add it:
$.validator.addMethod(step, function(value, element, param) {
var isValid = true;
var elements = $(param).find(:input)
.not('input[type=hidden]')
.not(:submit, :reset, :image, :button, [disabled]);
for (var i = 0; i elements.length; i++) {
if (!this.element(elements[i])){
isValid = false;
}
} return isValid;
}, );
Attach this method to thebuttonitself and pass it the elementid as
param like so:
buttonid=btnNext1 value=Next class={step:'#step1control'}
nextbuttonNext/button
The step1control can be a div containing all the elements that you
want tovalidate.
Then you need to run some code in the click event of thebuttonto
check thebutton( and thus the step) is valid. eg:
$(#btnNext1).click(function() {
if (validator.element(#btnNext1)) {
$(#step_1).hide();
$(#step_2).show();
}
});
I have created wizards like this with the validator plugin multiple
times and seems to work okay!!Hope it helps!!
On Jun 12, 3:58 pm, Matt sean...@gmail.com wrote:
Hi,
I have been working on a big form and using jquery plug-in (wizard
form) to divide tit into small subforms. Now, I am trying to integrate
the Validation plugin to deal with the validation and come up with an
issue.
I run validation on subforms which contains two buttons(back, next).
Those 2 buttons are input:buttontype but not input:submit. I realise
the Validation plug-in would trigger the validation on submit event.
Is there any way I can modify the code so that it could handle my
requirement?
Having a look on the multipart demo which is the exact scenario I am
dealing with. However, the page below is not working. I tried on both
IE and FF.
http://jquery.bassistance.de/validate/demo/multipart/
Please advise.
Cheers,
Matt
[jQuery] Re: trigger validation by input:button
It sounds like the validation is not attached to the click of the next button.
If you stick a breakpoint in the step method - does it hit the breakpoint?
Also - there is no space between button and id (buttonid=btnNext1
value=Next class={step:'#step1control'}
nextbuttonNext/button) in the html markup. This could cause jQuery to not
find the element with that id then not run the method. (could also just be
an error in pasting it into the email??)
Let me know!!
-Original Message-
From: jquery-en@googlegroups.com [mailto:jquery...@googlegroups.com] On Behalf
Of Jon
Sent: Tuesday, 7 July 2009 2:58 PM
To: jQuery (English)
Cc: Alletha McIntyre
Subject: [jQuery] Re: trigger validation by input:button
So I got the error to go away by using:
var validator = $(#testForm).validate();
But now the problem is that the button proceeds to the next step, even
if there are errors. I can't get it to not display #step_2 when there
are errors. It was suggested that I try using class={required:true}
on the input instead of class=required, but that didn't work. I
don't fully understand what the added method is doing, but it seems to
me like it's not being called or something. The statement if
(validator.element(#btnNext1)) always comes out true, even when I
tried explicitly setting var isValid = false; in the method. I've
uploaded a test page: http://www.angelo.edu/webservices/validateTest.html.
Any help would be greatly appreciated.
On Jul 6, 3:14 pm, Jon jon.wil...@angelo.edu wrote:
I have tried unsuccessfully to implement this solution, but I keep
getting the error:
validator is not defined
if (validator.element(#btnNext1)) {
Here is my code:
head
meta http-equiv=Content-Type content=text/html; charset=UTF-8 /
script type=text/javascript src=/scripts/jquery/
jquery-1.3.2.min.js/script
script type=text/javascript src=/scripts/jquery/jquery-validate/
jquery.validate.min.js/script
script type=text/javascript
$(document).ready(function(){
$.validator.addMethod(step, function(value, element, param) {
var isValid = true;
var elements = $(param).find(:input)
.not('input[type=hidden]')
.not(:submit, :reset, :image, :button, [disabled]);
alert(elements.length);
for (var i = 0; i elements.length; i++) {
if (!this.element(elements[i])){
isValid = false;
}
} return isValid;
}, );
$(#testForm).validate();
$(#btnNext1).click(function() {
if (validator.element(#btnNext1)) {
$(#step_1).hide();
$(#step_2).show();
}
});
});
/script
titleUntitled Document/title
/head
body
form id=testForm
div id=step_1
div id=step1control
input name=name type=text class=required /
/div
buttonid=btnNext1 value=Next
class={step:'#step1control'}
nextbuttonNext/button
/div
div id=step_2
pStep 2/p
/div
/form
/body
On Jun 24, 12:56 am, Mac amcint...@bigmate.com.au wrote:
Hi Matt
I came across the same issue when I tried to create a wizard. I
overcame this by doing the following:
Write a validator extension that looks something like this and use the
add method to add it:
$.validator.addMethod(step, function(value, element, param) {
var isValid = true;
var elements = $(param).find(:input)
.not('input[type=hidden]')
.not(:submit, :reset, :image, :button, [disabled]);
for (var i = 0; i elements.length; i++) {
if (!this.element(elements[i])){
isValid = false;
}
} return isValid;
}, );
Attach this method to thebuttonitself and pass it the elementid as
param like so:
buttonid=btnNext1 value=Next class={step:'#step1control'}
nextbuttonNext/button
The step1control can be a div containing all the elements that you
want tovalidate.
Then you need to run some code in the click event of thebuttonto
check thebutton( and thus the step) is valid. eg:
$(#btnNext1).click(function() {
if (validator.element(#btnNext1)) {
$(#step_1).hide();
$(#step_2).show();
}
});
I have created wizards like this with the validator plugin multiple
times and seems to work okay!!Hope it helps!!
On Jun 12, 3:58 pm, Matt sean...@gmail.com wrote:
Hi,
I have been working on a big form and using jquery plug-in (wizard
form) to divide tit into small subforms. Now, I am trying to integrate
the Validation plugin to deal with the validation and come up with an
issue.
I run validation on subforms which contains two buttons(back, next).
Those 2 buttons are input:buttontype but not input:submit.
[jQuery] Re: trigger validation by input:button
There definitely is a space between button and id. That must have just
been a side effect of the email.
Unfortunately, like I said, javascript is not my strength. I don't
even know what a breakpoint is. I starting to think I'm just in over
my head.
On Jul 7, 12:03 am, Alletha McIntyre amcint...@bigmate.com.au wrote:
It sounds like the validation is not attached to the click of the next button.
If you stick a breakpoint in the step method - does it hit the breakpoint?
Also - there is no space between button and id (buttonid=btnNext1
value=Next class={step:'#step1control'}
nextbuttonNext/button) in the html markup. This could cause jQuery to
not find the element with that id then not run the method. (could also
just be an error in pasting it into the email??)
Let me know!!
-Original Message-
From: jquery-en@googlegroups.com [mailto:jquery...@googlegroups.com] On
Behalf Of Jon
Sent: Tuesday, 7 July 2009 2:58 PM
To: jQuery (English)
Cc: Alletha McIntyre
Subject: [jQuery] Re: trigger validation by input:button
So I got the error to go away by using:
var validator = $(#testForm).validate();
But now the problem is that the button proceeds to the next step, even
if there are errors. I can't get it to not display #step_2 when there
are errors. It was suggested that I try using class={required:true}
on the input instead of class=required, but that didn't work. I
don't fully understand what the added method is doing, but it seems to
me like it's not being called or something. The statement if
(validator.element(#btnNext1)) always comes out true, even when I
tried explicitly setting var isValid = false; in the method. I've
uploaded a test page:http://www.angelo.edu/webservices/validateTest.html.
Any help would be greatly appreciated.
On Jul 6, 3:14 pm, Jon jon.wil...@angelo.edu wrote:
I have tried unsuccessfully to implement this solution, but I keep
getting the error:
validator is not defined
if (validator.element(#btnNext1)) {
Here is my code:
head
meta http-equiv=Content-Type content=text/html; charset=UTF-8 /
script type=text/javascript src=/scripts/jquery/
jquery-1.3.2.min.js/script
script type=text/javascript src=/scripts/jquery/jquery-validate/
jquery.validate.min.js/script
script type=text/javascript
$(document).ready(function(){
$.validator.addMethod(step, function(value, element, param) {
var isValid = true;
var elements = $(param).find(:input)
.not('input[type=hidden]')
.not(:submit, :reset, :image, :button, [disabled]);
alert(elements.length);
for (var i = 0; i elements.length; i++) {
if (!this.element(elements[i])){
isValid = false;
}
} return isValid;
}, );
$(#testForm).validate();
$(#btnNext1).click(function() {
if (validator.element(#btnNext1)) {
$(#step_1).hide();
$(#step_2).show();
}
});
});
/script
titleUntitled Document/title
/head
body
form id=testForm
div id=step_1
div id=step1control
input name=name type=text class=required /
/div
buttonid=btnNext1 value=Next
class={step:'#step1control'}
nextbuttonNext/button
/div
div id=step_2
pStep 2/p
/div
/form
/body
On Jun 24, 12:56 am, Mac amcint...@bigmate.com.au wrote:
Hi Matt
I came across the same issue when I tried to create a wizard. I
overcame this by doing the following:
Write a validator extension that looks something like this and use the
add method to add it:
$.validator.addMethod(step, function(value, element, param) {
var isValid = true;
var elements = $(param).find(:input)
.not('input[type=hidden]')
.not(:submit, :reset, :image, :button, [disabled]);
for (var i = 0; i elements.length; i++) {
if (!this.element(elements[i])){
isValid = false;
}
} return isValid;
}, );
Attach this method to thebuttonitself and pass it the elementid as
param like so:
buttonid=btnNext1 value=Next class={step:'#step1control'}
nextbuttonNext/button
The step1control can be a div containing all the elements that you
want tovalidate.
Then you need to run some code in the click event of thebuttonto
check thebutton( and thus the step) is valid. eg:
$(#btnNext1).click(function() {
if (validator.element(#btnNext1)) {
$(#step_1).hide();
$(#step_2).show();
}
});
I have created wizards like this with the validator plugin multiple
times and seems to work okay!!Hope it
[jQuery] Re: trigger validation by input:button
By the way. Do you have any examples of where you've implemented this
sort of thing? I'd like to see it in action somewhere. I learn well by
studying working examples.
On Jul 7, 12:03 am, Alletha McIntyre amcint...@bigmate.com.au wrote:
It sounds like the validation is not attached to the click of the next button.
If you stick a breakpoint in the step method - does it hit the breakpoint?
Also - there is no space between button and id (buttonid=btnNext1
value=Next class={step:'#step1control'}
nextbuttonNext/button) in the html markup. This could cause jQuery to
not find the element with that id then not run the method. (could also
just be an error in pasting it into the email??)
Let me know!!
-Original Message-
From: jquery-en@googlegroups.com [mailto:jquery...@googlegroups.com] On
Behalf Of Jon
Sent: Tuesday, 7 July 2009 2:58 PM
To: jQuery (English)
Cc: Alletha McIntyre
Subject: [jQuery] Re: trigger validation by input:button
So I got the error to go away by using:
var validator = $(#testForm).validate();
But now the problem is that the button proceeds to the next step, even
if there are errors. I can't get it to not display #step_2 when there
are errors. It was suggested that I try using class={required:true}
on the input instead of class=required, but that didn't work. I
don't fully understand what the added method is doing, but it seems to
me like it's not being called or something. The statement if
(validator.element(#btnNext1)) always comes out true, even when I
tried explicitly setting var isValid = false; in the method. I've
uploaded a test page:http://www.angelo.edu/webservices/validateTest.html.
Any help would be greatly appreciated.
On Jul 6, 3:14 pm, Jon jon.wil...@angelo.edu wrote:
I have tried unsuccessfully to implement this solution, but I keep
getting the error:
validator is not defined
if (validator.element(#btnNext1)) {
Here is my code:
head
meta http-equiv=Content-Type content=text/html; charset=UTF-8 /
script type=text/javascript src=/scripts/jquery/
jquery-1.3.2.min.js/script
script type=text/javascript src=/scripts/jquery/jquery-validate/
jquery.validate.min.js/script
script type=text/javascript
$(document).ready(function(){
$.validator.addMethod(step, function(value, element, param) {
var isValid = true;
var elements = $(param).find(:input)
.not('input[type=hidden]')
.not(:submit, :reset, :image, :button, [disabled]);
alert(elements.length);
for (var i = 0; i elements.length; i++) {
if (!this.element(elements[i])){
isValid = false;
}
} return isValid;
}, );
$(#testForm).validate();
$(#btnNext1).click(function() {
if (validator.element(#btnNext1)) {
$(#step_1).hide();
$(#step_2).show();
}
});
});
/script
titleUntitled Document/title
/head
body
form id=testForm
div id=step_1
div id=step1control
input name=name type=text class=required /
/div
buttonid=btnNext1 value=Next
class={step:'#step1control'}
nextbuttonNext/button
/div
div id=step_2
pStep 2/p
/div
/form
/body
On Jun 24, 12:56 am, Mac amcint...@bigmate.com.au wrote:
Hi Matt
I came across the same issue when I tried to create a wizard. I
overcame this by doing the following:
Write a validator extension that looks something like this and use the
add method to add it:
$.validator.addMethod(step, function(value, element, param) {
var isValid = true;
var elements = $(param).find(:input)
.not('input[type=hidden]')
.not(:submit, :reset, :image, :button, [disabled]);
for (var i = 0; i elements.length; i++) {
if (!this.element(elements[i])){
isValid = false;
}
} return isValid;
}, );
Attach this method to thebuttonitself and pass it the elementid as
param like so:
buttonid=btnNext1 value=Next class={step:'#step1control'}
nextbuttonNext/button
The step1control can be a div containing all the elements that you
want tovalidate.
Then you need to run some code in the click event of thebuttonto
check thebutton( and thus the step) is valid. eg:
$(#btnNext1).click(function() {
if (validator.element(#btnNext1)) {
$(#step_1).hide();
$(#step_2).show();
}
});
I have created wizards like this with the validator plugin multiple
times and seems to work okay!!Hope it helps!!
On Jun 12, 3:58 pm, Matt sean...@gmail.com wrote:
Hi,
I
