[jQuery] Re: Assinging the A:visted tag a class
:visited is a pseudo class, not an attribute, and cannot be directly
added to a link. In order to have control of how links look when they
are clicked or visited is to assign your own class. From what I
understand, you want to assign a class of current to any link that
is clicked. When another link is clicked, you want to assign it a
class of current but also remove the current class from all other
links. Is that right?
The code sample I provided does just that, or should do that, I didn't
actually test it. The current class should persist until another
link is clicked. Maybe I'm not fully understanding what you are trying
to do.
Let me know if I understand what you are trying to accomplish, then we
can go from there.
Brian
On May 14, 4:59 pm, wattaka [EMAIL PROTECTED] wrote:
Thanks for the tip Brian, but I am looking for a method that assigns
the A tags :visited attribute so that the class remains active for
the link till another link is clicked. The method you posted assigns
the class only when clicked and does not persist
On May 14, 10:18 pm, motob [EMAIL PROTECTED] wrote:
You'll need to add a click listener to each link, then when the user
clicks, add the class 'current'. When the user clicks another link you
can remove the current class from all links inside the div before
assigning the 'current' class back to the clicked link. You can do
something like this.
$(document).ready(function(){
$('#right a').click(function(){
$('#right a').removeClass(current); //remove the current class
from any link inside the div
$(this).addClass(current); //add the current class to the link
that was clicked.
});
});
Brian
On May 14, 3:24 pm, wattaka [EMAIL PROTECTED] wrote:
I am trying to assign a tags in a DIV a class when they are clicked
and and visited and remove the class when another tag in the DIV is
clicked, I tried this t activate the tag:
$('#right a').focus(function(){
$(this).addClass('current')
});
This assigns all the a tags in the right div the clas 'current' but
only when clicked on, can anyone give me a clue?
Thanks
[jQuery] Re: Defining regular expressions with # selector ??
I think this would be possible, but you would need to write a custom
selector expression. You can refer to this link:
http://www.malsup.com/jquery/expr/.
You might be able to get away with something like this.
jQuery.extend(jQuery.expr[':'], {
startsWithDiv1: function(a){
//a = DOM element being tested
if($(a).attr('id').indexOf('div1') != 0) {
return true;
}
return false;
}
});
Then you could use the selector like this $(:startsWithDiv1).
The above code will test to see if the id attribute contains 'div1',
but you can use a regular expression in place of the indexOf. If the
function returns true, then the element is selected, if false, the
element is not selected. I've never actually created my own custom
selector, so maybe someone else can chime in too.
Brian
On May 15, 7:55 am, Orcun Avsar [EMAIL PROTECTED] wrote:
Is it possible to define a regex with a # selector that will allow
select multible idies.
For example i want to select tags with idies those start with div1.
or some idies with more complexed match that can be find through a
regexp expression
[jQuery] Re: Defining regular expressions with # selector ??
CORRECTION TO THE ABOVE CODE.
the if statement needs to read: if($(a).attr('id').indexOf('div1') !=
-1)
On May 15, 10:41 am, motob [EMAIL PROTECTED] wrote:
I think this would be possible, but you would need to write a custom
selector expression. You can refer to this
link:http://www.malsup.com/jquery/expr/.
You might be able to get away with something like this.
jQuery.extend(jQuery.expr[':'], {
startsWithDiv1: function(a){
//a = DOM element being tested
if($(a).attr('id').indexOf('div1') != 0) {
return true;
}
return false;
}
});
Then you could use the selector like this $(:startsWithDiv1).
The above code will test to see if the id attribute contains 'div1',
but you can use a regular expression in place of the indexOf. If the
function returns true, then the element is selected, if false, the
element is not selected. I've never actually created my own custom
selector, so maybe someone else can chime in too.
Brian
On May 15, 7:55 am, Orcun Avsar [EMAIL PROTECTED] wrote:
Is it possible to define a regex with a # selector that will allow
select multible idies.
For example i want to select tags with idies those start with div1.
or some idies with more complexed match that can be find through a
regexp expression
[jQuery] Re: Assinging the A:visted tag a class
You'll need to add a click listener to each link, then when the user
clicks, add the class 'current'. When the user clicks another link you
can remove the current class from all links inside the div before
assigning the 'current' class back to the clicked link. You can do
something like this.
$(document).ready(function(){
$('#right a').click(function(){
$('#right a').removeClass(current); //remove the current class
from any link inside the div
$(this).addClass(current); //add the current class to the link
that was clicked.
});
});
Brian
On May 14, 3:24 pm, wattaka [EMAIL PROTECTED] wrote:
I am trying to assign a tags in a DIV a class when they are clicked
and and visited and remove the class when another tag in the DIV is
clicked, I tried this t activate the tag:
$('#right a').focus(function(){
$(this).addClass('current')
});
This assigns all the a tags in the right div the clas 'current' but
only when clicked on, can anyone give me a clue?
Thanks
[jQuery] Re: jquery doesn't work after changing innerhtml
When you use innerHtml it completely destroys the anchor tag and
replaces it with another one. Not sure if jQuery does this or the
browser, but when you destroy an element, all event listeners are
destroyed too. So you'll either have to re-initialize the click
listener when you use innerHtml, or just simply change the text of the
anchor tag like so:
$(a.xx).click(function(){
var $this = $(this);
event.preventDefault();
if($this.text() == click) {
$this.text(click again);
} else {
$this.text(click);
}
});
By changing the text of an element allows for the event listener to
remain in place, since the element itself didn't actually get
destroyed.
Hope this helps
On May 6, 4:58 am, biggie_mac [EMAIL PROTECTED] wrote:
I discovered this accidentaly today. I have an anchor like
div id=yya class=xx href=#click/a/div and a simple
jquery like
jQuery().ready(function() {
$(a.xx).click(function(event){
event.preventDefault();
alert('u clicked');
});
});
I run this, works fine, I get the alert when I click on the anchor.
Now I also have a button which when I click it changes the innerHTML
of the div with a class=xx href=#click again/a. basically it
changes an anchor with another which is the same but only has
different message. But it's still an anchor with xx class. Yet, when I
click on the second anchor, nothing happens. Anyone know why this
happens?Below the code I tried:
Js:
jQuery().ready(function() {
$(a.hide).click(function(event){
event.preventDefault();
alert('ai facut click pe un a cu class hide');
});
});
HTML:
div id=divba class=hide href=#click/a/div
input type=button value=click
onclick=document.getElementById('divb').innerHTML='a
class=quot;hidequot; href=quot;#quot;click2/a';;
10x
[jQuery] Re: event data ?
$('.mybutton').click(function(){
alert($(this).attr(id)); //get the id
$(this).attr(disabled, disabled); //disable the clicked button
});
On May 6, 3:33 am, Adwin Wijaya [EMAIL PROTECTED] wrote:
Hi
I got a problem ... I have more than 1 buttons and each buttons has
unique name.
I assign / bind the button with function like this :
$('.mybutton').bind('click',function(btn){ alert( btn.id); } );
every time i click on the buttons the alert always show undefined. How
to get the ID of button who clicked ? i want to get the id, change the
button to disabled ... how to do that one ...
and what is event.data actually is
thanks !
[jQuery] Re: extending objects with jquery
jQuery isn't really a javascript framework, so any extending and
inheritance issues need to be dealt with using JavaScript's prototype
chain. So you could do something like this:
function View(){
...
}
function DataGrid(){
...
}
DataGrid.prototype = new View(); //here is your inheritance
Now DataGrid has all of the methods that View has.
Maybe someone else has some other ideas, or an alternative way to
achieve a class-like structure.
On May 6, 11:13 am, Javier Martinez [EMAIL PROTECTED] wrote:
I'm moving from mootools to jquery and trying to port my UI framework
to jquery.
Some of my widgets are extending from another widget. For example a
datagrid and a dataview objects extends from view object
(because both uses same methods from view).
With Mootools I have something like this
Class View()
Class DataGrid ({
extends: View
})
Class DataView({
extends: View
})
What is the equivalent on jQuery?
Thanks!
[jQuery] Re: $ is not defined
When ever I get the $ not defined error, its because my core jQuery library is not there, for example when I switch from jquery.pack to jquery.min and I forget to change the script tag reference in the head. Just double check that its properly referenced and that jQuery is listed above jquery.form. On May 6, 12:45 pm, Jake McGraw [EMAIL PROTECTED] wrote: Could you provide an example of this online? - jake On Tue, May 6, 2008 at 12:33 PM, mdg583 [EMAIL PROTECTED] wrote: Hi, I don't know where this problem is coming from, but I find that over the course of a few jquery AJAX operations and a ajaxForm submit, for a little while I find that $ is not defined. Basically, I am loading a form into the current document using the jquery load function, and then setting up ajaxForm to submit this form and put the results into another div. This content that is finally loaded into this next div div has a javascript function near the beginning, and at the point in time when this script is reached, I find that $ is not defined. This happened once before and I just worked around it, but that is getting difficult. Does anyone know why this would be? I have jquery.form that says it requires jQuery v1.1 or later, and I have jQuery 1.2.1.
[jQuery] Re: event data ?
The best way to see what the btn object is all about is to download
and install firebug. Then use the console to output that object. for
example:
$('.mybutton').bind('click',function(btn){ console.log( btn); } );
Then on the console panel of firebug, you'll see the btn object, which
is clickable. If clicked, firebug will show you the DOM representation
of that object and all of its properties that are accessible.
On May 6, 9:22 am, Adwin Wijaya [EMAIL PROTECTED] wrote:
Thanks .. but I still curious what is inside the variable that passed
through function callback (btn in my example) and how to have access
on it.
On May 6, 6:39 pm, motob [EMAIL PROTECTED] wrote:
$('.mybutton').click(function(){
alert($(this).attr(id)); //get the id
$(this).attr(disabled, disabled); //disable the clicked button
});
On May 6, 3:33 am, Adwin Wijaya [EMAIL PROTECTED] wrote:
Hi
I got a problem ... I have more than 1 buttons and each buttons has
unique name.
I assign / bind the button with function like this :
$('.mybutton').bind('click',function(btn){ alert( btn.id); } );
every time i click on the buttons the alert always show undefined. How
to get the ID of button who clicked ? i want to get the id, change the
button to disabled ... how to do that one ...
and what is event.data actually is
thanks !
[jQuery] Re: .filter() and .not() approximately worthless - Table issue perhaps?
It looks like you want to select all .foo elements that are siblings,
but not the first .foo. You could try something like this $
(.foo).gt(0); This will get all .foo elements, then reduce the
collection by dropping off the first element.
On May 5, 4:50 am, {ajh} [EMAIL PROTECTED] wrote:
My experiences today with .filter() and .not() showed them to be
extremely buggy in my case. For example, .not(.foo + .foo) would
leave me with an empty set (though nothing should have been matching).
Is this because I was using them to select tr elements? Is there a
known issue with .filter() and tables?
If not, I could post an example if it breaking soon. I came up with a
workaround, but it was annoying.
[jQuery] Re: click(function(select) help
elle,
Since you're going to have 8 fieldsets, why don't you have some code
that will automatically close all of them when the change function is
called, then you can use a variable as your jQuery selector so you
don't have to use an IF statement. You could do something like this.
$(.product-type).change(function(){
var $value = $(this).val(); //this would store 'filters' for example
$(fieldsets.options).slideUp(slow); //close all fieldsets
$(fieldsets. + $value).slideDown(slow); //this will then show
the fieldset with 'filters' as a class.
});
This example should take care of all of your select option cases
without using an IF statement. You'll just have to make sure that each
one of your fieldsets has a class value of the respective option
value.
On May 2, 5:09 am, elle [EMAIL PROTECTED] wrote:
@Dave: when I selected the first product it showed me its options.
Changing an option didn't do a thing.
Clicking again on first product, hid its options.
@motob: I used this instead:
$(.product-type).change(function(){
if($(this).val() == filters){
$('fieldset.filters').slideDown(slow);
} else {
$('fieldset.filters').slideUp(slow);
}
});
Because I have about 8 products not only 2. It worked for one so, I
guess it will work for all 8 if I define it separately for each
product.
First of all thank you.
Second, is there anyway to streamline this code instead of repeating
it 8 times? or should I just bite the bullet?
What do you reckon?
Cheers,
Elle
On May 2, 12:35 am, motob [EMAIL PROTECTED] wrote:
Instead of adding click listeners to the option elements, add a change
listener to the overall select menu. Once the change event is fired,
determine which value is choosen, then show/hide the appropriate
option fieldset. NOTE: You may want to change the values of the option
elements so that they don't contain spaces. I'm not sure if those
spaces will cause problems or not.
$(document).ready(function(){
$(#product-type).change(function(){
if($(this).val() == product a){
$('fieldset.producta').slideDown(slow);
$('fieldset.productb').slideUp(slow);
}
else {
$('fieldset.productb').slideDown(slow);
$('fieldset.producta').slideUp(slow);
}
});
});
The above code is untested, but that is the basic idea of what you
would need to do.
On May 1, 4:57 am, Waz and Elle [EMAIL PROTECTED] wrote:
Hi again,
I have a form with products select menu. I would like to show and hide
product specific options as the user selects them. Now, I can show the
product options but I don't know how to hide them if the user selects
a different product.
My HTML is:
snip...
select id=product-type name=product-type class=product-type
option value=select
selected=selected-Select-/option
option value=product a
class=productaProduct A/option
option value=product b
class=productbProduct B/option
/select/p
fieldset class=producta options ... /fieldset
fieldset class=productb options ... /fieldset
snip
My code at the moment is:
$('#orderform').find('.options').hide();
$('.product-type').find('option.producta').click(function(select) {
$('fieldset.producta').slideDown(slow);
});
$('.product-type').find('option.productb').click(function(select) {
$('fieldset.productb').slideDown(slow);
});
So, if I change the user changes his/her mind between product a to
product b, the options stay visible, and I'm not sure how to hide them
again.
Also, if the user already entered information in the fieldset's
fields, should I reset them when I hide them?
Any advice will be great.
Thanks,
Elle
[jQuery] Re: Photo Crop proposal
Here is a link to the current UI cropper. Maybe you can help incorporate some additional features. http://ui.jquery.com/repository/real-world/image-cropper/ On May 5, 4:36 pm, Donald J Organ IV [EMAIL PROTECTED] wrote: Yes I understand that, sorry maybe my comments were a little harsh and not thought out well.we all have bad days. LTG wrote:Thank you for the replies, perhaps I didn't clarify: 1) I can find no crop plugins with this level of features. If there is a plug-in that comes close, for example with face cropping, by all means please provide a link. 2) Donald in case you haven't noticed, paying people to work on open source projects is done all the time (usually by larger companies). In fact it can be a very good thing for the community because more contributions get made more quickly. I think the open software movement is about more than just getting free stuff. On May 5, 10:32 am, Donald J Organ IV[EMAIL PROTECTED]wrote:Why would anyone pay for something that is based on opensource.
[jQuery] Re: click(function(select) help
Instead of adding click listeners to the option elements, add a change
listener to the overall select menu. Once the change event is fired,
determine which value is choosen, then show/hide the appropriate
option fieldset. NOTE: You may want to change the values of the option
elements so that they don't contain spaces. I'm not sure if those
spaces will cause problems or not.
$(document).ready(function(){
$(#product-type).change(function(){
if($(this).val() == product a){
$('fieldset.producta').slideDown(slow);
$('fieldset.productb').slideUp(slow);
}
else {
$('fieldset.productb').slideDown(slow);
$('fieldset.producta').slideUp(slow);
}
});
});
The above code is untested, but that is the basic idea of what you
would need to do.
On May 1, 4:57 am, Waz and Elle [EMAIL PROTECTED] wrote:
Hi again,
I have a form with products select menu. I would like to show and hide
product specific options as the user selects them. Now, I can show the
product options but I don't know how to hide them if the user selects
a different product.
My HTML is:
snip...
select id=product-type name=product-type class=product-type
option value=select
selected=selected-Select-/option
option value=product a class=productaProduct
A/option
option value=product b class=productbProduct
B/option
/select/p
fieldset class=producta options ... /fieldset
fieldset class=productb options ... /fieldset
snip
My code at the moment is:
$('#orderform').find('.options').hide();
$('.product-type').find('option.producta').click(function(select) {
$('fieldset.producta').slideDown(slow);
});
$('.product-type').find('option.productb').click(function(select) {
$('fieldset.productb').slideDown(slow);
});
So, if I change the user changes his/her mind between product a to
product b, the options stay visible, and I'm not sure how to hide them
again.
Also, if the user already entered information in the fieldset's
fields, should I reset them when I hide them?
Any advice will be great.
Thanks,
Elle
[jQuery] Re: Jquery UI Doc?
Clicking on draggable( options ) will give you this page: http://docs.jquery.com/UI/Draggables/draggable#options. From there, click on the options tab. The same holds true to access the droppable options. On Apr 30, 8:06 am, Giovanni Battista Lenoci [EMAIL PROTECTED] wrote: Hi, till now for my draggable and droppable effects I used Interface plugin. Now I want to take a look at jquery ui, but I'm wondering if exists a documentation better than the one on docs.jquery.com. For example: draggable( options )Returns: jQuery Creates new draggables on the nodeset supplied by the query. Where I can find info about the options ? If a doc doesn't exist, where I have to look inside the code? Thank you.
[jQuery] Re: Get number of times a link has been toggled or clicked?
@Hamish, yeah you're right, I was thinking that jQuery.data() was
available through the metadata plugin only. Didn't realize it was part
of jquery core, sweet!
On Apr 28, 6:35 pm, Hamish Campbell [EMAIL PROTECTED] wrote:
I don't think it's worth a whole plugin to to this - it is relatively
simple to add a counter to the toggle event functions, and to use the
data object to store your counts.
Eg:
$('a.toggle').toggle( function() {
$(this).data('count', 1 + ( $(this).data('count') || 0 ) );
$(this).css('color', 'red');}, function() {
$(this).css('color', 'green');
});
Now, every time I turn a 'toggle' link red, it will increment the
'count' data attached to the element.
If you're using it a lot, make a 'count' extension:
$.fn.extend({ count: $(this).data('count', 1 + ( $(this).data('count')
|| 0 )) });
Now, to count every toggle (ie, to red or green) you could do:
$('a.toggle').toggle( function() {
$(this).count();
$(this).css('color', 'red');}, function() {
$(this).count();
$(this).css('color', 'green');
});
At any time I could list all the counts for these elements by:
$('a.toggle').each(function(){
alert( $(this).text + ' was clicked ' + ( $(this).data('count') ||
0 ) + ' times!' );
});
Much easier that binding new events and trying to manage vars.
On Apr 29, 8:00 am, motob [EMAIL PROTECTED] wrote:
It is possible, but has to me manually recorded by you. The best way I
can think of is to use the meta data plugin (http://plugins.jquery.com/
project/metadata). You'll need to attach a click event onto each link
you want tracked, then you'll need to increment a counter and store
that counter as meta data for each link.
On Apr 28, 1:24 pm, Leanan [EMAIL PROTECTED] wrote:
Hey guys.
I was curious if it was possible to query how many times something
that has toggle bound to it has been clicked. Is this possible?- Hide
quoted text -
- Show quoted text -
[jQuery] Re: Jquery Ajax and Struts Issue
Perhaps more information is needed. I am able to call Struts actions through jQuery Ajax calls. In the URL option of my Ajax request, I simply put /mypage.do and as long as the action is set up properly in Struts, it works. Post your jquery code that makes that ajax request. On Apr 28, 7:19 am, RecursiveBrain [EMAIL PROTECTED] wrote: Hi Experts - Jquery is able to call the regular servlets defined in the web.xml but was not able to call the struts action servlet? Any insight into the issue would be of great help!! Thanks,
[jQuery] Re: Get number of times a link has been toggled or clicked?
It is possible, but has to me manually recorded by you. The best way I can think of is to use the meta data plugin (http://plugins.jquery.com/ project/metadata). You'll need to attach a click event onto each link you want tracked, then you'll need to increment a counter and store that counter as meta data for each link. On Apr 28, 1:24 pm, Leanan [EMAIL PROTECTED] wrote: Hey guys. I was curious if it was possible to query how many times something that has toggle bound to it has been clicked. Is this possible?
[jQuery] Re: How to collect values out of a bunch of input checkboxes?
Check out the jquery.form plugin found here: http://malsup.com/jquery/form/.
It has form serialization methods built in. I think it may be exactly
what you need.
On Apr 3, 10:45 am, Matt Wilson [EMAIL PROTECTED] wrote:
I have a form with a bunch of checkboxes. They all have the same
name and different values. This form posts to a page that does a bunch
a stuff based on the checked checkboxes.
I want to change the form to use AJAX to update a div on the page. I
need help figuring out how to post the form with AJAX.
I am using something like this right now:
var x = serialize_all_the_form_elements();
$(div#formresults).load(/save, x);
I am having trouble building that object x. Right now, to grab all
the checked checkboxes and put them into x, I do this:
x.checked_values = $(input:checkbox:checked).map(function ()
{ return this.value; });
However, when I send this over the network, x.checked_values gets
serialized as [Object object], which is useless.
Questions:
1. Is there a much simpler way to post a form with ajax so I don't
have to manually serialize everything?
2. How do I convert a list of checkbox jquery objects into an array of
strings?
TIA
Matt
[jQuery] blockUI and ie6 secure nonsecure
I am using the blockUI plugin to display a caveat message as soon as a
page loads. The user has to check the i agree checkbox then click
the ok button to access the page. When the ok button is clicked I
set a cookie and run $.unblockUI().
The site is running in secure mode and in IE6 I get the infamous
secure/nonsecure warning when the $.unblockUI() function is called.
I've tried changing the source of the iframe to: javascript:void(0);
and javascript:false;document.write(''); but no luck. I have also
tried using the bgIframe plugin but that doesn't make a difference
either.
I don't understand why that message appears when I'm unblocking the
document, I would expect it to appear as soon as the UI is blocked.
After a long battle I've decided to do this:
if($.browser.msie $.browser.version 7)
{
$(.blockUI).unbind().remove();
}
else
{
$.unblockUI();
}
The secure/nonsecure message doesn't appear anymore and from a user's
perspective everything works fine. Does anybody see anything wrong
with doing this for IE6?
FYI, I'm using the blockUI plugin in other areas of the site and its
worked perfectly, it's absolutely mind boggling why I'm getting it
now.
[jQuery] Re: Selector problem
Looks like you could do something like this:
$('.exp').click(function(){
$(this).siblings('.helpCont').slideToggle('slow');
});
This is assuming that each .exp and .helpCont is going to be contained
in its own .help parent div.
On Mar 27, 12:25 pm, chronotype [EMAIL PROTECTED] wrote:
Hello Everybody,
I have an intrasting problem (I'm sure it's trivial, but I don't know
how to do it):
HTML:
div class=help
div class=exp/div
pbAny questions?/b Click '+' for additional search information!
/p
p class=helpCont
But the hunt is not over. With well practised skill Hank skins the
mosquito.
(Hank produces an enormous curved knife and begins to start
skinning the tiny mosquito)
/p
/div
jQuery:
I'd like to catch the click event on exp div (formatted with css), and
I'd like to toggle the helpCont class this way:
$(document).ready(function(){
$('.exp').click( function() {
$(this + ' + .helpCont').slideToggle('slow');
});
});
(there are many exp class on the page for many type of elements (divs,
paragraphs...), that's why I don't want to do it this way, instead of
using onclick attribute in div.exp)
Thank's for the answers!
{chron}
[jQuery] Re: Problem fiding a certain text inside a table
You could try using regular expressions on the text inside of each TD.
Something like this:
$(this).find(td:contains('*')).each(function(){
$(this).text().replace(/\*/g, span class='highlight'*/span);
});
The above code is untested and may not work, but you get the picture.
On Mar 26, 3:00 pm, Feed [EMAIL PROTECTED] wrote:
Hello all,
I'm having a hard time trying to make a script. This is the whole
picture:
- I have lots of tables in the same page
- Each of those tables has a button that, once pressed, find and
highlight all '*' characters inside the table
What I'm thinking about doing is:
Find all TDs that contain '*' inside:
$(this).find(td:contains('*'));
Ok, this worked, I found the TDs but now I have to look inside
these TDs and highlight ONLY the * character how can I do it? I
need to find the * and then wrap it in a span... in the end there will
be something like this:
I found the span class=highlight*/span, yay!
Thanks in advance.
[jQuery] Re: Using a button that doesn't submit?
The code you listed doesn't have the return false...Add the return
false statement at the end of the .click() function like so...
$(document).ready(function() {
$('#add-image').click(function() {
$('#image-next').clone(true).attr('name', function() {
return this.name.replace(/(.+)(\d+$)/, function(s, p1, p2) {
return p1 + (parseInt(p2, 10) + 1);
})
})
.insertAfter('#image-div :last');
return false;
});
});
if you want to use a link to do the same thing, the exact principles
apply, add a return false statement to the click function. So if you
had a link of:
a href='#' id='add-image'Add New Image Field/a
your script would look like this:
$('#add-image').click(function(){
//your $image-next.clone code here...
this.blur; //removes the focus from the link (basically removes
that annoying dotted box).
return false; //prevent link bubbling.
});
On Mar 24, 3:07 pm, Rick Faircloth [EMAIL PROTECTED] wrote:
I tried inserting a return false; into my jQuery below,
but it prevented the button from functioning as it needs.
Here's the jQuery:
$(document).ready(function() {
$('#add-image').click(function() {
$('#image-next').clone(true).
attr('name', function() {
return
this.name.replace(/(.+)(\d+$)/, function(s, p1, p2) {
return p1 + (parseInt(p2, 10)
+ 1);
})
})
.insertAfter('#image-div :last');
});
});
And here's the button HTML:
button id=add-imageAdd New Image Field/button
Got any ideas on how I could modify this?
I was using a link to add the file fields, but the link
was refreshing the page and taking me back to the top of the page.
Rick
-Original Message-
From: jquery-en@googlegroups.com [mailto:[EMAIL PROTECTED] On Behalf Of Andy
Matthews
Sent: Monday, March 24, 2008 1:19 PM
To: jquery-en@googlegroups.com
Subject: [jQuery] Re: Using a button that doesn't submit?
If you're already using jQuery just return false on the submit method for
the form.
$('#myFormID').submit(function(){
// do stuff here
return false;
});
-Original Message-
From: jquery-en@googlegroups.com [mailto:[EMAIL PROTECTED] On
Behalf Of Rick Faircloth
Sent: Monday, March 24, 2008 12:15 PM
To: jquery-en@googlegroups.com
Subject: [jQuery] Using a button that doesn't submit?
Hi, all...
I'm using some jQuery to add file fields to a page.
I'm using a button to trigger the jQuery.
buttonAdd New Image Field/button
In IE6 and IE7 the button just adds fields like I want, however, in FF2, the
button submits the form.
How can I use the button with form submission?
I found plenty of info on Google about submitting a form without a button,
nothing on using a button in a form with causing submission...
Rick
[jQuery] Re: div index
Can you post a little more info? Maybe some of your html code that
goes along with what jquery is working with? Are you trying to add a
new criteria text box to a search form when #new-criteria is clicked?
Are you working with table cells or divs?
On Feb 12, 3:14 pm, Feijó [EMAIL PROTECTED] wrote:
How can I get the index of one of my class? I'm reading all in
docs.jquery.com and found nothing
$(#new-criteria).click(function(){
$last = $('#thefilter .qz-tablefield:eq(1)')
.clone(true);
index= 1;// here, how to get the index of this?
$('#qz-criteria .qz-tablefield:eq('+index+')').after($last);
});
ThanksFeijó
[jQuery] Re: Assigning an animation toggle to a checkbox to fade a table row in/out
Yes, fading table rows can be done, and you've almost got it. Right
now your javascript will fade out all table rows in the document when
any check box is clicked.
$(tr).animate({
opacity: 0.2,
}, 1000 );
So you need to change $(tr).animate(...) to something like $
(this).parent(tr).animate(...);
$(this).parent(tr) will target only the single row that contains the
clicked check box, which is what you want.
On Feb 11, 9:22 am, quirksmode [EMAIL PROTECTED] wrote:
I have created a table, at the end of each table row is a checkbox.
When the user selects the checkbox, that row will fade out to give the
illusion its now disabled. When the checkbox is unchecked I want the
row to fade back.
Can this be done? I have managed to do it rather crudely in the
following example:
Javascript...
script
$(document).ready(function(){
$(.deleteRow).click(function(){
$(tr).animate({
opacity: 0.2,
}, 1000 );
});
});
/script
Html...
table
tr
thHeading/th
thSecond Heading/th
thThird Heading/th
/tr
tr
tdtest row 1/td
tdinput name=input1 type=text //td
tdselect name=select1 option value =firstfirst/option/
select/td
td class=rightinput id=go name=deleteRow type=checkbox
class=deleteRow value=deleteRow //td
/tr
/table
Css...
style type=text/css
table{
width:500px;
border-collapse:collapse;
}
tr th{
font-weight:bold;
text-align:left;
}
tr td.right{
text-align:right;
}
tr{
border-bottom:1px solid #ccc;
}
/style
[jQuery] [SITE SUBMISSION] Sapitot Creative
Sapitot Creative is a Design firm that recently redesigned their website. jQuery is being used to enhance page transitions and to give a little flair to the print and web portfolio sections. What is real interesting is the unconventional use of jQuery-ui.tabs plugin for the main navigation. Check it out: www.sapitot.com
[jQuery] Re: [SITE SUBMISSION] Sapitot Creative
I had some trouble getting that history plugin to corporate with ui.tabs. I'll take another stab at it, maybe there are some updated documentation in that area. I had not run into that Loading... issue when I was running thru it, but I always waited until the transition finish. Ah the beauty of having other developers test. The loading... feature is automatic in the ui.tabs plugin. I'll see if I can use one of the callback functions to double check if the tab stuck on loading... and change it back to normal. Thanks Dan and Ben! Brian On Jan 30, 3:04 pm, Benjamin Sterling [EMAIL PROTECTED] wrote: Looks really nice, but I would second Dan's comments and would probably suggest you implement the history plugin. Being in the DC area, 508 compliance is a big sell. On 1/30/08, Dan G. Switzer, II [EMAIL PROTECTED] wrote: Sapitot Creative is a Design firm that recently redesigned their website. jQuery is being used to enhance page transitions and to give a little flair to the print and web portfolio sections. What is real interesting is the unconventional use of jQuery-ui.tabs plugin for the main navigation. Check it out:www.sapitot.com Overall it looks good. A couple of comments: 1) I'd change the URL each time one of the tabs is clicked--that way users can cut-n-paste the URLs and e-mail them. If possible, it'd also use meaningful hashes (like #store, #web, #print, #about, etc.) 2) Occasionally I was able to get the Loading... message that appears when you've clicked on a category to never go away. It seems to happen if you click on another menu option before the last animation has finished. (I suspect you're using a global variable to reset the value and this is getting overwritten.) -Dan -- Benjamin Sterlinghttp://www.KenzoMedia.comhttp://www.KenzoHosting.comhttp://www.benjaminsterling.com
[jQuery] clueTip activate
I want to use the clueTip plugin to give helpful advice or help to users filling out a specific form field. But I only want the clueTip to display if they type invalid characters. For example, I only want numbers to be typed into a field. If they type letters, or any other special characters, I want a clueTip to display suggesting that they fix it. I don't want the tip to appear when the user hovers over the field or clicks on it. Is it possible to disable clueTip's activate option and only have the tip display when triggered by another script? I'm using Denny Ferrassoli's (www.dennydotnet.com) typeWatch plugin to pattern match the user's input and if its invalid, I want to display the clueTip over the particular field. Any ideas? Thanks
[jQuery] Re: Selector for Toggled Element
try $(table:hidden) or some form of that. On Nov 1, 2:30 pm, studiobl [EMAIL PROTECTED] wrote: I'm trying to write an if statement based on the toggled state of an element (a table, in this case). Attempting to select the table by any combination of id, class, and/or element type doesn't work. Using Firefox, I can see that the table is toggled between display:table and display:hidden. The selector that jQuery appears do be using is element.style. This selector is apparently built on-the-fly, as it's not one of mine. I thought 'aha, select it by using $(element.style)!' This didn't work. Any suggestions on how to retrieve the display attribute of a toggled element?
[jQuery] Re: Getting a specific option in a select
Try removing the colon (:) after the option element, like so:
$('option[value*=\'2\']', $('#category_1')).size()
On Oct 8, 12:11 pm, Giovanni Battista Lenoci [EMAIL PROTECTED]
wrote:
Hi, I'm trying to get the option with a specific value in it.
This is the syntax I use and doesn't works:
alert($('option:[value*=\'2\']', $('#category_1')).size());
It alerts 0, if I try without the value I get the correct size of the
options in the select.
Where's the error?
Thank you
[jQuery] Re: How do I get this to fade in
You could do something like this:
$(.thumbnail li).click(function(){
var thumbnailHtml = $(this).html();
$(#large li).fadeOut(fast, function(){
$(this).html(thumbnailHtml).fadeIn(slow);
});
return false;
});
On Oct 8, 6:47 am, skinnytiger [EMAIL PROTECTED] wrote:
I'm using the below script to load html into a placeholder, it all
looks groovy but I want it to fade in, where do I add the .fadeIn() to
get this to work?
script type=text/javascript
$(document).ready(function(){
$(.thumbnail li).click(function(){
$(#large li).html($(this).html());
return false;
});
});
/script
[jQuery] Re: How to hide a div without a click function
You could also try using setTimeout() like so:
setTimeout(function()
{
$('#slidebar').toggle();
}, 2000);
This will activate the #slidebar toggle after 2000 milliseconds even
is the user is trying to interact with the #slidebar which may not be
what you want. I'm not sure what the slide bar is being used for but
if you wanted a more robust closing solution then you may want to make
use of timers to detect when the user is not using, or interacting
with #slidebar.
The following bit of code will detect when the user's mouse is no
longer interacting with #slidebar and close it after 2000
milliseconds.
$('#slidebartrigger').click(function(){
$('#slidebar').toggle().hover(function(){
//mouseover
clearTimeout(closetimer);
}, function(){
//mouseout
closetimer = window.setTimeout(function(){
$('#slidebar').hide();
}, 2000);
});
});
If the mouse cursor moves off of #slidebar then a timer is created
that will fire the $('#slidebar').hide() function after 2000
milliseconds. If the cursor moves back over the #slidebar (hovers)
then the timer is cleared and #slidebar will not close. This code
isn't tested so you might need to tweak it a bit. I am using something
similar on my project and it works great.
On Oct 3, 7:21 pm, Glen Lipka [EMAIL PROTECTED] wrote:
There is a pause plugin. Does that do the
trick?http://blog.mythin.net/projects/jquery.php
Glen
On 10/3/07, somnamblst [EMAIL PROTECTED] wrote:
I currently have this
$(document).ready(function() {
initSlideboxes();
function initSlideboxes()
{
$('#slidebar').show();
$('#slidebar').html($('#hidebar').html());
$('#slidebartrigger').click(function(){$('#slidebar').toggle();
});
};
});
I would like after a certain duration of several seconds to have the
slidebar div hide. I know how to do this in scriptaculous but I have
abandoned my scriptaculous solution for jquery.
[jQuery] Re: Problem with binding mouseout to only parent div
I would suggest using one of jQuery's menu plugins. There is a
standard practice for marking up menus and sub menus using lists
(ol). Look at this tutorial for suckerfish drop down menu (http://
www.alistapart.com/articles/dropdowns/). Once you have your menu
properly marked up take a look at the superfish plugin (http://
jquery.com/plugins/project/Superfish).
On Oct 3, 2:08 am, Brandon [EMAIL PROTECTED] wrote:
I've got a menu that does the basic a links and shows a sub menu of
divs with nested ulli's and other text dynamically with css and
javascript. I'm migrating it over to jquery, and have it all working
perfectly except for one thing. I am trying to get the menu to jump
back to the tab that corresponds to the current page upon mouseout of
the menu's parent div.
My code is basically this:
div id=menuholder
div id=menu
div id=toptabs
a..
a..
a..
/div
div id=tabcontentcontainer
div id=menustuff...
div id=menustuff...
div id=menustuff...
/div
/div
/div
Each toptabs a is binded (bound?) with a mouseover to show a
corresponding menu div. All that works fine.
What I'm not getting though, and am completely stumped about, is
stopping the mouseout event from triggering on the child div's and a's
underneath the menu div. I've got it kind of working to stop all
children and self, and just do mouseout on the parent div, which would
be the menuholder div, but it doesn't fire all of the time, if at
all... it sometimes works if i mouse over the edge very slowly.
Here's my code... maybe someone can shed some light on either stopping
the child mouseover binding or triggering the mouseout on the parent
smoother.
(var currenttab is defined in the head by php)
scriptvar currenttab = '$tabtitle';/script
$(document).ready(function(){
expandmenu(currenttab);
$(#menu)
.parent().mouseout(function(e){expandmenu(currenttab);})
.children().andSelf().mouseout(function(e){return false;});
$(#toptabs a).each(function() {
var rel = $(this).attr(rel);
$(this).mouseover(function(){ expandmenu(rel); });
});
});
function expandmenu(tabid){
$(#toptabs:visible,function(){
$(#toptabs [EMAIL PROTECTED]'+tabid
+']).addClass(current).siblings(a.current).removeClass();
$(#+tabid).show().siblings(div:visible).hide();
});
}
[jQuery] Re: Add Table row
Yes, this is possible. I'm doing the same type of thing on my app. You'll want to utilize the .clone() function. You could do something like this: var clonedRow = $(table tr :last).clone(); //this will grab the last table row. $(#formField, clonedRow).attr(id, newID); //use the selectors to manipulate any element in the clonedRow object. $(table).append(clonedRow); //add the row back to the table On Oct 1, 6:22 pm, camilo_u [EMAIL PROTECTED] wrote: Hi, I would like to use jQuery to add a row with form fields of a table to the end of the table, the idea is to duplicate the previous one it with all of the form fields (drop downs, input fields, hidden fields, etc.) changing the input ID of each input, clearing the input values and adding a Delete button at the end of the row to allow the user, Pretty much like Add new Row button that basically will add a new empty row following some sort of template changing the input IDs, clearing the values, and adding a Delete This row link at the end. Is this possible with jQuery? how can i do it? Thanks in advance! Camilo
[jQuery] Re: Slide up/down bug with table data in IE7
I think its more of an issue of IE not handling table tags properly. I've had some unexpected results when trying to slide table rows in my app. If you're wanting to slide up and down the entire table, try wrapping a div around it and slide the div. This worked for me when I needed to show and hide entire tables. On Oct 2, 4:51 pm, Andy Matthews [EMAIL PROTECTED] wrote: I have a module which contains a table of information. When I slide the module (to hide the info) it works just fine. When I slide it back down (to display the data) the table disappears. Is this a bug or a feature? Whatever it is, I need a fix for it. Anyone have any ideas? Andy Matthews Senior ColdFusion Developer Office: 877.707.5467 x747 Direct: 615.627.9747 Fax: 615.467.6249 [EMAIL PROTECTED]http://www.dealerskins.com/ dealerskinslogo.bmp 6KDownload
[jQuery] Re: IE shows nothing o.0
I think its a problem of how you're including the library. Try writing your script line like this: script type=text/javascript src=inc/js/ jquery-1.2.1.js/script. IE can't handle the self closing script tag. I know its lame, but thats IE for ya. On Sep 20, 12:28 am, John Resig [EMAIL PROTECTED] wrote: Do you have a full page online that we can look at? That line, alone, shouldn't cause any problems. --John On 9/19/07, [EMAIL PROTECTED] [EMAIL PROTECTED] wrote: Hi there, im new at jQuery and totaly new with JavaScript. But there is a huge Problem with jQuery an IE. To include jQuery i use that Line: script type=text/javascript src=inc/js/jquery-1.2.1.js / And since i have put this line to my Code IE shows only a blank white page. But it works fine with Opera and Firefox. Same thin with the StarterKit, it wont show up in the IE. How can i fix that Problem?
[jQuery] .min.js and .pack.js
Besides file size, what is the difference between a .min and .pack version of a js file? I see this a lot with the various plugins and jquery library. What are the pitfalls and benefits of using each?
[jQuery] Re: .min.js and .pack.js
Ah, thank you very much. On Aug 27, 11:36 am, Stephan Beal [EMAIL PROTECTED] wrote: On Aug 27, 2:51 pm, motob [EMAIL PROTECTED] wrote: Besides file size, what is the difference between a .min and .pack version of a js file? I see this a lot with the various plugins and jquery library. A very brief overview of each can be seen here: http://wanderinghorse.net/computing/javascript/jquery/colorpicker/ Scroll down to the bottom of that page. What are the pitfalls and benefits of using each? The only pitfall i'm aware of is that the packing process occasionally (very rarely) does something which changes the semantics of a piece of code (changes its meaning), leading to a bug which isn't there in the unpacked source. It is impossible for a human to decode the packed code, so debugging these problems is difficult. The so-called YUI minifier (see the above link) is newer and works similarly to the conventional packers, but does not suffer that problem, at least in theory.
