[jQuery] Re: What causes a query stri ng when requesting jQuery? e.g. /jquery-1.3.2 .min.js?_=12553…
Thanks very much to all who've been thinking about this problem.
@Michael, James: I've been working all morning to reproduce my
problem in code I can post, but I'm coming up empty. In fact, when my
app talks to a remote database I see no problems. I only see the
glitch when my app talks to a local database. This leads me to
believe that a bug in my code crops up when the database responds more
quickly than anticipated, or perhaps my local database returns bogus
data. My hunch is the latter. I'll have to rule out those
possibilities before blaming jQuery.
As far as jQuery goes, the only other snippet I use and haven't
mentioned is the following code for hijaxing links:
$(function() {
$(.links A).live(click,
function() {
var contentgoeshere= $(this).parent().parent();
$.get($(this).attr(href),
function(response) {
$(contentgoeshere).html(response);
});
return false;
});
});
This hijaxes links used for paging in my jQuery-UI tabs.
@Oliver: Loading jQuery.js from Microsoft's CDN didn't help.
[jQuery] Re: What causes a query string when request ing jQuery? e.g. /jquery-1.3.2.min.js?_=12553…
On Oct 12, 11:56 pm, Michael Geary m...@mg.to wrote:
This doesn't make any sense.
I agree!
You have a script tag that loads jQuery:
script src=/Scripts/jquery-1.3.2.min.js type=text/javascript/script
The GET that the browser issues for this script tag will not have a query
string. The browser isn't going to add a query string to the URL you give
it, intermittently or otherwise.
How could ajaxOptions affect this? That is code you run *after* loading
jQuery.
I believe this is the relevant section from the jQuery-1.3.2 source:
if ( s.cache === false type == GET ) {
var ts = now();
// try replacing _= if it is there
var ret = s.url.replace(/(\?|)_=.*?(|$)/, $1_= + ts
+ $2);
// if nothing was replaced, add timestamp to the end
s.url = ret + ((ret == s.url) ? (s.url.match(/\?/) ?
: ?) +
_= + ts : );
}
It's in the definition for the ajax function. When I set { cache:
false } in ajaxOptions, I get timestamps added to the end of my XHRs.
That makes sense. However, I still don't know why timestamps are
added to jQuery jQuery-UI.
Are you loading a second copy of jquery-1.3.2.min.js in an Ajax request or
something?
Nope. I verified this with Firebug Fiddler.
A failed Ajax call wouldn't cause another copy of jQuery to be loaded,
unless you somehow do that somewhere in your code.
I agree that this is the expected behavior. I'm not ready to file a
report yet, but I can't rule out this being a bug in jQuery, jQuery-
UI, or jQuery-UI Tabs.
[jQuery] Re: What causes a query stri ng when requesting jQuery? e.g. /jquery-1.3.2 .min.js?_=12553…
On Tue, Oct 13, 2009 at 11:14 AM, Bob baconeater...@gmail.com wrote:
It's in the definition for the ajax function. When I set { cache:
false } in ajaxOptions, I get timestamps added to the end of my XHRs.
That makes sense. However, I still don't know why timestamps are
added to jQuery jQuery-UI.
Clarification: I still don't know why timestamps are added to the
jQuery jQuery-UI source when ajaxOptions doesn't have the cache
option set.
[jQuery] What causes a query string when requesting jQuery? e.g. /jquery-1.3.2.min.js?_=12553…
I'm troubleshooting a page display glitch involving jQuery AJAX. When the glitch happens, Fiddler shows the following as one of the requests: GET /Scripts/jquery-1.3.2.min.js?_=1255309685187 Normally, the request has no query string and the response status code is 304: GET /Scripts/jquery-1.3.2.min.js However, every so often a query string is appended. Where does this query string come from? What does it mean? I wonder if the AJAX call fails, and then jQuery is refetched with that query string for some reason. The webserver is Visual Studio's Development Server, and I usually see this in IE8. Occasionally I'll see it in Firefox though. The app is ASP.NET MVC.
[jQuery] Re: What causes a query string when request ing jQuery? e.g. /jquery-1.3.2.min.js?_=12553…
@ace: I tried passing ajaxOptions: { cache: false} to jQuery-UI
Tabs and I think that did the trick! Is that what you were talking
about? I struggled with this for far longer than I care to admit.
Muchas gracias.
Fiddler now shows a similar timestamp query string appended to my
XHR. I guess the query string was being set by jQuery or jQuery-UI
after all.
[jQuery] Re: What causes a query string when request ing jQuery? e.g. /jquery-1.3.2.min.js?_=12553…
@Michael: I just pull the scripts in like this: script src=/Scripts/jquery-1.3.2.min.js type=text/javascript/ script script src=/Scripts/jquery-ui-1.7.2.custom.min.js type=text/ javascript/script @ace: Which cache option is that? Bob
[jQuery] Display fails when jQuery.js isn’t cached . When cached, page displayed OK.
I have jQuery UI Tabs which load their content via AJAX. About once every 15 times when the entire page is loaded (not just XHR), things fail and I don't see the proper content in the tab. The jQuery executes without error, but the page display is wrong. Fiddler showed me that when things fail I also see that jQuery.js and jQuery-ui.js are both sent to the browser in full (~100kB). Normally, a page load results in HTTP status code 304 for both of those files, they're not re-downloaded, and the page displays properly. When the status code is 200 and fresh copies of jQuery/UI are sent, things fail. I notice this most often in IE8, but that's because I use it for web development. I have seen it in Firefox, but for some reason I can't reproduce it now. Fiddler shows that the HTTP request asks for: GET /Scripts/jquery-1.3.2.min.js?_=1255309685187 HTTP/1.1 I can't figure out what the ?_=1255309685187 is for, but I'm guessing it's a token to indicate for how long the file should be cached. Since I can't reproduce the problem in Firefox right now, I don't know what Firebug says. Any insight would be appreciated.
[jQuery] Re: is(':checked') always returns false
Interesting discovery. Going back to the code that works, if I alert is
(':checked') in the working code, it also returns false ALWAYS, but
it still works.
Still looking for a solution.
[jQuery] Re: is(':checked') always returns false
Thanks for the link MorningZ
I obviously have issues elsewhere in my code, but I can't paste my
entire site here.
I'm looking for suggestions on what MIGHT be causing this since there
is no obvious error at the moment.
On Oct 1, 11:39 am, Bob bob.nel...@gmail.com wrote:
Interesting discovery. Going back to the code that works, if I alert is
(':checked') in the working code, it also returns false ALWAYS, but
it still works.
Still looking for a solution.
[jQuery] Re: is(':checked') always returns false
I've already done a site wide search. I only have one element with
that unique ID. That was my first thought too.
On Oct 1, 12:02 pm, James james.gp@gmail.com wrote:
Do you have another element on your site with id=msgCheckAllInbox?
IDs are suppose to be unique in the entire HTML document.
On Oct 1, 8:53 am, Bob bob.nel...@gmail.com wrote:
Thanks for the link MorningZ
I obviously have issues elsewhere in my code, but I can't paste my
entire site here.
I'm looking for suggestions on what MIGHT be causing this since there
is no obvious error at the moment.
On Oct 1, 11:39 am, Bob bob.nel...@gmail.com wrote:
Interesting discovery. Going back to the code that works, if I alert is
(':checked') in the working code, it also returns false ALWAYS, but
it still works.
Still looking for a solution.
[jQuery] Re: Table sorter
On Aug 6, 8:56 am, mila mshneyder...@gmail.com wrote: $(#myTable).tablesorter(); $(#myTable).tablesorter(); // had to do that twice for column sorting to work in both directions Thanks for mentioning this! I was going crazy seeing this behavior and couldn't figure it out.
[jQuery] International numeric formatting on the fly with multiple rounding options
To all: I have created a plugin that handles International numeric formatting on the fly by using a Reg Expression. Before I release this I would appreciate comments and suggestions for improvements. Demo can be viewed here http://decorplanit.com/plugin/index.htm Thanks in advance. Bob
[jQuery] Re: Form Plugin and Validation, I am totally lost even after doing the research.
Hi John,
johnHoysa wrote:
Actually I jumped the gun but hopefully soon I will figure this out.
My understanding is that both ajaxSubmit and validate are registered
on the Form submit event. So both events are fired at the same time.
Thus when the form's beforeSubmit callback fires, the validation
already executed. At least that is what I've observed :)
To get both working together I did the following (perhaps you can
enhance it to fit your needs):
// Define an indicator for validation success/fail status
var valid = false;
// Setup the validation options
var validationOptions {
// this callback is invoked on successful validation
submitHandler: function(form) {
// we set valid indicator to true
valid = true;
},
// this callback is invoked on failed validation
invalidHandler: function(form, validator) {
// we set valid indicator to false
valid = false;
} // add further validation options here
}
var formOptions {
beforeSubmit: preSubmit,
// define more form options here
}
// The Form preSubmit handler
function preSubmit(formData, jqForm, options) {
// If form validation failed we return false to stop Form submit
if (!valid) {
return false;
}
}
// Define
jQuery(#form).validate(validationOptions);
jQuery('#form').ajaxForm(formOptions);
Hope this is helpful.
kind regards
bob
[jQuery] .length value different in IE vs FF
I have a pretty simple character counter to count the number of
character typed by a user..
broadcastSubmit = $('#broadcastSubmitButton');
broadCastMessageDiv = $('#broadcastMessage');
availableChars = 140;
charCount = $('.char_count');
boilerPlateKeyword = $('#boiler_plate_keyword');
boilerPlateKeyword.text(keyword.toUpperCase());
broadCastMessageDiv.bind('keyup', function() {
broadCastDiv = $(this).val();
previewContentWindowTextLength = broadCastDiv.length;
boilerPlateText = $('#boiler_plate').val();
boilerPlateTextLength = boilerPlateText.length;
charCount.text(availableChars - (boilerPlateTextLength +
previewContentWindowTextLength) - 0);
});
This basically has a div with some preset text. (reply stop keyword to
cancel.)
and then a textarea that a user types an SMS message into. it combines
the user input with the preset text and subtracts it from the total
character limit (140)
my problem is IE is correct in the count, but FF and Safari are equal,
but wrong. they are showing more characters than there should be.
e.g. after typing in a message IE might be 28 available chars and
Safari and FF would be 20
Why would those browsers add more to the count? any ideas.
[jQuery] IE only browsers that break - need help
My code runs great in every browser but IE6 IE7 and IE8. it breaks and
causes all scripts to fail.
i setup Visual Web Developer in my VM like a blog post told me, and
when i load the page i get
Microsoft JScript runtime error: Object doesn't support this property
or method
that seem to break on this line
login_button = $('#login_button');
its basically my setup for the jQuery UI dialog.
This is the entire piece
$(document).ready(function() {
// buttons
login_button = $('#login_button');
whistle_button = $('#whistle_banner_btn');
victim_button = $('#victim_banner_btn');
join_button = $('#join_fight_banner_btn');
sub_blow_button = $('#blow_the_whistle');
sub_spread_word = $('#spread_the_word');
// divs
login_box = $('#login_box');
whistle_box = $('#whistle_box');
join_box = $('#join_box');
login_box.hide();
whistle_box.hide();
join_box.hide();
// div setups
login_box.dialog({width: 400, modal: true, resizable: false,
autoOpen: false});
whistle_box.dialog({width: 500, modal: true, resizable: false,
autoOpen: false});
join_box.dialog({width: 500, modal: true, resizable: false,
autoOpen: false});
// actions
login_button.click(function() {
login_box.dialog(open);
return false;
});
whistle_button.click(function() {
whistle_box.dialog(open);
return false;
});
victim_button.click(function() {
join_box.dialog(open);
return false;
});
join_button.click(function() {
join_box.dialog(open);
return false;
});
sub_blow_button.click(function() {
whistle_box.dialog(open);
return false;
});
sub_spread_word.click(function() {
join_box.dialog(open);
return false;
});
});
im not a js expert, so im hoping someone can point me in the right
direction..
[jQuery] Re: IE only browsers that break - need help
So after a continued search for a similar problem i finally found what
i think is the answer.
http://xqus.com/jquery-and-ie-headache
it appears the IE set a global variable for each element with the same
ID. so calling login_box = $('#login_box'); causes IE to fail.
you can either add var to the front e.g. var login_box = ... or you
can change the name of the variable itself. my_login_box etc...
from the man himself. hopefully this helps anyone who comes across the
same problem..
On May 27, 7:44 pm, Bob O sngndn...@gmail.com wrote:
My code runs great in every browser but IE6 IE7 and IE8. it breaks and
causes all scripts to fail.
i setup Visual Web Developer in my VM like a blog post told me, and
when i load the page i get
Microsoft JScript runtime error: Object doesn't support this property
or method
that seem to break on this line
login_button = $('#login_button');
its basically my setup for the jQuery UI dialog.
This is the entire piece
$(document).ready(function() {
// buttons
login_button = $('#login_button');
whistle_button = $('#whistle_banner_btn');
victim_button = $('#victim_banner_btn');
join_button = $('#join_fight_banner_btn');
sub_blow_button = $('#blow_the_whistle');
sub_spread_word = $('#spread_the_word');
// divs
login_box = $('#login_box');
whistle_box = $('#whistle_box');
join_box = $('#join_box');
login_box.hide();
whistle_box.hide();
join_box.hide();
// div setups
login_box.dialog({width: 400, modal: true, resizable: false,
autoOpen: false});
whistle_box.dialog({width: 500, modal: true, resizable: false,
autoOpen: false});
join_box.dialog({width: 500, modal: true, resizable: false,
autoOpen: false});
// actions
login_button.click(function() {
login_box.dialog(open);
return false;
});
whistle_button.click(function() {
whistle_box.dialog(open);
return false;
});
victim_button.click(function() {
join_box.dialog(open);
return false;
});
join_button.click(function() {
join_box.dialog(open);
return false;
});
sub_blow_button.click(function() {
whistle_box.dialog(open);
return false;
});
sub_spread_word.click(function() {
join_box.dialog(open);
return false;
});
});
im not a js expert, so im hoping someone can point me in the right
direction..
[jQuery] Re: jQuery Validation Plugin
Man i combed the docs for a day, and i missed that link everytime..
Thanks Jorn.
On May 23, 3:02 pm, Jörn Zaefferer joern.zaeffe...@googlemail.com
wrote:
You need to quote the full key, eg name['name']: required.
Seehttp://docs.jquery.com/Plugins/Validation#Fields_with_complex_names_
Jörn
On Fri, May 22, 2009 at 10:15 PM, Bob O bhan...@hcinsight.com wrote:
so as not to confuse..
the name attribute looks like this
name=name['name'] for the input field
and the js is
rules: {
name['name']: 'required'
}
i noticed typos in the above question.
On May 22, 12:36 pm, bhan...@hcinsight.com bhan...@hcinsight.com
wrote:
Can anyone tell me how i can change which attribute on my form field
triggers the validation?
currently it appears the be the name attribute. So in my Rails app
using Rails helpers, it sets the name to somthing like formname
['fieldname'] and the whole name.
in my script if i do something like
rules: {
formname['fieldname]: 'required'
}
etcit causes the script to break.
I need a workaround if anyone has ever come across this problem..
Thanks in Advance
[jQuery] Re: Jquery Email validation
look at the jQuery validation plugin.. its pretty slick. On May 22, 4:06 am, gladrinkz gladri...@gmail.com wrote: is ant one know how can i set email validation in jquery i am using .net
[jQuery] Re: jQuery Validation Plugin
so as not to confuse..
the name attribute looks like this
name=name['name'] for the input field
and the js is
rules: {
name['name']: 'required'
}
i noticed typos in the above question.
On May 22, 12:36 pm, bhan...@hcinsight.com bhan...@hcinsight.com
wrote:
Can anyone tell me how i can change which attribute on my form field
triggers the validation?
currently it appears the be the name attribute. So in my Rails app
using Rails helpers, it sets the name to somthing like formname
['fieldname'] and the whole name.
in my script if i do something like
rules: {
formname['fieldname]: 'required'
}
etcit causes the script to break.
I need a workaround if anyone has ever come across this problem..
Thanks in Advance
[jQuery] alert wont fire from page to page
I have a very simple piece of code.
$(document).ready(function() {
// var url = location.pathname;
alert(url);
});
When im on my home page it alerts the pathname like it should. but
when i navigate to the next page the alert does not fire
the firebug dom shows the new pathname..but the alert does not fire.
the js files are across all of my views and the js file that contains
this piece of code is in the source when viewed
any guidance would be great.
thanks
[jQuery] Re: alert wont fire from page to page
also in my code the line is not commented out...
I accidentally pasted that in there..
On Apr 15, 10:45 am, Bob O sngndn...@gmail.com wrote:
I have a very simple piece of code.
$(document).ready(function() {
// var url = location.pathname;
alert(url);
});
When im on my home page it alerts the pathname like it should. but
when i navigate to the next page the alert does not fire
the firebug dom shows the new pathname..but the alert does not fire.
the js files are across all of my views and the js file that contains
this piece of code is in the source when viewed
any guidance would be great.
thanks
[jQuery] Re: alert wont fire from page to page
nevermind...i found the problem.
On Apr 15, 10:46 am, Bob O sngndn...@gmail.com wrote:
also in my code the line is not commented out...
I accidentally pasted that in there..
On Apr 15, 10:45 am, Bob O sngndn...@gmail.com wrote:
I have a very simple piece of code.
$(document).ready(function() {
// var url = location.pathname;
alert(url);
});
When im on my home page it alerts the pathname like it should. but
when i navigate to the next page the alert does not fire
the firebug dom shows the new pathname..but the alert does not fire.
the js files are across all of my views and the js file that contains
this piece of code is in the source when viewed
any guidance would be great.
thanks
[jQuery] Re: How to tell apart focus event
Nobody knows?
[jQuery] ajax - no callback on timeout
Hi,
Does anybody know how to trigger timeout function.
If database does not respond in 5 seconds
I need to display some notification to user.
The following example did not trigger any callback after 5 seconds.
jQuery.ajax({
type: POST,
url: 'proccess.php',
timeout:5000,
dataType: json,
cache: false,
success: function (XHR, status, e) {
alert('success: ' + XHR + 'status: ' +
status + 'e: ' +
e);
}
,error: function (XHR, status, e) {
alert('error: ' + XHR + 'status: ' + status
+ 'e: ' + e);
}
,complete: function (XHR, status, e) {
alert('complete: ' + XHR + 'status: ' +
status + 'e: ' +
e);
}
});
// proccess.php
?php
sleep(30);
exit;
?
[jQuery] How to tell apart focus event
Hi,
form
Name: input type=text id=my_name name=my_name
/form
Is it possible to tell apart focus event?
jQuery(#my_name).focus(function (evt) {
if( ??? ){
//execute this if focus was triggered by user clicking on the
text
field
}
else {
//execute this if focus was triggered by method call like this
//document.getElementById(my_name).focus();
}
});
[jQuery] table filtering
I have a YUI datatable that im live filtering from a text field. The
problem im having is when i get a lot of records, its really slow..Ive
only been using jQuery for a few months now, so im a bit of a noob.
Any help refactoring this to make it run smoother would be great.
**HTML**
**search field
div class=search_member_wrap
label for=dt_inputSearch: /label
input id=dt_input type=text class=member_search_input
value=search members
/div
i dont have the table HTML cause it could prove to be more confusing.
but basically im filtering by 2 different td values set by YUI of
Phone Number and Name.
**Script**
// This is the member data table search filter
$(document).ready(function () {
var searchbox = $('.member_search_input');
var member_row = $('#members_data_table_wrap table tbody tr');
searchbox.click(function() {
$(this).val('');
});
searchbox.bind('change keyup', function() {
member_row.each(function() {
var number = $(this).find('.yui-dt0-col-PhoneNumber div').text
();
var name = $(this).find('.yui-dt0-col-Name div').text();
var search_check_value = (name + number);
var search_value = searchbox.val();
if (search_check_value.indexOf(search_value) -1) {
$(this).show();
} else {
$(this).hide();
}
});
});
});
[jQuery] height of hidden element
content for hidden_el is loaded by Ajax from random source
so the height of that element is not known up front.
I would like to use animation function to show element(expand) on
mouseover.
How do I find out the height of that element(final height for
animation purposes)
when content is already loaded but it is hidden?
span id=show_elShow element/div
div id=hidden_el style=display:none/div
jq('#show_el').mouseover(function(){
jq('#hidden_el').css({height: 0}).animate(
{height: ??},
{ duration: 200, queue: false, easing:
'easeOutBounce',complete:function(){ //some callback here} }
);
}
[jQuery] compare jQuery objects
How is it that I get false for the following?
Shouldn't I get true as a result? if not, why?
div id=home/div
$(document).ready(function(){
var one = $('#home');
console.log('compararison: ' + (one == $('#home')) ); // false !!!
});
How do I compare jQuery objects?
[jQuery] Re: compare jQuery objects
Well, that did not help much So what is the problem then? Why do I get false? How do I get true value?
[jQuery] show hide random rows
I was wondering if anyone could point me to a tutorial or blog where i can accomplish this task. Basically i have a YUI datatable and i want to use jQuery to hide all but a user generated number of rows that are random selected so if i had 50 records in the table and the user input 10 in a text field and hit a button.. 10 random records would be left displayed and the other 40 would be hidden..
[jQuery] li width bug in jCarousel
In jcarousel 0.2.3, in the reload() funtion, on line 269, there is
this code to compute the dimensions of the li's:
$('li', this.list).each(function(i) { ...
but won't that compute the dimensions of all li's in the document? It
should only be recomputing the dimensions of the child li's and so
should be something like:
var li = this.list.children('li');
$(li, this.list).each(function(i) { ...
Is that right or am I missing something?
[jQuery] Re: li width bug in jCarousel
Oops - I wasn't aware that the second parameter was the context - I was reading this as if both parameters were inside the quotes. Please ignore this note.
[jQuery] Cannot create jCarousels when not visible
I just lost a lot of time on this, so I'm posting it here to hopefully save others from the same fate. You cannot create jCarousels when they are not visible. The code that computes the dimensions uses offsetWidth and offsetHeight, which only work for visible elements. I had several tabs that had carousels but the elements were not drawing correctly in the tabs that started out behind - the width of the list was being set to 15. This was due to zeroes being returns for offsetWidth. I have now changed the code to defer population the carousel until it is visible and it is now working.
[jQuery] $(document).ready and window.onload
I am moving an app to the jquery framework. There is a good deal of script that I don't want to load until the landing page is up, and this includes dom node creation and manipulation that I want to tie in to the jquery event structure. This would seem to dictate window.onload instead of $(document).ready for this portion of the code and I suspect tying into the existing structure might be a challenge. Would appreciate some guidance here on working with both from anyone with experience in this area or a reference to a resource or tutorial. bob
[jQuery] Re: validation rules(remove) doesn't seem to work
Im a little new to the plugin myself, but do you have a form
id=myFormwrapping your inputs?
On Feb 24, 10:34 am, kathb4 kat...@googlemail.com wrote:
I am trying to use the validation plugin to validate a set of
checkboxes which are created by my CMS (drupal) so are not changeable
- and which look like this:
code
div class=form-item id=edit-pollutants-storage-tanks-wrapper
label class=optioninput type=checkbox name=pollutants
[tanks] id=edit-pollutants-storage-tanks value=tanks
class=form-checkbox / a. Tanks (Oil, fuel chemicals)/label
/div
div class=form-item id=edit-pollutants-rubbish-wrapper
label class=optioninput type=checkbox name=pollutants
[rubbish] id=edit-pollutants-rubbish value=rubbish class=form-
checkbox / b. Rubbish/label
/div...
/code
I want the user to select at least one of the pollutant checkboxes.
As you can see the name is in the format pollutants[].
I don't want to have to validate each option, cause I want them only
to have to choose one of the pollutants. I tried pollutans[] but
that didn't work.
So now I'm trying to do it by doing a combination of things
1. putting a required on the first one if count of checkboxes.size()==
0
2. looking for an onclick to remove the rule if any of the checkboxes
are then checked.
But the remove rule is not working.
code
$(inp...@name^='pollutants']).change(function(){
$(inp...@name^='pollutants']).rules(remove);
});
$(#myForm).validate({
rules: {
pollutants[tanks]: required
}
});
/code
Any suggestions? I am rather frustrated.
[jQuery] Validation and Facebox
Hello, Ive been using the Validation plugin on my site and it works fantastic. i have run into an issue with trying to get it to perform validation on a form that resides in a facebox. I setup the validation the same as any other form in the site. what could i be missing?
[jQuery] jQuery and IE
So im stumped..I have my jquery file in the headers, and it works in Opera, Safari, FF on mac, and FF on Windows, but i get nothing in IE..its there, its just broken. i recently added the validation plugin? could there be something im missing?
[jQuery] Re: jQuery and IE
sorry..new to the group thing here as well...
i have narrowed it down to this piece of code.
when i remove it all js works as written..
$(document).ready(function() {
$('#create_campaign_form').validate({
rules: {
name: {required: true, minlength: 3},
startDate: {required: true, date: true},
endDate: {required: true, date: true}
},
messages: {
name: {required: You must provide a Campaign Name.,
minlength: Your Campaign name must be at least 3 characterss long.},
startDate: required: You must provide a start date.,
endDate: required: You must provide an end date.
}
});
});
this piece of validation code causes the js to stop and nothing on the
page works..But this code does work in the other browsers..ive been
reading on the trailing comma, but im not seeing where that could be
faulting..
On Feb 24, 12:35 pm, Bob O sngndn...@gmail.com wrote:
So im stumped..I have my jquery file in the headers, and it works in
Opera, Safari, FF on mac, and FF on Windows, but i get nothing in
IE..its there, its just broken.
i recently added the validation plugin?
could there be something im missing?
[jQuery] Re: jQuery and IE
Thank you..i just figured that out..Appreciate all those that
commented..
Thanks
On Feb 24, 2:29 pm, James james.gp@gmail.com wrote:
Sorry I missed a comma after startDate and before endDate:
messages: {
name: {
required: You must provide a Campaign Name.,
minlength: Your Campaign name must be at least 3
characterss long.
},
startDate: {
required: You must provide a start date.
},
endDate: {
required: You must provide an end date.
}
}
On Feb 24, 11:28 am, James james.gp@gmail.com wrote:
messages: {
name: {
required: You must provide a Campaign Name.,
minlength: Your Campaign name must be at least 3
characterss long.
},
startDate: {
required: You must provide a start date.
}
endDate: {
required: You must provide an end date.
}
}
On Feb 24, 10:59 am, Bob O sngndn...@gmail.com wrote:
sorry..new to the group thing here as well...
i have narrowed it down to this piece of code.
when i remove it all js works as written..
$(document).ready(function() {
$('#create_campaign_form').validate({
rules: {
name: {required: true, minlength: 3},
startDate: {required: true, date: true},
endDate: {required: true, date: true}
},
messages: {
name: {required: You must provide a Campaign Name.,
minlength: Your Campaign name must be at least 3 characterss long.},
startDate: required: You must provide a start date.,
endDate: required: You must provide an end date.
}
});});
this piece of validation code causes the js to stop and nothing on the
page works..But this code does work in the other browsers..ive been
reading on the trailing comma, but im not seeing where that could be
faulting..
On Feb 24, 12:35 pm, Bob O sngndn...@gmail.com wrote:
So im stumped..I have my jquery file in the headers, and it works in
Opera, Safari, FF on mac, and FF on Windows, but i get nothing in
IE..its there, its just broken.
i recently added the validation plugin?
could there be something im missing?
[jQuery] Re: [ListNav] Solution to a severe performance problems with jQuery/ListNav and the Blueprint CSS framework
Hi Jack, Yes, I'll try to give it a try ASAP (I have a release of my own due on Wednesday, so I'll do my best). Cheers, Bob On 23-Feb-09, at 1:19 PM, Jack Killpatrick wrote: Bob, I have a new rev of listnav (hoping to release this week). Do you want to try this rev and see what happens? If so, let me know and I'll get it to you. Thanks, Jack Bob Hutchison Recursive Design Inc. http://www.recursive.ca/ weblog: http://www.recursive.ca/hutch
[jQuery] How to close dropdown
Hi,
I am trying to create a simple dropdown.
The problem I have is that I do not know how to close the dropdown.
It is supposed to close when user clicks on id=btn or anywhere
outside of dropdown.
That's what I tried but close does not work.
html
body
div id=wrapper
div id=btnOpen Menu/div
div id=some_menu style=display:noneSome Menu/div
/div
script type=text/javascript
jQuery(document).ready(function(){
jQuery('#btn').click( function(){
jQuery('#some_menu').show();
});
jQuery('body').click( function(){
var $some_menu = jQuery('#some_menu');
if($some_menu.is(':visible')){
$some_menu.hide();
}
});
});
/script
/body
/html
[jQuery] optimizing
hello,
Im trying to figure out a better way to do this. it works but its very
sluggish, so i think theyre might be a better way to iterate?
i have an input field = .searchbox
and then i have a YUI datatable that contains about 65 rows.
when i start to type in the search field, it iterates over all the
tr's looks at 2 cell text values and then uses the indexOf method to
determine whether or not to display the tr
is there a way that i can iterate once and put those values into cache
or something?
here is my code.
$(document).ready(function () {
var searchbox = $('.member_search_input');
var member_row = $('#members_data_table_wrap table tbody tr');
searchbox.click(function() {
$(this).val('');
});
searchbox.bind('change keyup', function() {
member_row.each(function() {
var number = $(this).find('.yui-dt1-col-PhoneNumber div
a').text();
var name = $(this).find('.yui-dt1-col-Name div').text();
var search_check_value = (name + number);
var search_value = searchbox.val();
if (search_check_value.indexOf(search_value) -1) {
$(this).show();
} else {
$(this).hide();
}
});
});
});
[jQuery] How to access a field in a form
Hi,
What is the best way to access a field in a form when I already have
an jQuery object referencing form.
function myFunction(formName, fieldName){
var formjQueryObject = jQuery('#'+formName);
var formField = jQuery(#+formName+ [name=' + fieldName +
']);
or can I somehow utilize formjQueryObject and make field
selection faster?
}
form name=myForm_1 id=myForm_1
input type=text name=login /
form name=myForm_2 id=myForm_2
input type=text name=login /
myFunction(myForm1, login);
[jQuery] Re: Dealing with Date Comparison
Thank you everyone for the responses
bjorsq your solution worked out great. Thank you for the help.
On Feb 4, 5:39 pm, bjorsq p...@bjorsq.net wrote:
To do this in JavaScript, you need to extract the text representation of the
date you have in the div, parse it, and set up a new JavaScript Date object
to compare against the current date/time. If your dates are formatted like
[day]/[month]/[year] (I'm in the UK), then this should work (but will need
some error checking in it to cope with blank or malformed dates):
$(document).ready(function() {
var now = new Date();
$('td.yui-dt0-col-LastActivity div').each(function() {
var divdate = new Date();
/* split the text date in the div */
var dateparts = $(this).text().split('/');
/* set the properties of the Date object
*for US format dates [month]/[day]/[year] the array indexes for months
and days need switching
*/
divdate.setDate(parseInt(dateparts[0]));
/* months are zero indexed! */
divdate.setMonth((parseInt(dateparts[1])-1));
divdate.setYear(parseInt(dateparts[2]));
/* compare dates - 14 days = (14*24*60*60*1000) milliseconds */
if (divdate.getTime() (now.getTime() - (14*24*60*60*1000))) {
$(this).addClass('highlight');
}
});
});
Bob O-2 wrote:
Can any one point me in the right direction for my issue.
I have a div with a text value pulled in from a database 01/01/2009
Im trying to write a javascript that can take that value and compare
it against new Date();
$(document).ready(function() {
now = new Date();
lastActivityDivs = $('td.yui-dt0-col-LastActivity div');
lastActivityDivs.each(function() {
if ($(this).val() == (now 14)) {
$(this).addClass('.highlight');
}
});
});
i know this isnt correct, but it gives you an idea of what im trying
to accomplish..
Any help would be great.
Thank you
--
View this message in
context:http://www.nabble.com/Dealing-with-Date-Comparison-tp21841297s27240p2...
Sent from the jQuery General Discussion mailing list archive at Nabble.com.
[jQuery] Dealing with Date Comparison
Can any one point me in the right direction for my issue.
I have a div with a text value pulled in from a database 01/01/2009
Im trying to write a javascript that can take that value and compare
it against new Date();
$(document).ready(function() {
now = new Date();
lastActivityDivs = $('td.yui-dt0-col-LastActivity div');
lastActivityDivs.each(function() {
if ($(this).val() == (now 14)) {
$(this).addClass('.highlight');
}
});
});
i know this isnt correct, but it gives you an idea of what im trying
to accomplish..
Any help would be great.
Thank you
[jQuery] how to get action attribute from form
Hi,
How do I get action attribute from the following form if I know id and
name values.
form name=myForm id=myForm method=post action=register.php
onsubmit=return false;
I tried those and it did not work:
$(form[name=myForm]).attr('action');
$(#myForm).attr('action');
[jQuery] Re: how to get action attribute from form
Sorry. Works now. I have mistyped action=register.php.
[jQuery] .text()
So below i have my code example.
Basically when a user loads this page depending on the type of
campaign this is, I want jQuery to show the proper Sub Form Piece. I
can get the alert() outside the if else to fire, but nothing inside
the if else fires, which leads me to believe that I might have the
args set incorrectly
any help would be great
Thanks
HTML **
div class=detail_campaign_typeCoupon/div --
This is the reference text that is dynamic
div id=campaign_create_coupon**Html Form Piece**/div
div id=campaign_create_contest **Html Form Piece**/div
$(document).ready(function() {
var $coupon_div = $('#campaign_create_coupon');
var $contest_div = $('#campaign_create_contest');
var $current_campaign = $('div.detail_campaign_type');
$current_campaign.ready(function() {
alert($('div.detail_campaign_type').text
()); -- This fires
if ($('div.detail_campaign_type').text() == 'Coupon') {
alert
('hello');
-- Inside the If Else does not register
$coupon_div.show();
$contest_div.hide();
}
else if ($('div.detail_campaign_type').text() == 'Contest') {
alert
('hello2');
-- Neither does this
$coupon_div.hide();
$contest_div.show();
}
});
});
[jQuery] Re: closure inside ajax method
Thanks everybody,
to Eric Garside : I have tried jQuery Automatic Script Includer
and it does not download scripts for me. Are there any known issues
that I should be aware of?
I placed this code inside of jquery.js right at the end.
(function($){
var scripts = /\?(.*)/, files = [], path = /^.*\//, loaded = 0, count
= 0;
$('script').each(function(){
var src = $(this).attr('src');
if (!scripts.test(src)) return;
var pathto = src.match(path);
files = files.concat($.map(src.match(scripts).pop().split(','),
function(e,i){
return pathto+e+'.js';
}));
})
count = files.length;
$.each(files, function(){
$.getScript(this, function(){
loaded++;
if(loaded == count $.isFunction(onBackload))
onBackload(loaded)
})
})
})(jQuery);
html
head
script type=text/javascript src=path/to/jquery.js/script
/head
body
divTest JS preloading/div
script src=path/to/xmlhttp.js?form,color/script
/body
/html
[jQuery] Re: closure inside ajax method
I think the following line is the problem
files = files.concat($.map(src.match(scripts).pop().split(','),
function(e,i){
count = files.length;
// gives me 0 or undefined
[jQuery] Re: closure inside ajax method
Thanks,
Can't closure be achieved with for loop?
for(var i=0; iscripts.length; i++){
My concern is:
Does
$.each
process the scripts array items in the exact order they are in the
array?
[jQuery] onblur Firing Ahead Of onclick
jQuery('form[name=myForm]').bind('submit', validateForm);
jQuery('#login').bind('focus', validateForm);
jQuery('#blur').bind('blur', validateForm);
Problem: when I click login text field and then Submit button
what happens is that instead of
alert('submit');
I get
alert('blur');
What can I do about it? I need to have
alert('submit'); triggered every time I click it.
form name=myForm id=myForm method=post onsubmit=return
false;
input type=text name=login id=login
input type=submit value=Submit/
function validateForm(e){
if(e.type=='submit'){alert('submit');}
if(e.type=='blur'){alert('blur');}
}
[jQuery] closure inside ajax method
Hi,
How can access index i inside of complete method?
The following gives me just the last value of i.
var scripts = ['script1.js', 'script2.js'];
for(var i=0; iscripts.length; i++){
jQuery.ajax({
dataType: 'script',
url: scripts[i],
complete: function (XMLHttpRequest, textStatus) {
debug('i = ' + i + ' complete:
textStatus = ' + textStatus);
}
});
}
[jQuery] Re: Superfish Navbar question
Yes, it does. Many thanks! On Jan 25, 4:55 am, Joel Birch joeldbi...@gmail.com wrote: Hi Bob, To add two multiple classes to one element, you put them both within the one class attribute and separate them with a space, like so: ul class=sf-menu sf-navbar ... /ul Hope this clears it up for you. Joel Birch.
[jQuery] Superfish Navbar question
I'm new at using jquery and superfish, and the documentation on the superfish site on how to configure it as a navbar seems kind of vague: To create a horizontal nav-bar with a horizontal second tier and optional vertical third tier, simply include the superfish-navbar.css file after the main superfish.css file and *add the class sf-navbar to the parent ul along with the usual sf-menu class*, and initialise as normal. (emphasis added) What does this mean, along with the usual sf-menu class? This can't mean that the parent ul should read ul class=sf-navbar class=sf-menu can it? Can someone please help me with this? I can't even get a basic navbar to run. Many thanks, Bob
[jQuery] How to hide all select form elements
Hi, Is it possible to hide all select form elements without using id or class atributes? select option value=''/option option value='AL'Alabama/option option value='AK'Alaska/option select ... jq(:select).hide(); // DOES NOT HIDE ANY SELECT ELEMENTS
[jQuery] nod names in from fields id
Hi,
How do i get nod names in for loop based on fields id?
var serverVals = {
'firstName':'John', //
'city':'NY',
'state':6,
'gender':1,
};
input type=text name=firstName id=firstName
select id=state name=state
option value='AL'Alabama/option
option value='AK'Alaska/option
input type=radio name=gender id=gender1 value=1 /Male
input type=radio name=gender id=gender2 value=2 /Female
for(var i in serverVals){
alert(jq('#'+i).nodeName); ??? undefined
//I would like to get
text
radio
...
}
[jQuery] submit form
Hi,
form name=myForm id=myForm method=post onsubmit=return false;
input type=submit id=myFormSubmit value=Submit/
$('#myFormSubmit').bind('click', validateForm);
validateForm = function(event){
if(???=='form'){
alert('form validation processing');
if(???=='myForm'){}
}
}
How do I get string 'form' and form name 'myForm' to check whether
form was submitted?
I know that I could check this
if($(event.target).attr('type')=='submit')
but is it possible in callback to get that string 'form' and form name
'myForm'
based on
$('#myFormSubmit').bind('click', validateForm);?
[jQuery] this inside of click event
Hi,
What does this inside of
$('.test').click(function() {
refer to?
script type=text/javascript
$(document).ready(function() {
$('.test').click(function() {
alert('this = ' + this);
});
});
/script
a href=# class=testClick Me/a
[jQuery] event name
var handler = function(e){
//How do I know what event triggered this function?
//this does not work:
alert('e = ' + e);
if(e==focus) alert(focus);
else if(e==blur) alert(blur);
}
jq('inp...@name=city]').bind(focus, handler);
jq('inp...@name=city]').bind(blur, handler);
[jQuery] get tag name
select name=month id=month
option value= SELECTED/option
option value=1 January/option
option value=2 February/option
function do_something_based_on_tag_name(selector) {
if(???=='select') {}
}
var selector = jq('#month');
do_something_based_on_tag_name(selector);
How do I get tag name from selector variable?
[jQuery] Re: iterate over json
Thanks a lot.
[jQuery] how to get form data
Hi,
I would like to keep jQuery('fo...@name=myform1]') in variable so that
I can utilize it
later on.
var myForm = jQuery('fo...@name=myform1]');
Is there a way I can access checkbox state and check the size?
The following does not work. It gives me 0 even when I some checkboxes
are selected.
alert( myForm.find('inp...@name=day]:checked').size() );
form name=myForm1 method=post
input type=checkbox value=1 name=day /labelSun/label
input type=checkbox value=2 name=day /labelMon/label
...
/form
form name=myForm2 method=post
input type=checkbox value=1 name=day /labelSun/label
input type=checkbox value=2 name=day /labelMon/label
...
/form
[jQuery] iterate over json
How do I dynamically access json values?
var myJSONObject = {formValues: [
{'name': 'Frank'},
{'city': 'London'},
{'age': 25}
]
};
The following gives me undefined.
$.each(myJSONObject.formVals, function(i,item){
alert('i = ' + i + ' item0 = ' + item[0] + ' item1 = ' + item
[1]);
});
[jQuery] hidden form field
How do I insert a value to hidden form field user_name?
form name=myForm id=myForm method=post
input type=hidden name=foo value=bar/
input type=hidden name=user_name value=/
/form
jQuery('form#myForm input:hidden ???').val('fast_fish');
Thats what I need:
input type=hidden name=user_name value=fast_fish/
[jQuery] change()
Hello all,
a little new the js and jquery any help would be fantastic...
I have this in my linked myFx.js file:
$(document).ready(function() {
var selected_type = $('select#campaign_type_select');
var coupon_div = $('#campaign_create_coupon');
var broadcast_div = $('#campaign_create_broadcast');
var contest_div = $('#campaign_create_contest');
// alert(selected_type.val()); I CAN GET THIS TO FIRE WHEN
UNCOMMENTED, and it returns the the value coupon as i would expect.
BUT THIS ISNT WORKING ive tried various renditions (this.val(),
selected_type, etc...) based on what i have read on this site and the
jQuery site with 0 success.
selected_type.change(function() {
if (this.val() == 'contest') {
alert('contest');
}
else if (this.val() == 'broadcast') {
alert('broadcast');
}
else (this.val() == 'coupon') {
alert('coupon');
}
});
});
This is the HTML:
div class=form_data_wrap
div class=form_data_labelCampaign Type:/div
div class=form_data_value
select id=campaign_type_select
option value=couponCoupon/option
option value=broadcastBroadcast/option
option value=contestContest/option
/select
/div
/div
Someone point me in the right direction.\m/.\m/
[jQuery] Re: change()
I must not be getting it, this is whati have now, and it is still not
working as needed.
$(document).ready(function() {
var $select = $('select#campaign_type_select');
var $value = $select.val();
var $coupon_div = $('#campaign_create_coupon');
var $broadcast_div = $('#campaign_create_broadcast');
var $contest_div = $('#campaign_create_contest');
$select.bind( 'change keydown', function() {
if ($(this).val() == 'contest') {
alert('contest');
$coupon_div.show();
$broadcast_div.hide();
$contest_div.hide();
}
else if ($(this).val() == 'broadcast') {
alert('broadcast');
$coupon_div.hide();
$broadcast_div.show();
$contest_div.hide();
}
else ($(this).val() == 'coupon') {
alert('coupon');
$coupon_div.hide();
$broadcast_div.hide();
$contest_div.show();
}
});
});
HTML -
div class=form_data_wrap
div class=form_data_labelCampaign Type:/div
div class=form_data_value
select id=campaign_type_select
option value=couponCoupon/option
option value=broadcastBroadcast/option
option value=contestContest/option
/select
/div
/div
On Jan 2, 2:48 am, Michael Geary m...@mg.to wrote:
In an event callback function such as the one that's called from .change(),
'this' is not a jQuery object. It is a simple DOM element. You need to wrap
it in $() to get a jQuery object if you want to use jQuery methods. Or, you
can use DOM properties directly.
I would also suggest using a $ prefix on a variable that represents a jQuery
object. It's a good visual reminder that you can use jQuery methods on that
variable.
Also, when using an ID selector, it generally isn't necessary to include the
tagname, and in fact the code will be faster if you omit it.
For example:
$(document).ready( function() {
var $select = $('#campaign_type_select');
alert( $select.val() );
$select.change( function() {
alert( $(this).val() );
});
});
Of course, in this particular case, since you already have the select
element wrapped in a jQuery object, $select and $(this) (inside the change
function) are the same thing, so you could also do:
$(document).ready( function() {
var $select = $('#campaign_type_select');
alert( $select.val() );
$select.change( function() {
alert( $select.val() );
});
});
BTW, I highly recommend triggering on both the change event and the keydown
event. This gives better usability when someone uses the keyboard:
$(document).ready( function() {
var $select = $('#campaign_type_select');
alert( $select.val() );
$select.bind( 'change keydown', function() {
alert( $(this).val() );
});
});
The only thing to watch out for there is that you want to know if the value
has actually changed on the keydown or not. This would take care of that:
$(document).ready( function() {
var $select = $('#campaign_type_select');
var value = $select.val();
alert( value );
$select.bind( 'change keydown', function() {
var newvalue = $(this).val();
if( newvalue != value ) {
value = newvalue;
alert( value );
}
});
});
-Mike
From: Bob O
Hello all,
a little new the js and jquery any help would be fantastic...
I have this in my linked myFx.js file:
$(document).ready(function() {
var selected_type = $('select#campaign_type_select');
var coupon_div = $('#campaign_create_coupon');
var broadcast_div = $('#campaign_create_broadcast');
var contest_div = $('#campaign_create_contest');
// alert(selected_type.val()); I CAN GET THIS TO FIRE
WHEN UNCOMMENTED, and it returns the the value coupon as i
would expect.
BUT THIS ISNT WORKING ive tried various renditions
(this.val(), selected_type, etc...) based on what i have read
on this site and the jQuery site with 0 success.
selected_type.change(function() {
if (this.val() == 'contest') {
alert('contest');
}
else if (this.val() == 'broadcast') {
alert('broadcast');
}
else (this.val() == 'coupon') {
alert('coupon');
}
});
});
This is the HTML:
div class=form_data_wrap
div class=form_data_labelCampaign Type:/div
div class=form_data_value
select id=campaign_type_select
option value=couponCoupon/option
option value=broadcastBroadcast/option
option value=contestContest/option
/select
/div
/div
Someone point me in the right direction.\m/.\m/
[jQuery] Re: change()
Actually ive been using firebug for a while as a CSS developer tool,
and i was trying to debug the script, im just not a js guru..
Thank you for your help ;-)
On Jan 2, 4:55 pm, Ricardo Tomasi ricardob...@gmail.com wrote:
The else statement doesn't accept a condition. Change 'else' to
'else if' and it should be fine, and start using Firebug for Firefox
so you can debug your scripts, or Visual Web Developer for IE.
On Jan 2, 2:04 pm, Bob O sngndn...@gmail.com wrote:
I must not be getting it, this is whati have now, and it is still not
working as needed.
$(document).ready(function() {
var $select = $('select#campaign_type_select');
var $value = $select.val();
var $coupon_div = $('#campaign_create_coupon');
var $broadcast_div = $('#campaign_create_broadcast');
var $contest_div = $('#campaign_create_contest');
$select.bind( 'change keydown', function() {
if ($(this).val() == 'contest') {
alert('contest');
$coupon_div.show();
$broadcast_div.hide();
$contest_div.hide();
}
else if ($(this).val() == 'broadcast') {
alert('broadcast');
$coupon_div.hide();
$broadcast_div.show();
$contest_div.hide();
}
else ($(this).val() == 'coupon') {
alert('coupon');
$coupon_div.hide();
$broadcast_div.hide();
$contest_div.show();
}
});
});
HTML -
div class=form_data_wrap
div class=form_data_labelCampaign Type:/div
div class=form_data_value
select id=campaign_type_select
option value=couponCoupon/option
option value=broadcastBroadcast/option
option value=contestContest/option
/select
/div
/div
On Jan 2, 2:48 am, Michael Geary m...@mg.to wrote:
In an event callback function such as the one that's called from
.change(),
'this' is not a jQuery object. It is a simple DOM element. You need to
wrap
it in $() to get a jQuery object if you want to use jQuery methods. Or,
you
can use DOM properties directly.
I would also suggest using a $ prefix on a variable that represents a
jQuery
object. It's a good visual reminder that you can use jQuery methods on
that
variable.
Also, when using an ID selector, it generally isn't necessary to include
the
tagname, and in fact the code will be faster if you omit it.
For example:
$(document).ready( function() {
var $select = $('#campaign_type_select');
alert( $select.val() );
$select.change( function() {
alert( $(this).val() );
});
});
Of course, in this particular case, since you already have the select
element wrapped in a jQuery object, $select and $(this) (inside the change
function) are the same thing, so you could also do:
$(document).ready( function() {
var $select = $('#campaign_type_select');
alert( $select.val() );
$select.change( function() {
alert( $select.val() );
});
});
BTW, I highly recommend triggering on both the change event and the
keydown
event. This gives better usability when someone uses the keyboard:
$(document).ready( function() {
var $select = $('#campaign_type_select');
alert( $select.val() );
$select.bind( 'change keydown', function() {
alert( $(this).val() );
});
});
The only thing to watch out for there is that you want to know if the
value
has actually changed on the keydown or not. This would take care of that:
$(document).ready( function() {
var $select = $('#campaign_type_select');
var value = $select.val();
alert( value );
$select.bind( 'change keydown', function() {
var newvalue = $(this).val();
if( newvalue != value ) {
value = newvalue;
alert( value );
}
});
});
-Mike
From: Bob O
Hello all,
a little new the js and jquery any help would be fantastic...
I have this in my linked myFx.js file:
$(document).ready(function() {
var selected_type = $('select#campaign_type_select');
var coupon_div = $('#campaign_create_coupon');
var broadcast_div = $('#campaign_create_broadcast');
var contest_div = $('#campaign_create_contest');
// alert(selected_type.val()); I CAN GET THIS TO FIRE
WHEN UNCOMMENTED, and it returns the the value coupon as i
would expect.
BUT THIS ISNT WORKING ive tried various renditions
(this.val(), selected_type, etc...) based on what i have read
on this site and the jQuery site with 0 success.
selected_type.change(function() {
if (this.val() == 'contest') {
alert('contest');
}
else if (this.val() == 'broadcast') {
alert
[jQuery] Re: [ListNav] Solution to a severe performance problems with jQuery/ListNav and the Blueprint CSS framework
Hi Jack, On 31-Dec-08, at 3:27 AM, Jack Killpatrick wrote: Hi Bob, I created the listnav plugin. Thanks for the nice comments about it in your post, glad you like it. I certainly do. Nice work! I'm curious about the issue you're seeing when using Blueprint CSS. In your post you said that the issue goes away if you remove the blueprint screen.css file. You mean if you remove that, but keep listnav in place, right? Yes, the only change is to remove the blueprint/screen.css style sheet. I can leave all the other ones in place, including the others that come with blueprint. Does the perf change much if you remove listnav and keep blueprint screen.css? Yes, the problem goes away as well. It would have been very tempting to leave it at that, but the differences between browsers was a flag that it wasn't this simple. I probably should have been a little more explicit about that, if the jQuery document ready function is removed -- which is equivalent removing listnav in the simplified version I had worked down to -- the performance problem goes away. Is there a way I can take a look at your example? I'd like to give it a look and see if anything jump out at me. Yes, actually. I put some demonstration stuff on one of my websites yesterday afternoon, but annoying internet connection problems (it is winter here) prevented me letting anyone know. Here's a link: http://www.raconteur.info/stuff/strange-css-js-problem/fast-for-webkit.html There is a link on that page to the slow version, so you can flip back and forth. I'm seeing a flash on safari like I reported on FF from that URL. Even more interesting, occasionally (rarely, but annoyingly often the *first* time, sigh) Safari doesn't show the problem. If you download all the files from this tarball: http://www.raconteur.info/stuff/strange-css-js-problem/strange-css-js-problem.tgz and play with it locally (e.g. a file: URL) you'll not see the flash in Safari after the cache is loaded. Something to do with latency affecting the timing?? Maybe the css is being delayed just enough? Cheers, Bob Thx, Jack Bob Hutchison wrote: Hi, [reposted, didn't appear in archives... sorry for the noise] I've encountered, and worked around, a rendering performance problem in WebKit based browsers. I'm working on a webapp and a particular uncontrived page is rendered by FireFox in about 0.5s while Safari takes about 12s -- that's about 20 times slower. And 12s is way too long from any user's point of view. I really don't know how jQuery/ListNav and the Blueprint CSS stylesheet are interacting, and I certainly don't know whose 'fault' it is, but I do know it can be avoided by applying the style sheet after ListNav has finished doing it's thing on the page. I've written in more detail about this on my weblog: http://recursive.ca/hutch/2008/12/30/how-to-destroy-page-rendering-performance-using-just-javascript-and-css/ Cheers, Bob Bob Hutchison Recursive Design Inc. http://www.recursive.ca/ weblog: http://www.recursive.ca/hutch
[jQuery] [ListNav] Solution to a severe performance problems with jQuery/ListNav and the Blueprint CSS framework
Hi, [reposted, didn't appear in archives... sorry for the noise] I've encountered, and worked around, a rendering performance problem in WebKit based browsers. I'm working on a webapp and a particular uncontrived page is rendered by FireFox in about 0.5s while Safari takes about 12s -- that's about 20 times slower. And 12s is way too long from any user's point of view. I really don't know how jQuery/ListNav and the Blueprint CSS stylesheet are interacting, and I certainly don't know whose 'fault' it is, but I do know it can be avoided by applying the style sheet after ListNav has finished doing it's thing on the page. I've written in more detail about this on my weblog: http://recursive.ca/hutch/2008/12/30/how-to-destroy-page-rendering-performance-using-just-javascript-and-css/ Cheers, Bob
[jQuery] [ListNav] Solution to a severe performance problems with jQuery/ListNav and the Blueprint CSS framework
Hi, I've encountered, and worked around, a rendering performance problem in WebKit based browsers. I'm working on a webapp and a particular uncontrived page is rendered by FireFox in about 0.5s while Safari takes about 12s -- that's about 20 times slower. And 12s is way too long from any user's point of view. I really don't know how jQuery/ListNav and the Blueprint CSS stylesheet are interacting, and I certainly don't know whose 'fault' it is, but I do know it can be avoided by applying the style sheet after ListNav has finished doing it's thing on the page. I've written in more detail about this on my weblog: http://recursive.ca/hutch/2008/12/30/how-to-destroy-page-rendering-performance-using-just-javascript-and-css/ Cheers, Bob Bob Hutchison -- tumblelog at http://www.recursive.ca/so/ Recursive Design Inc. -- weblog at http://www.recursive.ca/hutch http://www.recursive.ca/ -- works on http://www.raconteur.info/cms-for-static-content/home/
[jQuery] define and invoke class inside $(document).ready
Is that a correct way to create class utilizing jQuery?
var myClass = null;
$(document).ready(function(){
function MyClass(){
this.imagesHolder = null;
}
MyClass.prototype.init = function (){
this.imagesHolder = jQuery(#imgs);
}
myClass = new MyClass();
});
[jQuery] Re: define and invoke class inside $(document).ready
Yep, I intend to use myClass outside of document ready.
I thought that in order to use jQuery as follows
this.imagesHolder = jQuery(#imgs);
inside of MyClass I would have to enclose it inside
$(document).ready(function(){...
so that DOM is ready before invoking MyClass.
Is my assumption wrong?
[jQuery] Re: How do I cache
Temporary Internet Files and Proxies(Public caching)
[jQuery] How do I cache
I would like to have a registration form cached for 1 year public and
private.
How do i go about it.
Thats what I tried and register.html was not cached.
jq.ajax({
type: POST,
url: http://www.example.com/register.html;,
dataType: html,
cache: true,
success: function(response) {}
});
=
content of register.html
div
form name=registerForm method=post onsubmit=return false;
autocomplete=off
input type=text name=username id=username value=/
input type=password name=pass id=pass value=/
input type=text name=email id=email value=/
/form
/div
[jQuery] using jquery to implement google maps on phpbb3
I have a small phpbb3 bulletin board and I'm trying to implement
google maps via a mod/bb code solution.
I have got it working where I can embed a single map. But
unfortunately, when a 2nd map is added to a thread, the first one
disappears. I've isolated this as having to do with the div tag id
used by the javascript. I've tried creating a random number for the id
code in js. But that doesn't work either, as the variable name is the
same for both instances of the map.
sigh...
I just today stumbled on jquery and was told there was a way to keep
each div id unique when multiple instances of the script are on the
page.
The javascript (along with the google maps api for my site) is below:
There are three phpbb bbcode variables in this code. SIMPLETEXT1,
SIMPLETEXT2 AND NUMBER They correspond to location, description and
the zoom for the map.
As noted, the map works in a single instance. But the next time
someone posts a map, the first one doesn't display. Does anyone know
how to use jquery to write the div id so that this actually works?
I will be forever in your debt for any help with this.
-bob
script src=http://www.google.com/jsapi?
key=ABQIM79iA8VQkkozpKHIqSxUhRSXnAaMq2fjh449SYdBhdqqjpIXQBQfhT6m4WhePFr1o6g3nyIXBcFe_g
type=text/javascript/script
script type=text/javascript
//![CDATA[
google.load(maps, 2.x);
function initialize() {
var map = new GMap2(document.getElementById(map- + ranNum),
{ size: new GSize(400,300) } );
var address = '{SIMPLETEXT1}';
map.addControl(new GSmallMapControl());
map.addControl(new GMapTypeControl());
geocoder = new GClientGeocoder();
geocoder.getLatLng(
address,
function(point) {
if (!point) {
alert(address + not found);
} else {
map.setCenter(point, {NUMBER});
var marker = new GMarker(point);
map.addOverlay(marker);
marker.openInfoWindowHtml('{SIMPLETEXT2}');
}
}
);
}
var ranNum= Math.round(Math.random()*999);
document.write('div id=map-' + ranNum + ' style=width:
650px; height: 550px/div');
google.setOnLoadCallback(initialize);
window.onunload = function() {
if (map) {GUnload();}
}
//]]
/script
[jQuery] using jquery to implement google maps on phpbb3
I have a small phpbb3 bulletin board and I'm trying to implement
google maps via a mod/bb code solution.
I have got it working where I can embed a single map. But
unfortunately, when a 2nd map is added to a thread, the first one
disappears. I've isolated this as having to do with the div tag id
used by the javascript. I've tried creating a random number for the id
code in js. But that doesn't work either, as the variable name is the
same for both instances of the map.
sigh...
I just today stumbled on jquery and was told there was a way to keep
each div id unique when multiple instances of the script are on the
page.
The javascript (along with the google maps api for my site) is below:
There are three phpbb bbcode variables in this code. SIMPLETEXT1,
SIMPLETEXT2 AND NUMBER They correspond to location, description and
the zoom for the map.
As noted, the map works in a single instance. But the next time
someone posts a map, the first one doesn't display. Does anyone know
how to use jquery to write the div id so that this actually works?
I will be forever in your debt for any help with this.
-bob
script src=http://www.google.com/jsapi?
key=ABQIM79iA8VQkkozpKHIqSxUhRSXnAaMq2fjh449SYdBhdqqjpIXQBQfhT6m4WhePFr1o6g3nyIXBcFe_g
type=text/javascript/script
script type=text/javascript
//![CDATA[
google.load(maps, 2.x);
function initialize() {
var map = new GMap2(document.getElementById(map- + ranNum),
{ size: new GSize(400,300) } );
var address = '{SIMPLETEXT1}';
map.addControl(new GSmallMapControl());
map.addControl(new GMapTypeControl());
geocoder = new GClientGeocoder();
geocoder.getLatLng(
address,
function(point) {
if (!point) {
alert(address + not found);
} else {
map.setCenter(point, {NUMBER});
var marker = new GMarker(point);
map.addOverlay(marker);
marker.openInfoWindowHtml('{SIMPLETEXT2}');
}
}
);
}
var ranNum= Math.round(Math.random()*999);
document.write('div id=map-' + ranNum + ' style=width:
650px; height: 550px/div');
google.setOnLoadCallback(initialize);
window.onunload = function() {
if (map) {GUnload();}
}
//]]
/script
[jQuery] Re: Has jQuery development halted?
Hi Rey, Thanks for the reply.. I eagerly await any and all new releases. ;-) Cheers, Bob. I think one of the things that we've done is spoiled jQuery developers by releasing often. Obviously, we try hard to do that (spoil jQuery developers) because we want you guys to have the very best features and be able to build kick-ass apps. Every so often though, we do need to slow down to: 1) make sure we're addressing the needs of the community in the right way 2) build solid features that won't adversely affect the API 3) have ample time to do proper testing 4) take a well-deserved break from pushing out code :) We definitely haven't halted development and we're trying to nail down our next release. So just be patient a little longer and we should get a release out in the near future. Rey jQuery Team Bob den Otter wrote: Hi all, There hasn't been a jQuery update in what seems like ages, and jQuery UI 1.6 will be released 'in the next few days' since somewhere in september. I know John has been really busy with a lot of great things, but it seems to me like the development of jquery has seriously lagged the last few months. As a small example: there isn't even a way to detect chrome in the official jquery builds yet, and chrome has been out for several months now. I'm afraid that the lack of updates will eventually have a negative impact on the great Query community, causing people to leave for other js frameworks. I sincerely hope not, but i _am_ worried about it. Best, Bob.
[jQuery] Has jQuery development halted?
Hi all, There hasn't been a jQuery update in what seems like ages, and jQuery UI 1.6 will be released 'in the next few days' since somewhere in september. I know John has been really busy with a lot of great things, but it seems to me like the development of jquery has seriously lagged the last few months. As a small example: there isn't even a way to detect chrome in the official jquery builds yet, and chrome has been out for several months now. I'm afraid that the lack of updates will eventually have a negative impact on the great Query community, causing people to leave for other js frameworks. I sincerely hope not, but i _am_ worried about it. Best, Bob.
[jQuery] Re: Has jQuery development halted?
Hi Andy, I found that 1.3 roadmap earlier today, when i was googling for news on jQuery 1.3.. Those pages list no dates, so I have no idea if they're current or not. Best, Bob. Have you reviewed the roadmaps for 1.2 and 1.3? http://docs.jquery.com/JQuery_1.2_Roadmap http://docs.jquery.com/JQuery_1.3_Roadmap andy -Original Message- From: jquery-en@googlegroups.com [mailto:[EMAIL PROTECTED] On Behalf Of Bob den Otter Sent: Wednesday, November 26, 2008 8:54 AM To: jquery-en@googlegroups.com Subject: [jQuery] Has jQuery development halted? Hi all, There hasn't been a jQuery update in what seems like ages, and jQuery UI 1.6 will be released 'in the next few days' since somewhere in september. I know John has been really busy with a lot of great things, but it seems to me like the development of jquery has seriously lagged the last few months. As a small example: there isn't even a way to detect chrome in the official jquery builds yet, and chrome has been out for several months now. I'm afraid that the lack of updates will eventually have a negative impact on the great Query community, causing people to leave for other js frameworks. I sincerely hope not, but i _am_ worried about it. Best, Bob.
[jQuery] Re: exclude children from selected elements
Why dont you fire an event after the children have been loaded that
removes them?
On Nov 21, 3:07 am, [EMAIL PROTECTED]
[EMAIL PROTECTED] wrote:
My mistake, it is working. The problem was my lack of understanding
about how Dialog works. main is the div from which I create a Dialog
and I didn't want the event listener to be added to the elements of
main. However main is NOT the first element of the Dialog. I the
background it is wrapped around other elements and the top one has
class .ui-dialog . All sorted. Thanks .
On 21 nov, 09:32, [EMAIL PROTECTED]
[EMAIL PROTECTED] wrote:
It still doesn't work. I think part of the problem is because the
children of main are added after I create the event listener.
Second solution is to check in the event listener if the target is a
child of main and if so, return. I know how to get the children of
main , but how to I check the current tartget is one of them ?
ricardobeat I need to select all objects of the page because I want
to do a DOM inspector. But yes you are right, maybe I should only
start from body !
Thanks
On 20 nov, 18:25, ricardobeat [EMAIL PROTECTED] wrote:
Are you sure you want to apply it to *all* elements on the page? That
sounds a bit awkward.
var main = $('#main, #main *');
$('body *').not(main).mouseover(function(){...});
On Nov 20, 2:07 pm, [EMAIL PROTECTED]
[EMAIL PROTECTED] wrote:
Hi,
I want to apply a mouseover event on all elements but one and its
children. I can't use class name to filter. How can I do it ? I've
tried unsuccessfully :
$(*:not(#main)).not($(#main).children()).mouseover(function() {
});
thanks
[jQuery] Re: image toggle
Nobody knows? Is it not possible? Thanks ricardo, It's easier to just add a class to all the headers, then use $ Thats how I do it now I was just wandering if the solution using each would be possible.
[jQuery] iterate array and create callback
Is it possible to iterate over the array and create functions as
follows?
It did not seem to work for me.
var menu = ['home','news','sport','music'];
for(var i=0; imenu.length;i++) {
$('#'+menu[i]+'_header').click(function(){ alert(i);
alert(menu[i]+'_header clicked');
var $img = $(this).find('img');
var src = $img.attr('src');
var newsrc = /up\.gif$/.test(src) ? src.replace
('up','down') :
src.replace('down','up');
$img.attr('src',newsrc);
});
}
[jQuery] Re: image toggle
Cannot be done something with each?
Again, it does not work for me.
var menu = ['home','news','sport','music'];
$.each(menu, function(index) {
$('#'+this+'_header').click(function(){
alert(this+'_header clicked');
});
});
[jQuery] image toggle
Hi,
I am trying to create a toggler that I would like to work
as follows:
User clicks on #my_header and source of the image gets replaced.
I tried the following but it did not work.
div title=show/hide id=my_header
img src=images/arrow_down.gif/
spanSome title here/span
/div
$(function() {
$('#my_header').click(
function() {
$('#my_header img').src = $('#my_header
img').src.replace( /_down
\.gif$/, '_up.gif' );
},
function() {
$('#my_header img').src = $('#my_header
img').src.replace( /_up
\.gif$/, '_down.gif' );
}
);
});
[jQuery] Re: image toggle
Thanks ricardo,
Is it possible to do something like this?
It did not seem to work for me.
var menu = ['home','news','sport','music'];
for(var i=0; imenu.length;i++) {
$('#'+menu[i]+'_header').click(function(){
alert(menu[i]+'_header clicked');
var $img = $(this).find('img');
var src = $img.attr('src');
var newsrc = /up\.gif$/.test(src) ? src.replace('up','down') :
src.replace('down','up');
$img.attr('src',newsrc);
});
}
[jQuery] Re: Taconite - remove surrogate div
In case someone runs into the same issue, I've attached a patch to
remove the temporary div.
In short this snippet moves the content after the div and then removes
the div. Not sure if this will have nasty side effects though.
regards
bob
Index: jquery.taconite.js
--- jquery.taconite.js Base (BASE)
+++ jquery.taconite.js Locally Modified (Based On LOCAL)
@@ -150,6 +150,7 @@
continue;
}
var cdataWrap = cmdNode.getAttribute('cdataWrap') ||
$.taconite.defaults.cdataWrap;
+var unwrap = [];
var a = [];
if (cmdNode.childNodes.length 0) {
@@ -178,7 +179,13 @@
log(invoking command: $(', q, ')., cmd, '('+ arg
+')');
}
jq[cmd].apply(jq,a);
+
+// Unwrap cdataWrap element contents
+while (el = unwrap.shift()) {
+var jel = $(el);
+jel.after(jel.html()).remove();
}
+}
// apply dynamic fixes
if (doPostProcess)
postProcess();
@@ -217,6 +224,8 @@
function handleCDATA(s) {
var el = document.createElement(cdataWrap);
+// Add cdataWrap element, to be unwrapped later
+unwrap.push(el);
el.innerHTML = s;
return el;
};
Bob Schellink wrote:
Hi Mike,
Thanks for your feedback. Your solution does work in the scenario I
described where only one link is used. However it is possible to return
multiple elements for example:
taconite
append
a href=...hello/a
a href=...hi/a
/append
/taconite
To provide some context, I am integrating taconite into a component
framework and do not have much control over the commands and their content.
Hmm would it work to unwrap (does that even make sense) the div contents?
kind regards
bob
Mike Alsup wrote:
In order to do this taconite places the CDATA content inside a div
element. However after the command is executed the div is left in the
DOM.
So after a bit of back and forth between browser and server we end up
with a large hierarchy of divs.
Hi Bob,
Could you test this function to see if it fixes the issue for you?
(just replace the current one in Taconite)
function handleCDATA(s) {
var el = document.createElement(cdataWrap);
el.innerHTML = s;
// remove wrapper node if possible
var $el = $(el), $ch = $el.children();
if ($ch.size() == 1)
return $ch[0];
return el;
};
Thanks.
Mike
[jQuery] Taconite - remove surrogate div
Hi all, The taconite plugin provides the ability to wrap results in CDATA tags which allows one to return special characters such as '' and ''. Example command: taconite replace select=#link![CDATA[ a href=/counter.htm?link=myidcount=1 id=linkHi/a ]]/replace /taconite In order to do this taconite places the CDATA content inside a div element. However after the command is executed the div is left in the DOM. So after a bit of back and forth between browser and server we end up with a large hierarchy of divs. Would it be possible to enhance Taconite to remove this div after the command is executed? Or any other suggestion on how to remove the div? kind regards bob
[jQuery] Re: Taconite - remove surrogate div
Hi Mike,
Thanks for your feedback. Your solution does work in the scenario I
described where only one link is used. However it is possible to
return multiple elements for example:
taconite
append
a href=...hello/a
a href=...hi/a
/append
/taconite
To provide some context, I am integrating taconite into a component
framework and do not have much control over the commands and their
content.
Hmm would it work to unwrap (does that even make sense) the div
contents?
kind regards
bob
Mike Alsup wrote:
In order to do this taconite places the CDATA content inside a div
element. However after the command is executed the div is left in the DOM.
So after a bit of back and forth between browser and server we end up
with a large hierarchy of divs.
Hi Bob,
Could you test this function to see if it fixes the issue for you?
(just replace the current one in Taconite)
function handleCDATA(s) {
var el = document.createElement(cdataWrap);
el.innerHTML = s;
// remove wrapper node if possible
var $el = $(el), $ch = $el.children();
if ($ch.size() == 1)
return $ch[0];
return el;
};
Thanks.
Mike
[jQuery] Callback after ALL elements in set animated?
Hey guys... Don't seem to be able to find an answer to this. Is there a way to fire a callback after ALL elements in a wrapped set have been animated? Instead of after each one is animated? It kind of looked like queue would do something similar to this... but since animate or show... or whatever effect is passing back EACH item into the chain, the queue is applied to each individually with the same effect. Best, Bob
[jQuery] Re: Using taconite to append javascript and stylesheets
Hi Ricardo,
ricardobeat wrote:
This works though: $('head')[0].appendChild($('script type=text/
javascript src=what.js')[0])
Thanks, that is pretty slick. Much better than the approach I took of
tracking scripts by appending place holder tags in head.
Just to summarize, my approach to ensure javascript and stylesheet
resources are only loaded once, is to validate against guard functions
before appending the resource.
An example guard function:
/*
* This function checks if the given script already exists in the
* document head section. It uses the following two rules:
*
* External scripts are checked against their 'src' attribute.
* Inline scripts are checked against their 'id' attribute.
*
* @param script is a script DOM element.
*/
function canAddScript(script) {
var id = script.getAttribute(id);
if(id) {
// Check if another script exists with the same id attribute
if($('#'+id).length) {
log('script with id: ' + id + ' already exists');
return false;
}
}
var src = script.getAttribute(src);
if (src) {
// Check if another script exists with the same src attribute
if($('script[src='+src+']').length) {
log('script with src: ' + src + ' already exists');
return false;
}
}
return true;
}
kind regards
bob
On Oct 29, 9:11 pm, Bob Schellink [EMAIL PROTECTED] wrote:
Hi Ricardo,
ricardobeat wrote:
You don't need a plug-in to do that:
$('head')
.append('link href=css/geral.css rel=stylesheet /')
.append('script type=text/javascript src=calendar.js/
script')
Using the above method (or taconite) I've noticed that JQuery does not
actually append the script element to head. At least according to
Firebug. Is this the expected behavior?
One of the things I want to achieve is that scripts should only be
appended once for a page. However if JQuery does not add the script to
head there is nothing to check against in a future call which might
add the same script again.
Should I bypass JQuery and manually add the script tags to head?
kind regards
bob
[jQuery] Re: Using taconite to append javascript and stylesheets
Hi Ricardo,
ricardobeat wrote:
You don't need a plug-in to do that:
$('head')
.append('link href=css/geral.css rel=stylesheet /')
.append('script type=text/javascript src=calendar.js/
script')
Using the above method (or taconite) I've noticed that JQuery does not
actually append the script element to head. At least according to
Firebug. Is this the expected behavior?
One of the things I want to achieve is that scripts should only be
appended once for a page. However if JQuery does not add the script to
head there is nothing to check against in a future call which might
add the same script again.
Should I bypass JQuery and manually add the script tags to head?
kind regards
bob
[jQuery] [Taconite] Using taconite to append javascript and stylesheets
Hi all, I am using the Taconite (http://malsup.com/jquery/taconite/) plugin to dynamically append external scripts (script) and stylesheets (link) to the page head section. Inspired by the Taconite example Demo1, I manage to get external scripts working, however stylesheets only seems to work in Firefox, not IE. Here is the Taconite markup I'm using: taconite !-- Works in FF and IE -- append select=head script type=text/javascript src=calendar.js/ /append !-- Works in FF but not IE -- append select=head link rel=stylesheet type=text/javascript href=calendar.css/ /append /taconite Is this scenario supported by Taconite or should I rather the eval tag for appending stylesheets? kind regards bob
[jQuery] Re: superfish + bgiframe problem on IE6
So, the problem I'm having with IE6/Superfish is that the dropdown
menus push all other content down, rather than displaying on top of
the other content.
My superFish code is fairly straightforward:
$(document).ready(function() {
//superFish
$('ul#menu').superfish({
animation : { opacity:show,height:show},
pathClass: current,
speed: fast
});
$('ul#menu').superfish().find('ul').bgIframe({opacity:false});
});
Removing either line makes no difference -- the result is the same,
and obviously having both in there is probably overkill.
My menu is pretty lightweight:
div id=nav class=grid_12
ul id=menu
li class=currenta href=/home title=HomeHome/a/li
lia href=/collections title=CollectionsCollections/a
ul
lia href=/collections/collection/fall2008
title=Fall
2008Fall 2008/a/li
lia
href=/collections/collection/spring2009 title=Spring
2009Spring 2009/a/li
/ul
/li
lia href=/about title=About UsAbout Us/a
ul
lia href=/news title=NewsNews/a/li
lia href=/press
title=PressPress/a/li
/ul
/li
lia href=/contact title=Contact UsContact Us/a/li
/ul
/div
I stripped the existing superfish.css down to only the Essential
Styles and apply hovers to modern browsers sections; otherwise the
CSS is pretty straightforward as well:
#nav {
width: 960px;
height: 40px;
background: transparent url(/images/nav_bg.gif) 0px 0px no-repeat;
display: block;
position: relative;
margin: 15px 0 0 0;
z-index: 100;
}
#menu li {position: relative; display:block; float: left; height:
40px; margin: 0; padding: 0; font-size: 16px; line-height: 40px; }
#menu li a {position: relative; display: block; float: left; color:
#64a3b5;text-decoration: none; height: 40px; padding: 0 20px; }
#menu li a:link { color: #64a3b5; }
#menu li a:hover { color: #000; background: #dfdfdf; }
#menu li.current a { color: #333; }
#menu ul {display: block; background-color: #f0e9f1; border-bottom:
1px solid #ccc; margin: 0; padding: 0; clear: both; width: 130px;}
#menu ul li {position: relative; display: block; float: none; height:
30px; margin: 0; padding: 0; line-height: 30px; font-size: 90%;}
#menu ul li a {position: relative; display: block; float: none; color:
#64a3b5; text-decoration: none; height: 30px; margin: 0; padding: 0 0
0 15px; z-index: 120;}
#menu ul li a:hover { color: #000; background: #dfdfdf; }
#menu ul li.current a { color: #333; }
Any ideas?
Thanks,
Bob
[jQuery] Re: jcarousel reset
Damien -
I just got this working myself in a dynamically loaded carousel:
First, add an initCallback to get a handle on the jcarousel object and
save it in a global:
myCarousel = null; // This will be the carousel object
myData = [...]; // This is the data for the carousel
function onInitCarousel(carousel, state) {
if (state == 'init') {
myCarousel = carousel;
}
}
function myItemLoadCallback(carousel, state) {
// build your items from myData[...] here
}
$('#mycarouseldev').jcarousel({
size: myData.length,
initCallback: onInitCarousel,
itemLoadCallback: {onBeforeAnimation:
myItemLoadCallback},
wrap: 'last',
scroll: 3
});
Then, when it is time to reset the carousel:
function resetData() {
myData = [...] // set the new data
myCarousel.reset();
}
Hope this helps,
Bob
On Oct 1, 4:20 am, Anatalsceo [EMAIL PROTECTED] wrote:
Thejcarouselplug works really great. I only have a problem with
theresetfunction.
I try on a page to change the content of the carousel without
reloading the page.
I'm using for this the $(document).ready(function() {} in order to
change the carousel on a click.
It doesn't quite work and I was wondering how could I get thereset
function to work. It always freezes firefox when using it.
regards,
Damien
[jQuery] Re: jQuery and Rails Block
I ended up doing something very similar to this, and was able toget it
working..
Thank you kindly for your comments they are much appreciated. Its nice
to know there are a lot of resources in the community..
On Sep 22, 2:35 pm, Eric [EMAIL PROTECTED] wrote:
If I understand your question correctly, you should be able to do it
by Traversing the DOM.
So, let's say that the HTML is like this:
div class='one_record'
pLorem ipsum.../p
a class='hide_show_link' href='#'Hide/Show extra info/a
div class='starts_hidden'
Show this when the link is clicked.
/div
/div
So your CSS would probably have something like:
.starts_hidden { display: none; }
Now, this *wouldn't* work:
$( function () {
$('.hide_show_link').click( function () {
$('.starts_hidden').toggle();
});
});
Because clicking on a hide_show_link will toggle ALL of the things of
class 'starts_hidden'.
You probably want to do something like this:
$( function () {
// DOM is ready:
$('.hide_show_link').click( function () {
// in here, 'this' refers to the particular link we're
inspecting.
$(this).next().toggle(); // start at the current link, find the
next element in the DOM, and toggle it.
});
});
The reason this works is because each link hide shows the Next div in
the DOM. If your HTML is different, then the code between $(this)
and .toggle() will be different. See:http://docs.jquery.com/Traversing
for the functions that will help you here.
Cheers,
-Eric
On Sep 20, 10:40 am, Bob O [EMAIL PROTECTED] wrote:
Hello,
Im am a CSS guy moving into the world of js and RoR, so its nice to
find things like jQuery and supporting groups. I am a n00b, so the
more english the response the better
Question:
I have a rails partial that cycles a :collection. So every record in
the db table receives the same HTML/CSS structure. There is a hidden
div with extra info, that expands when the exposed div is clicked. the
problem is ALL of the displayed :collections reveal/hide the extra
content at the same time. where the HTML/CSS is dynamically generated,
im not sure how to have it differentiate between each item.
I have seen in the Learning jQuery book that there is a way to loop
and add an index, and also some kind of append feature, but Im not
quite versed enough to understand if this is what i need.
any help would be great..
Thank you
[jQuery] jQuery and Rails Block
Hello, Im am a CSS guy moving into the world of js and RoR, so its nice to find things like jQuery and supporting groups. I am a n00b, so the more english the response the better Question: I have a rails partial that cycles a :collection. So every record in the db table receives the same HTML/CSS structure. There is a hidden div with extra info, that expands when the exposed div is clicked. the problem is ALL of the displayed :collections reveal/hide the extra content at the same time. where the HTML/CSS is dynamically generated, im not sure how to have it differentiate between each item. I have seen in the Learning jQuery book that there is a way to loop and add an index, and also some kind of append feature, but Im not quite versed enough to understand if this is what i need. any help would be great.. Thank you
[jQuery] Re: Accessing JQuery from frames
Wow... nothing... Is anyone using JQuery with a regular old-fashioned
frameset and frames?
On Aug 25, 2:56 pm, Bob Gregg [EMAIL PROTECTED] wrote:
My apologies if this has been asked before; but in searching I can't
see that anyone asked quite the same thing in the past. I have a frame-based
website with two frames: UPPER and LOWER. The UPPER frame
contains a static navigation bar that rarely changes during a user's
session; the LOWER frame constantly changes to the current page. What
I would like to do is to load JQuery during the *frameset* load, and
have the functions available to all applications that might appear in
the lowerframe. That gives me the benefits of JQuery in all pages of
our site, without having to pay the performance penalty of loading it
over and over.
Ignoring any possible cross-domain/document.domain issues, JQuery
seems to have an issue in at least IE due to the context of the calls.
Example 1:
* frameset.html loads JQuery normally.
* topframe.html does... well, nothing.
* bottomframe.html contains the following:
...
script
$=top.jQuery;
$(document).ready(function(){$(p).fadeIn(slow);});
/script
...
p style=display: none;Here's the text!/p
Needless to say, this doesn't work - when calling $, the context is
the *frameset* document, not the bottomframe. So, for attempt number
2, I replaced the local $ definition with a wrapper to always pass the
correct context to JQuery:
$=function jQuery(o,c){return top.jQuery(o,(c)?c:document);}
That is, by default, pass the current page's document object as the
context; but if I explicitly pass another local context, use that
instead. Now, this works like a champ in Firefox - I can use JQuery
exactly as though it were loaded right into the bottomframe, same
syntax and all. But in IE (either 6 or 7), it treats the frameset
page as the context, regardless of what I pass in for the context
parm. In fact, even when I do this explicitly in the bottomframe, it
still fails in IE:
$(*,document).each(function(i){alert(i+: +this);});
This code should list all the DOM nodes in the current document. Run
just this code in Firefox, and it iterates over the elements of the
bottom page. Run it in IE, though, and it iterates over the elements
of the *frameset* page, even though I've explicitly passed the
bottomframe'sdocument object as context. I've tried several variations of
this (like explicitly passing top.frames['LOWER'] (which should wind
up identical), but it makes no difference.
Is there something I'm missing, or is there something inherent in IE's
treatment of frames that will always prevent this from working?
[jQuery] Re: slide()/show()/hide() does not expand across columns
I've implemented show/hide of table rows in a production app, so I
checked my own code; the primary difference is that you're using
'slow', and I wasn't. When I copied your code and removed the 'slow'
parameter, it worked just fine. Maybe this is a bug in the
implementation of fade effects specifically on table rows? I noticed
that it actually seems to move the DOM elements into a single table
cell width prior to the initial fade out; no idea why, though.
Bob
On Aug 26, 1:04 pm, J Junos [EMAIL PROTECTED] wrote:
My issue is that I want to allow users to hide and show expanded data.
Yet for some reason, when I implement this in jQuery, the expanded
rows always seem to stay in a single column, instead of returning back
to the full table width. I can get it to work in prototype, but jquery
won't.
Anyone else have problems with show()?
This is my example:
[code]
script type=text/javascript
jQuery.noConflict();
function jqueryclick( node ) {
var sibling = jQuery( node ).next('tr');
sibling.toggle('slow');
// $( node ).next('.expanded').toggle();
}
function prototypeclick( node ) {
$( node ).next('.expanded').toggle();
}
/script
/head
body
table border=1
thead
tr
thTEST1/th
thTest 2/th
thTest 3 3/th
/tr
/thead
tbody id=tablebody
tr onclick=jqueryclick(this)
tdhey jude!/td
tdI want/td
tdsome/td
/tr
tr class=expanded
tdbig/td
tdtop/td
tdice cream/td
/tr
tr onclick=prototypeclick(this)
td1+1=/td
td2+2=/td
td3+3=/td
/tr
tr class=expanded
td2/td
td4/td
td6/td
/tr
/tbody
/table
/body
/html
[/code]
[jQuery] Re: slide()/show()/hide() does not expand across columns
I've previously implemented table row show/hide in a production app, so I went back to check - the main difference between your code and mine was that you're using 'slow' in your toggle() statement. When I eliminated that and just used toggle() (or show() / hide() ), your jQuery code seems to work fine. Maybe this is a bug in the implementation of display effects for table rows? On Aug 26, 1:04 pm, J Junos [EMAIL PROTECTED] wrote: My issue is that I want to allow users to hide and show expanded data. Yet for some reason, when I implement this in jQuery, the expanded rows always seem to stay in a single column, instead of returning back to the full table width. I can get it to work in prototype, but jquery won't. Anyone else have problems with show()? This is my example:
