[jQuery] Re: IE 7 error with $.getJSON data elements
I am using v1.3.2
I replaced var aIndex = $(this).attr('href'); with var aIndex =
+this.href.match( /\d+$/ )[0]; and it works now. Thanks for the help!
[jQuery] Re: IE 7 error with $.getJSON data elements
Clicking on the first link (i.e. ):
http://pomona.edu/dev/home/0
string
[object Object]
[object Object], [object Object], [object Object], [object Object],
[object Object]
5
I think the problem is in my var aIndex = $(this).attr('href');
In IE 7 it is appending the full URL...any ideas how to get around
this? Thanks,
On Nov 17, 10:37 am, Michael Geary wrote:
> No, the scope of the data parameter is not the problem. The data parameter
> is already in scope inside your click handler. (Michel, check the code
> carefully - don't you agree? The click handler is nested inside the getJSON
> callback.)
>
> If it were broken in IE8 as well as IE7, then I would guess that you
> probably have a trailing comma at the end of your data.items array. If you
> have an array like [ 'a', 'b', ] then IE gives it a length of 3 with an
> undefined element at the end. But that should affect IE8 the same as IE7.
>
> But let's stop guessing. Get in there and have a look at the actual data.
>
> The error is occuring on this line in your click handler:
>
> var aIndexBG = data.items[aIndex].background;
>
> So add this code right before that line:
>
> alert( aIndex );
> alert( typeof aIndex );
> alert( data );
> alert( data.items );
> alert( data.items.length );
> alert( data.items[aIndex] );
> alert( data.items[aIndex].background );
>
> What do the alerts say?
>
> -Mike
>
> On Tue, Nov 17, 2009 at 10:26 AM, roryreiff wrote:
> > So I guess that is the problem then? How would I work towards a
> > solution in making 'data' available to that .click() function?
>
> > On Nov 17, 10:02 am, Michel Belleville
> > wrote:
> > > Oh, yeah, now I see.
>
> > > Of course data is probably not what you expect where you're reading it.
> > Why
> > > would it ? It's set in a callback as a function's parameter, it's not
> > meant
> > > to get out of the callback's scope, and even when it would, you don't
> > know
> > > when the callback is triggered, that can be right before, right after, a
> > > month after, never, depending on how the AJAX call ends.
>
> > > Michel Belleville
>
> > > 2009/11/17 roryreiff
>
> > > > Could it have something to do with the 'data' variable not being
> > > > available to the function that I have placed inside the $.getJSON
> > > > call? Is there a way to force it to pass on/be available to my
> > > > ppButton.click(...) function? This is all I can think of for now.
[jQuery] Re: IE 7 error with $.getJSON data elements
So I guess that is the problem then? How would I work towards a solution in making 'data' available to that .click() function? On Nov 17, 10:02 am, Michel Belleville wrote: > Oh, yeah, now I see. > > Of course data is probably not what you expect where you're reading it. Why > would it ? It's set in a callback as a function's parameter, it's not meant > to get out of the callback's scope, and even when it would, you don't know > when the callback is triggered, that can be right before, right after, a > month after, never, depending on how the AJAX call ends. > > Michel Belleville > > 2009/11/17 roryreiff > > > Could it have something to do with the 'data' variable not being > > available to the function that I have placed inside the $.getJSON > > call? Is there a way to force it to pass on/be available to my > > ppButton.click(...) function? This is all I can think of for now.
[jQuery] Re: IE 7 error with $.getJSON data elements
Could it have something to do with the 'data' variable not being available to the function that I have placed inside the $.getJSON call? Is there a way to force it to pass on/be available to my ppButton.click(...) function? This is all I can think of for now.
[jQuery] Re: IE 7 error with $.getJSON data elements
I am using Firebug, and everything works fine in FF, Safari, Opera,
and even IE 8. Something about IE 7 though is throwing that error and
I can't for the life of me track what it is. :(
On Nov 17, 9:19 am, Michel Belleville
wrote:
> Well, when I've got an error saying something is null or not an object, and
> that very something is obtained from a query response, first thing I do is
> checking what was the response. Firebug may help if you're not using it
> already, and my shot in the dark here would be to think you've either
> received something you didn't expect, or in a format you didn't exepct, or
> that the data.items[0].background didn't fit the provided format.
>
> Michel Belleville
>
> 2009/11/17 roryreiff
>
> > //This code is withing a larger function, but the error is coming into
> > play when the 'ppButton' is clicked
> > // It throws the following error in IE 7 (6 not yet tested):
> > //
> > // Error: 'data.items[...].background' is null or not an object
> > // Code: 0
> > //
>
> > var PP = $('.pomonaPeople');
>
> > $.getJSON("/dev/home/pp.json",
> > function(data){
> > PP.css('background', 'url(' + data.items[0].background +
> > ' )' );
>
> > // create navigation
> > var ppButton = $('#pp-nav ul li a');
> > ppButton.qtip({ style: { name: 'pomonastandard', 'font-
> > size': '70%', tip: true }, position: { adjust: { mouse: true, x:0, y:
> > 0, screen: true }, corner: { target: 'topRight', tooltip:
> > 'bottomLeft'}} });
> > var currentPP = PP.find('#pp-0');
>
> > ppButton.click( function(event) {
> > event.preventDefault();
> > var ppDivs = PP.children('div');
> > var aIndex = $(this).attr('href');
> > var destination = PP;
> > destination.append('');
> > var aIndexBG = data.items[aIndex].background;
> > destination.css('background', 'url(' + aIndexBG +
> > ' )' );
> > // set z-index of current div to be above others, and
> > reset rest
> > currentPP.css('z-index', '100');
> > currentPP = $('#pp-' + aIndex);
> > //console.log(currentPP);
> > currentPP.css('z-index', '125');
> > destination.find('.loading').fadeOut(FADE);
> > });
>
> > PP.find('.loading').fadeOut(FADE);
>
> > });
[jQuery] Re: IE 7 error with $.getJSON data elements
I am using Firebug, and everything works fine in FF, Safari, Opera,
and even IE 8. Something about IE 7 though is throwing that error and
I can't for the life of me track what it is. :(
On Nov 17, 9:19 am, Michel Belleville
wrote:
> Well, when I've got an error saying something is null or not an object, and
> that very something is obtained from a query response, first thing I do is
> checking what was the response. Firebug may help if you're not using it
> already, and my shot in the dark here would be to think you've either
> received something you didn't expect, or in a format you didn't exepct, or
> that the data.items[0].background didn't fit the provided format.
>
> Michel Belleville
>
> 2009/11/17 roryreiff
>
> > //This code is withing a larger function, but the error is coming into
> > play when the 'ppButton' is clicked
> > // It throws the following error in IE 7 (6 not yet tested):
> > //
> > // Error: 'data.items[...].background' is null or not an object
> > // Code: 0
> > //
>
> > var PP = $('.pomonaPeople');
>
> > $.getJSON("/dev/home/pp.json",
> > function(data){
> > PP.css('background', 'url(' + data.items[0].background +
> > ' )' );
>
> > // create navigation
> > var ppButton = $('#pp-nav ul li a');
> > ppButton.qtip({ style: { name: 'pomonastandard', 'font-
> > size': '70%', tip: true }, position: { adjust: { mouse: true, x:0, y:
> > 0, screen: true }, corner: { target: 'topRight', tooltip:
> > 'bottomLeft'}} });
> > var currentPP = PP.find('#pp-0');
>
> > ppButton.click( function(event) {
> > event.preventDefault();
> > var ppDivs = PP.children('div');
> > var aIndex = $(this).attr('href');
> > var destination = PP;
> > destination.append('');
> > var aIndexBG = data.items[aIndex].background;
> > destination.css('background', 'url(' + aIndexBG +
> > ' )' );
> > // set z-index of current div to be above others, and
> > reset rest
> > currentPP.css('z-index', '100');
> > currentPP = $('#pp-' + aIndex);
> > //console.log(currentPP);
> > currentPP.css('z-index', '125');
> > destination.find('.loading').fadeOut(FADE);
> > });
>
> > PP.find('.loading').fadeOut(FADE);
>
> > });
[jQuery] IE 7 error with $.getJSON data elements
//This code is withing a larger function, but the error is coming into
play when the 'ppButton' is clicked
// It throws the following error in IE 7 (6 not yet tested):
//
// Error: 'data.items[...].background' is null or not an object
// Code: 0
//
var PP = $('.pomonaPeople');
$.getJSON("/dev/home/pp.json",
function(data){
PP.css('background', 'url(' + data.items[0].background +
' )' );
// create navigation
var ppButton = $('#pp-nav ul li a');
ppButton.qtip({ style: { name: 'pomonastandard', 'font-
size': '70%', tip: true }, position: { adjust: { mouse: true, x:0, y:
0, screen: true }, corner: { target: 'topRight', tooltip:
'bottomLeft'}} });
var currentPP = PP.find('#pp-0');
ppButton.click( function(event) {
event.preventDefault();
var ppDivs = PP.children('div');
var aIndex = $(this).attr('href');
var destination = PP;
destination.append('');
var aIndexBG = data.items[aIndex].background;
destination.css('background', 'url(' + aIndexBG +
' )' );
// set z-index of current div to be above others, and
reset rest
currentPP.css('z-index', '100');
currentPP = $('#pp-' + aIndex);
//console.log(currentPP);
currentPP.css('z-index', '125');
destination.find('.loading').fadeOut(FADE);
});
PP.find('.loading').fadeOut(FADE);
});
[jQuery] Re: better way to access JSON than with $.getJSON on each button press
Thanks Scott...you have given me some food for thought.
On Nov 12, 9:18 am, Scott Sauyet wrote:
> > function getData(url) {
> > var storedData;
> > return function(callback) {
> > if (storedData) callback(storedData)
> > else $.getJSON(url, function(data) {
> > storedData = data;
> > callback(storedData);
> > });
> > };
> > };
>
> That has the disadvantage that is will make the AJAX call multiple
> times if multiple calls come in to the generated function before the
> first one completes. This has the same API, but is cleaner:
>
> function getData(url) {
> var storedData, callbacks = [];
> $.getJSON(url, function(data) {
> storedData = data;
> for (var i = 0; i < callbacks.length; i++) {
> callbacks[i](data);
> }
> });
> return function(callback) {
> if (storedData) callback(storedData)
> else callbacks.push(callback);
> };
> };
>
> This could easily be extended for multiple re-tries on ajax failure.
>
> But any of these techniques turn what you would like to think of as
> synchronous calls into asynchronous ones. A different technique
> avoids making you think about this, although it is equally
> asynchronous: Simply move your click binding inside the
> initial .getJSON callback. "data" will be available, and you won't
> have to make additional calls. The biggest disadvantage of this is
> that the default action will happen on your links if they're clicked
> before the ajax call returns.
>
> Anyway, here's a few ideas.
>
> -- Scott
[jQuery] Re: better way to access JSON than with $.getJSON on each button press
Thanks Scott...you have given me some food for thought.
On Nov 12, 9:18 am, Scott Sauyet wrote:
> > function getData(url) {
> > var storedData;
> > return function(callback) {
> > if (storedData) callback(storedData)
> > else $.getJSON(url, function(data) {
> > storedData = data;
> > callback(storedData);
> > });
> > };
> > };
>
> That has the disadvantage that is will make the AJAX call multiple
> times if multiple calls come in to the generated function before the
> first one completes. This has the same API, but is cleaner:
>
> function getData(url) {
> var storedData, callbacks = [];
> $.getJSON(url, function(data) {
> storedData = data;
> for (var i = 0; i < callbacks.length; i++) {
> callbacks[i](data);
> }
> });
> return function(callback) {
> if (storedData) callback(storedData)
> else callbacks.push(callback);
> };
> };
>
> This could easily be extended for multiple re-tries on ajax failure.
>
> But any of these techniques turn what you would like to think of as
> synchronous calls into asynchronous ones. A different technique
> avoids making you think about this, although it is equally
> asynchronous: Simply move your click binding inside the
> initial .getJSON callback. "data" will be available, and you won't
> have to make additional calls. The biggest disadvantage of this is
> that the default action will happen on your links if they're clicked
> before the ajax call returns.
>
> Anyway, here's a few ideas.
>
> -- Scott
[jQuery] better way to access JSON than with $.getJSON on each button press
Hi,
I have created a function that binds behavior to a set of links, the
result of clicking being that the container div of the navigations
gets a new background image, and eventually gets html injected into
the div as well (currently that part is not coded)...
Given the following function, it seems like there would be a better
way to handle accessing the JSON file each time a link is pressed than
doing a $.getJSON each time. Is there a prescribed way for storing
that JSON after the first call and being able to access it later? Or,
could I set up variables each time the particular part of the JSON
file is called and if that same button is clicked again, return the
variable instead of accessing the JSON? Thanks for the help,
$.getJSON("/dev/home/pp.json",
function(data){
$('.pomonaPeople').css('background', 'url(' + data.items
[0].background + ' )' );
$('.pomonaPeople').append(data.items[0].content);
$('.pomonaPeople .loading').fadeOut(FADE);
});
// create navigation
var ppButton = $('#pp-nav ul li a');
ppButton.click( function(event) {
event.preventDefault();
var aIndex = $(this).attr('href');
var destination = $('.pomonaPeople');
destination.append('');
$.getJSON("/dev/home/pp.json",
function(data){
destination.css('background', 'url(' + data.items
[aIndex].background + ' )' );
destination.find('.loading').fadeOut(FADE);
});
});
[jQuery] dynamic loading of content from json file: questions about performance and best practices
Hello, I am in the process of creating a slideshow/gallery of 5 'panes', each of which will have some interactive content with hover/click behaviour and hidden/animated sections of content that can be accessed and manipulated. Currently, the gallery is pulling in each 'pane' from a json file. It is randomizing the starting pane though, and I would like to optimize the loading of the json file such that the variable that is being set to determine the starting pane determines which part of the json file is loaded first. Im assuming its pretty easy to load a particular portion of a json file first before the others, though I have yet to try and implement this. I am more interested in best practices/performance boosts in relation to loading the different parts of the json file. I imagine a scenario in which a loading icon is visible until the entirety of each pane is loaded. Does anyone have input as to what I should take into consideration in terms of making sure I am loading the 5 'panes' from the json file in order of appearance on the page and not in the json file? Thanks,
[jQuery] Re: help with indexing items with random variable to appear in correct order
Was trying some other options and basically figured out the indexing/
setting the id issue: .attr('id', 'pane-' + ((LENGTH - startingPane) +
i) % LENGTH ). I am still curious about this codes performance though
and any suggestions as to how it could be made better. Thanks,
On Sep 14, 10:43 am, roryreiff wrote:
> I would also be interested in comments/suggestions about how this code
> or even approach could be simplified/improved. It seems pretty
> lightweight and simple to me, but I have very little idea about it's
> performance and am curious if I am doing something that is unnecessary
> or just plain pointless.
>
> On Sep 14, 10:28 am, roryreiff wrote:
>
> > Hello,
>
> > Below is a script I am working on for a slideshow for a set of 5 divs.
> > I am generating a random number to represent the index of the starting
> > div, i.e. the one that gets displayed in the middle. All of the other
> > 4 divs get relative indexes so that they appear either to the left or
> > right of the starting div. When the forward or backward buttons get
> > clicked, 4 of the 5 divs animate and the 5th gets positioned to the
> > oppossite far side as it should. My problem is that when I am
> > performing my initial $.getJson call, I need to set an id on each 5
> > (to the formula of pane-0, pane-1, etc.). This ID determines the
> > initial positioning of the divs. My issue is that I am trying to set
> > that ID in relationship to the variable startingPane, and something
> > isn't getting set right when the starting pane is either the 4th or
> > 5th div.
>
> > Once the arrow buttons are clicked, my two functions set everything
> > right and it all works great from there...I am just having an issue
> > with the initial injection and how to set those IDs correctly such
> > that they take my startingPane variable into account and maintain the
> > correct ordering (i.e., the relational order of the panes should
> > always be middle, right, farRight, farLeft, Left and then middle again
> > and so on).
>
> > Anyone have any suggestions? The jQuery file is viewable
> > athttp://www.pomona.edu/dev/home/spotlight-gallery.jsandthe page
> > calling it athttp://pomona.edu/dev/home/index.asp
>
> > Thanks for any help/input you can give.
[jQuery] Re: help with indexing items with random variable to appear in correct order
I would also be interested in comments/suggestions about how this code or even approach could be simplified/improved. It seems pretty lightweight and simple to me, but I have very little idea about it's performance and am curious if I am doing something that is unnecessary or just plain pointless. On Sep 14, 10:28 am, roryreiff wrote: > Hello, > > Below is a script I am working on for a slideshow for a set of 5 divs. > I am generating a random number to represent the index of the starting > div, i.e. the one that gets displayed in the middle. All of the other > 4 divs get relative indexes so that they appear either to the left or > right of the starting div. When the forward or backward buttons get > clicked, 4 of the 5 divs animate and the 5th gets positioned to the > oppossite far side as it should. My problem is that when I am > performing my initial $.getJson call, I need to set an id on each 5 > (to the formula of pane-0, pane-1, etc.). This ID determines the > initial positioning of the divs. My issue is that I am trying to set > that ID in relationship to the variable startingPane, and something > isn't getting set right when the starting pane is either the 4th or > 5th div. > > Once the arrow buttons are clicked, my two functions set everything > right and it all works great from there...I am just having an issue > with the initial injection and how to set those IDs correctly such > that they take my startingPane variable into account and maintain the > correct ordering (i.e., the relational order of the panes should > always be middle, right, farRight, farLeft, Left and then middle again > and so on). > > Anyone have any suggestions? The jQuery file is viewable > athttp://www.pomona.edu/dev/home/spotlight-gallery.jsand the page > calling it athttp://pomona.edu/dev/home/index.asp > > Thanks for any help/input you can give.
[jQuery] help with indexing items with random variable to appear in correct order
Hello, Below is a script I am working on for a slideshow for a set of 5 divs. I am generating a random number to represent the index of the starting div, i.e. the one that gets displayed in the middle. All of the other 4 divs get relative indexes so that they appear either to the left or right of the starting div. When the forward or backward buttons get clicked, 4 of the 5 divs animate and the 5th gets positioned to the oppossite far side as it should. My problem is that when I am performing my initial $.getJson call, I need to set an id on each 5 (to the formula of pane-0, pane-1, etc.). This ID determines the initial positioning of the divs. My issue is that I am trying to set that ID in relationship to the variable startingPane, and something isn't getting set right when the starting pane is either the 4th or 5th div. Once the arrow buttons are clicked, my two functions set everything right and it all works great from there...I am just having an issue with the initial injection and how to set those IDs correctly such that they take my startingPane variable into account and maintain the correct ordering (i.e., the relational order of the panes should always be middle, right, farRight, farLeft, Left and then middle again and so on). Anyone have any suggestions? The jQuery file is viewable at http://www.pomona.edu/dev/home/spotlight-gallery.js and the page calling it at http://pomona.edu/dev/home/index.asp Thanks for any help/input you can give.
[jQuery] Re: something amiss with json call/file
The problem ended up being my call to .getJson and something about how
jQuery was recogzing the url as being cross domain. I changed the call
to the file to be relative and it is working now. Thanks for the help.
On Sep 11, 4:57 pm, Scott Haneda wrote:
> Maybe your use of appendTo is wrong, I just did this test:
>
> $.getJSON("http://www.pomona.edu/dev/home/spotlight.json";,
> function(data){
> $.each(data.items, function(i, item){
> $("div").append(i);
>
> });
> });
>
>
>
> I got 01234, so the index of each item in your JSON. With that, you
> know your JSON is ok, and you need to look at what appendTo is not
> working.
>
> Sorry I can not be of more help, this is about day 2 of Jquery for me.
>
> On Sep 11, 2009, at 3:56 PM,roryreiffwrote:
>
>
>
> > I have the following code:
>
> > // pull in json feed and inject panes into page
> > $.getJSON("http://www.pomona.edu/dev/home/spotlight.json";,
> > function(data){
> > $.each(data.items, function(i,item){
> > $(' > class=\"pane\">').appendTo('#spotlight-panes');
> > });
> > });
>
> > and I cannot figure out what is going wrong. As you can see, I am not
> > even trying to do anything yet with the json data, but assuming that I
> > should still be seeing some divs injected into the DOM. Wondering if
> > there is something wrong with my JSON file? Any help is
> > appreciated...I just can't figure out what is going on! Code in effect
> > here:http://pomona.edu/dev/home/index.aspThanks,
>
> --
> Scott * If you contact me off list replace talklists@ with scott@ *
[jQuery] something amiss with json call/file
Hello,
I have the following code:
// pull in json feed and inject panes into page
$.getJSON("http://www.pomona.edu/dev/home/spotlight.json";,
function(data){
$.each(data.items, function(i,item){
$('').appendTo('#spotlight-panes');
});
});
and I cannot figure out what is going wrong. As you can see, I am not
even trying to do anything yet with the json data, but assuming that I
should still be seeing some divs injected into the DOM. Wondering if
there is something wrong with my JSON file? Any help is
appreciated...I just can't figure out what is going on! Code in effect
here: http://pomona.edu/dev/home/index.asp Thanks,
[jQuery] Re: retrieving item description of link from JSON file
Perhaps it makes most sense then to have it in the title tag. I'm not sure how much it will be used, but there will be an equal number of links to hover over as pages in our site (so, very many). We will have it gzipped though, so perhaps that is the best route? On Jul 6, 2:02 pm, James wrote: > Well, if you put it in the title tag, it will save on a lot of the > HTTP requests. Though it wouldn't affect bandwidth much because most > likely the json will be cached the first time, it will still kick out > requests to check if the file was modified. Are there going to be a > lot of links to hover over? Is it something that would be hovered over > often? > > Embedding the content in the page shouldn't been too bad if you have > compression (GZIP/Deflate) set on your webserver. That will save on a > lot of bandwidth. > > So it depends. I think if it's something that the visitors would use > very often, I would have it in the HTML. > > On Jul 6, 10:25 am, roryreiff wrote: > > > I would also like to add that it would be very easy to bake in the > > description fields into the title tags...but for a sitemap of a very > > large site, I am thinking this will bloat the html to be very obese > > (We will easily have well over 5,000 pages). Any thoughts on this as > > well?
[jQuery] Re: retrieving item description of link from JSON file
Perhaps it makes most sense then to have it in the title tag. I'm not sure how much it will be used, but there will be an equal number of links to hover over as pages in our site (so, very many). We will have it gzipped though, so perhaps that is the best route? On Jul 6, 2:02 pm, James wrote: > Well, if you put it in the title tag, it will save on a lot of the > HTTP requests. Though it wouldn't affect bandwidth much because most > likely the json will be cached the first time, it will still kick out > requests to check if the file was modified. Are there going to be a > lot of links to hover over? Is it something that would be hovered over > often? > > Embedding the content in the page shouldn't been too bad if you have > compression (GZIP/Deflate) set on your webserver. That will save on a > lot of bandwidth. > > So it depends. I think if it's something that the visitors would use > very often, I would have it in the HTML. > > On Jul 6, 10:25 am, roryreiff wrote: > > > I would also like to add that it would be very easy to bake in the > > description fields into the title tags...but for a sitemap of a very > > large site, I am thinking this will bloat the html to be very obese > > (We will easily have well over 5,000 pages). Any thoughts on this as > > well?
[jQuery] Re: retrieving item description of link from JSON file
I would also like to add that it would be very easy to bake in the description fields into the title tags...but for a sitemap of a very large site, I am thinking this will bloat the html to be very obese (We will easily have well over 5,000 pages). Any thoughts on this as well?
[jQuery] [tooltip] retrieving item description of link from JSON file
Hi there,
For our sitemap, I am attempting to create functionality that when a
user hovers over a link, a description is shown in a tooltip, similar
to how a video and it's description show on hover at netflix.com. Our
sitemap has a sister json file, that has the description fields in it.
My thinking is that when you hover over a link, the $.getJSON("") is
invoked and is iterated through, returning the description field for
the item when the link rel tag == the id field in the json file. I am
successfully accessing the json file, but I am trying to integrate
this into the tooltip plugin (http://bassistance.de/jquery-plugins/
jquery-plugin-tooltip/). Here is what I have so far. It is also
possible that there is a much better way to do this, in which case I
am all ears. I'm not really sure if this is even possible with the
tooltip plugin? Thanks!
$('#site-map-list a').tooltip({/* tooltips for site-map */
bodyHandler: function() {
var ID = $(this).attr('rel');
var TEST = "testing";
$.getJSON("/sitemap.json", function(data, item){
$.each(data.items, function(i,item){
if ( item.id == ID ) {
console.log("IDs match");
TEST = item.description;
}
});
return TEST;
});
}
});
[jQuery] Re: question about approaching an interactive image gallery
Hello, I have updated the code a bit, and I think that the problem I am having has to do with scope and how I am binding my pause() and click functions to my controls? Any help is greatly appreciated. Basically, each time either arrow left or arrow right is clicked, I have bound a function to click forward/back as well as 'pause', which sets my variable autoPlay to false, and thus prevents setTimeout from calling in forwardClick(). The first time an arrow is clicked this works as it should, however when you start playing the gallery again, and click another arrow, pause is not called. Any ideas what the problem is I am having? Thanks... Code: http://www.pomona.edu/dev/spock/spock-feed-3.js Code in action: http://www.pomona.edu/dev/spock/index-3.asp -Rory On Apr 27, 10:19 am, roryreiff wrote: > I have approached a solution, or at least am very close. I have run > into a problem though... > > In my initial binds to my forward and backward controls, I am binding > the functions backwardClick() and forwardClick(), as well as to each > an if statement that calls pause() if my variable 'gallery' is set to > 'playing'. This works as it should the first time a control is > clicked, but after you set the gallery to be playing again, this > functionality does not work. The gallery starts out autoplaying, and I > want it to stop autoplaying each time either forward or backward is > clicked, as well as the pause button. Any ideas why this is so? > Thanks, > > Code:http://www.pomona.edu/dev/spock/spock-feed-2.js > Code in action:http://www.pomona.edu/dev/spock/index-2.asp > > On Apr 23, 11:16 pm, ml2009 wrote: > > > HiRoryreiff- > > > would these plugins help? > > >http://malsup.com/jquery/cycle/ > > >http://code.google.com/p/agile-carousel/ > > > On Apr 15, 11:43 am,roryreiff wrote: > > > > Hi there, > > > > I want to start developing a simple interactive image gallery for a > > > home page. My goal is for it to behave similar to SlideViewer > > > (http://www.gcmingati.net/wordpress/wp-content/lab/jquery/imagestrip/i..) > > > in it's functionality, except that instead of clicking on a list of > > > numbers, there will be navigation controls( arrow left, arrow right) > > > to go forwards or backwards in the images. I also want to have > > > accompanying text that appears in a div overlay. > > > > I am thinking that best way to do this is to have jQuery interacting > > > with an XML file that contains the image urls and the accompanying > > > text? I also want the behavior that on page load I prefetch all the > > > images and text so that the navigation between images is seamless (at > > > least prefetch a certain number ahead). Does anyone have input on how > > > to approach this? > > > > Thanks,
[jQuery] Re: question about approaching an interactive image gallery
I have approached a solution, or at least am very close. I have run into a problem though... In my initial binds to my forward and backward controls, I am binding the functions backwardClick() and forwardClick(), as well as to each an if statement that calls pause() if my variable 'gallery' is set to 'playing'. This works as it should the first time a control is clicked, but after you set the gallery to be playing again, this functionality does not work. The gallery starts out autoplaying, and I want it to stop autoplaying each time either forward or backward is clicked, as well as the pause button. Any ideas why this is so? Thanks, Code: http://www.pomona.edu/dev/spock/spock-feed-2.js Code in action: http://www.pomona.edu/dev/spock/index-2.asp On Apr 23, 11:16 pm, ml2009 wrote: > HiRoryreiff- > > would these plugins help? > > http://malsup.com/jquery/cycle/ > > http://code.google.com/p/agile-carousel/ > > On Apr 15, 11:43 am,roryreiff wrote: > > > Hi there, > > > I want to start developing a simple interactive image gallery for a > > home page. My goal is for it to behave similar to SlideViewer > > (http://www.gcmingati.net/wordpress/wp-content/lab/jquery/imagestrip/i..) > > in it's functionality, except that instead of clicking on a list of > > numbers, there will be navigation controls( arrow left, arrow right) > > to go forwards or backwards in the images. I also want to have > > accompanying text that appears in a div overlay. > > > I am thinking that best way to do this is to have jQuery interacting > > with an XML file that contains the image urls and the accompanying > > text? I also want the behavior that on page load I prefetch all the > > images and text so that the navigation between images is seamless (at > > least prefetch a certain number ahead). Does anyone have input on how > > to approach this? > > > Thanks,
[jQuery] basic image gallery, running into a few problems
Hello there, I have created a simply navigable image gallery with a bit of json, as well as .animate() and altering the margin of elements. Currently, I am pulling in the 5 most recent images with a tag of 'spock' from flickr. It seems to be working fine, except that when clicking through very fast it gets a bit wonky. I am also really curious as to opinions on better ways of doing this? Perhaps there is a way that relies upon the json instead of simply just injecting it into the dom right off the bat? The basic strategy I employed was to animate the current image off the stage, and then make it invisibe, while also animating the next image onto the stage after making it visible. I have a feeling it's these queued effects/animations that aren't dealing so well with fast clicks. Perhaps the best way to solve this is limit when/how the arrows can be clicked? Any help is greatly appreciated. Thanks! example: http://www.pomona.edu/dev/spock/index.asp js: http://www.pomona.edu/dev/spock/spock-feed.js
[jQuery] question about approaching an interactive image gallery
Hi there, I want to start developing a simple interactive image gallery for a home page. My goal is for it to behave similar to SlideViewer (http:// www.gcmingati.net/wordpress/wp-content/lab/jquery/imagestrip/imageslide-plugin.html) in it's functionality, except that instead of clicking on a list of numbers, there will be navigation controls( arrow left, arrow right) to go forwards or backwards in the images. I also want to have accompanying text that appears in a div overlay. I am thinking that best way to do this is to have jQuery interacting with an XML file that contains the image urls and the accompanying text? I also want the behavior that on page load I prefetch all the images and text so that the navigation between images is seamless (at least prefetch a certain number ahead). Does anyone have input on how to approach this? Thanks,
[jQuery] Re: jQuery validation question: validating multiple email inputs
ml2009,
I seem to have it working within the confines of validating multiple
email addresses within the plugin's reg exp. I made the validation
check run only if the email length is greater than one...this takes
care of the case when a user has a comma after the last email address
(i.e., this prevents validation on the empty list or empty list with
space). I also remove any whitespaces before or after each email
address. Hopefully this will help:
email: function(value, element) {
if(this.optional(element))
{
return true;
}
var valid = true;
var emails = value.split(",");
for(var i in emails)
{
emailAddress = Trim(emails[i]);
if (emailAddress.length > 0) {
valid = valid &&
/^((([a-z]|\d|[!#\$%&'\*\+\-\/=\?\^_`{\|}~]|
[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])+(\.([a-z]|\d|[!#\$%&'\*\+\-
\/=\?\^_`{\|}~]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])+)*)|((\x22)
\x20|\x09)*(\x0d\x0a))?(\x20|\x09)+)?(([\x01-\x08\x0b\x0c\x0e-\x1f
\x7f]|\x21|[\x23-\x5b]|[\x5d-\x7e]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-
\uFFEF])|(\\([\x01-\x09\x0b\x0c\x0d-\x7f]|[\u00A0-\uD7FF\uF900-\uFDCF
\uFDF0-\uFFEF]*(((\x20|\x09)*(\x0d\x0a))?(\x20|\x09)+)?(\x22)))@
((([a-z]|\d|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])|(([a-z]|\d|
[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])([a-z]|\d|-|\.|_|~|[\u00A0-
\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])*([a-z]|\d|[\u00A0-\uD7FF\uF900-
\uFDCF\uFDF0-\uFFEF])))\.)+(([a-z]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-
\uFFEF])|(([a-z]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])([a-z]|\d|-|
\.|_|~|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])*([a-z]|[\u00A0-\uD7FF
\uF900-\uFDCF\uFDF0-\uFFEF])))\.?$/i.test(emailAddress);
}
}
return valid;
},
// remove whitespaces at beginning and end of string
function Trim(str){
while(str.charAt(0) == (" ") )
{ str = str.substring(1);
}
while(str.charAt(str.length-1) == " " )
{ str = str.substring(0,str.length-1);
}
return str;
}
On Mar 2, 10:06 am, ml2009 wrote:
> Hi Stephan - thank you so much for your response.
>
> I keep trying, but being unsuccessful. I tried valid = valid &&,
> (valid=valid) &&, and (valid == valid) &&, but I get a syntax error
> reference in Firebug. I even tried declaring
>
> var valid = (value.length > 0); // make sure that value is not empty
>
> outside the for loop with a conditional statement if(valid==true)
> inside the for loop, but I am sure I'm doing something wrong. could
> you help again?
>
> jQuery.validator.addMethod("multiemail", function(value, element)
> {
> if (this.optional(element)) // return true on optional element
> return true;
> var emails = value.split(',');
> valid = true;
> for(var i in emails) {
> value = emails[i];
> valid=valid && return
> jQuery.validator.methods.email.call(this,
> value, element);
> }
> }
> return valid;
> },
> jQuery.validator.messages.email // use default message
> );
>
> On Mar 2, 2:50 am, Stephan Veigl wrote:
>
> > Hi,
>
> > you have the same error as above.
>
> > Having a return statement in a for loop will evaluate the first element
> > only.
> > If you want to validate all emails that's a logical AND conjunction of
> > all single email validations. So you have to have some and function in
> > your code as well.
> > Try something like:
>
> > valid = true;
> > for(var i in emails) {
> > value = emails[i];
> > valid = valid && jQuery.validator.methods.email.call(this, value,
> > element, param);}
>
> > return valid;
>
> > by(e)
> > Stephan
>
> > 2009/3/2 ml2009 :
>
> > > Hello - wonder if you could help me. I tried another way to validate
> > > multiple email addresses, but I still couldn't figure it out. on code
> > > below, only the first email is validated. Any suggestions?
>
> > > jQuery.validator.addMethod("multiemail", function(value, element,
> > > param) {
> > > if (this.optional(element)) // return true on optional element
> > > return true;
> > > var emails = value.split(',');
>
> > > // for(var i = 0; i < emails.length; i++) {
> > > for(var i in emails) {
> > > value = emails[i];
> > > //alert(i);
> > > return
> > > jQuery.validator.methods.email.call(this, value, element,
> > > param);
[jQuery] Re: jQuery validation question: validating multiple email inputs
ml2009,
I seem to have it working within the confines of validating multiple
email addresses within the plugin's reg exp. I made the validation
check run only if the email length is greater than one...this takes
care of the case when a user has a comma after the last email address
(i.e., this prevents validation on the empty list or empty list with
space). I also remove any whitespaces before or after each email
address. Hopefully this will help:
email: function(value, element) {
if(this.optional(element))
{
return true;
}
var valid = true;
var emails = value.split(",");
for(var i in emails)
{
emailAddress = Trim(emails[i]);
if (emailAddress.length > 0) {
valid = valid &&
/^((([a-z]|\d|[!#\$%&'\*\+\-\/=\?\^_`{\|}~]|
[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])+(\.([a-z]|\d|[!#\$%&'\*\+\-
\/=\?\^_`{\|}~]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])+)*)|((\x22)
\x20|\x09)*(\x0d\x0a))?(\x20|\x09)+)?(([\x01-\x08\x0b\x0c\x0e-\x1f
\x7f]|\x21|[\x23-\x5b]|[\x5d-\x7e]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-
\uFFEF])|(\\([\x01-\x09\x0b\x0c\x0d-\x7f]|[\u00A0-\uD7FF\uF900-\uFDCF
\uFDF0-\uFFEF]*(((\x20|\x09)*(\x0d\x0a))?(\x20|\x09)+)?(\x22)))@
((([a-z]|\d|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])|(([a-z]|\d|
[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])([a-z]|\d|-|\.|_|~|[\u00A0-
\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])*([a-z]|\d|[\u00A0-\uD7FF\uF900-
\uFDCF\uFDF0-\uFFEF])))\.)+(([a-z]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-
\uFFEF])|(([a-z]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])([a-z]|\d|-|
\.|_|~|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])*([a-z]|[\u00A0-\uD7FF
\uF900-\uFDCF\uFDF0-\uFFEF])))\.?$/i.test(emailAddress);
}
}
return valid;
},
// remove whitespaces at beginning and end of string
function Trim(str){
while(str.charAt(0) == (" ") )
{ str = str.substring(1);
}
while(str.charAt(str.length-1) == " " )
{ str = str.substring(0,str.length-1);
}
return str;
}
On Mar 2, 10:06 am, ml2009 wrote:
> Hi Stephan - thank you so much for your response.
>
> I keep trying, but being unsuccessful. I tried valid = valid &&,
> (valid=valid) &&, and (valid == valid) &&, but I get a syntax error
> reference in Firebug. I even tried declaring
>
> var valid = (value.length > 0); // make sure that value is not empty
>
> outside the for loop with a conditional statement if(valid==true)
> inside the for loop, but I am sure I'm doing something wrong. could
> you help again?
>
> jQuery.validator.addMethod("multiemail", function(value, element)
> {
> if (this.optional(element)) // return true on optional element
> return true;
> var emails = value.split(',');
> valid = true;
> for(var i in emails) {
> value = emails[i];
> valid=valid && return
> jQuery.validator.methods.email.call(this,
> value, element);
> }
> }
> return valid;
> },
> jQuery.validator.messages.email // use default message
> );
>
> On Mar 2, 2:50 am, Stephan Veigl wrote:
>
> > Hi,
>
> > you have the same error as above.
>
> > Having a return statement in a for loop will evaluate the first element
> > only.
> > If you want to validate all emails that's a logical AND conjunction of
> > all single email validations. So you have to have some and function in
> > your code as well.
> > Try something like:
>
> > valid = true;
> > for(var i in emails) {
> > value = emails[i];
> > valid = valid && jQuery.validator.methods.email.call(this, value,
> > element, param);}
>
> > return valid;
>
> > by(e)
> > Stephan
>
> > 2009/3/2 ml2009 :
>
> > > Hello - wonder if you could help me. I tried another way to validate
> > > multiple email addresses, but I still couldn't figure it out. on code
> > > below, only the first email is validated. Any suggestions?
>
> > > jQuery.validator.addMethod("multiemail", function(value, element,
> > > param) {
> > > if (this.optional(element)) // return true on optional element
> > > return true;
> > > var emails = value.split(',');
>
> > > // for(var i = 0; i < emails.length; i++) {
> > > for(var i in emails) {
> > > value = emails[i];
> > > //alert(i);
> > > return
> > > jQuery.validator.methods.email.call(this, value, element,
> > > param);
[jQuery] Re: tooltip container flowing off page in Safari 4, not resizing as should
Does anyone know if this can be easily addressed? It is Safari 4 Mac, to be precise. Thanks, On Mar 10, 8:52 am, roryreiff wrote: > Hi there, > > In my implementation of the tooltip plugin, I have notice that in > Safari 4 the tooltip does not resize when the cursor moves against the > window. That is, I have track set to true as default, so initially the > tooltip formats so that it does not overflow over the side of the > window, but then as the mouse moves it will maintain the same height > and width, forcing a scrollbar when moused over in the direction of > the window. Im not sure if this is just a little bug that needs to be > fixed for the plugin, or something wrong with my implementation. > > Here is the page in question. Hover over the image in the article body > (in Safari 4) to see what I mean.http://www.pomona.edu/dev/web44.asp > > Thanks,
[jQuery] Re: tooltip container flowing off page in Safari 4, not resizing as should
Does anyone know if this can be easily addressed? It is Safari 4 Mac, to be precise. Thanks, On Mar 10, 8:52 am, roryreiff wrote: > Hi there, > > In my implementation of the tooltip plugin, I have notice that in > Safari 4 the tooltip does not resize when the cursor moves against the > window. That is, I have track set to true as default, so initially the > tooltip formats so that it does not overflow over the side of the > window, but then as the mouse moves it will maintain the same height > and width, forcing a scrollbar when moused over in the direction of > the window. Im not sure if this is just a little bug that needs to be > fixed for the plugin, or something wrong with my implementation. > > Here is the page in question. Hover over the image in the article body > (in Safari 4) to see what I mean.http://www.pomona.edu/dev/web44.asp > > Thanks,
[jQuery] Re: making variable in [tooltip] plugin available to Shadowbox
Thanks...this did the trick:
$('a[rel^="shadowbox"]').each(
function(){
var linkRel = $(this).attr('rel');
var linkTitle = $(this).attr('title');
$(this).attr('rel', linkRel + "title=" + linkTitle);
});
On Mar 10, 1:46 pm, BB wrote:
> Hiroryreiff,
>
> maybe you store the title-attribut from the current element in a
> variable and add it when the tooltip hides.
>
> If this doesn't work try to set the title in the rel-attribut:
> rel="shadowbox;title='Hallo'"
>
> On 10 Mrz., 18:25,roryreiff wrote:
>
> > Hi there,
>
> > I am using the tooltip plugin successfully, though I have run into a
> > problem in that I have another plugin, Shadowbox, that needs to access
> > the title attributes that tooltip if blasting away. Is there any way
> > to make the tooltip variable 'tooltipText' global such that I can call
> > it from my Shadowbox plugin as well? Conceptually speaking, how can
> > this be approached. Any recommendations on how to accomplish this?
> > Thanks,
>
> > Here is the page in question:http://www.pomona.edu/dev/web44.asp
[jQuery] making variable in [tooltip] plugin available to Shadowbox
Hi there, I am using the tooltip plugin successfully, though I have run into a problem in that I have another plugin, Shadowbox, that needs to access the title attributes that tooltip if blasting away. Is there any way to make the tooltip variable 'tooltipText' global such that I can call it from my Shadowbox plugin as well? Conceptually speaking, how can this be approached. Any recommendations on how to accomplish this? Thanks, Here is the page in question: http://www.pomona.edu/dev/web44.asp
[jQuery] [tooltip] tooltip container flowing off page in Safari 4, not resizing as should
Hi there, In my implementation of the tooltip plugin, I have notice that in Safari 4 the tooltip does not resize when the cursor moves against the window. That is, I have track set to true as default, so initially the tooltip formats so that it does not overflow over the side of the window, but then as the mouse moves it will maintain the same height and width, forcing a scrollbar when moused over in the direction of the window. Im not sure if this is just a little bug that needs to be fixed for the plugin, or something wrong with my implementation. Here is the page in question. Hover over the image in the article body (in Safari 4) to see what I mean. http://www.pomona.edu/dev/web44.asp Thanks,
[jQuery] Re: jQuery validation question: validating multiple email inputs
Yeah, I actually have that fixed in the posted link, but thanks for
pointing that out. So, something else is at error now.
On Feb 17, 9:04 am, Stephan Veigl wrote:
> Hi
>
> is this just a copy & paste error, or a real syntax error? You have to
> quote the comma in your split command:
> var emails = value.split(",");
>
> by(e)
> Stephan
>
> 2009/2/17roryreiff:
>
>
>
> > So far, I have adapted this:
>
> > email: function(value, element) {
> > return this.optional(element) ||
> > /^((([a-z]|\d|[!#\$%&'\*\+\-\/=\?
> > \^_`{\|}~]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])+(\.([a-z]|\d|[!#\
> > $%&'\*\+\-\/=\?\^_`{\|}~]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])+)
> > *)|((\x22)\x20|\x09)*(\x0d\x0a))?(\x20|\x09)+)?(([\x01-\x08\x0b\x0c
> > \x0e-\x1f\x7f]|\x21|[\x23-\x5b]|[\x5d-\x7e]|[\u00A0-\uD7FF\uF900-\uFDCF
> > \uFDF0-\uFFEF])|(\\([\x01-\x09\x0b\x0c\x0d-\x7f]|[\u00A0-\uD7FF\uF900-
> > \uFDCF\uFDF0-\uFFEF]*(((\x20|\x09)*(\x0d\x0a))?(\x20|\x09)+)?
> > (\x22)))@((([a-z]|\d|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])|(([a-
> > z]|\d|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])([a-z]|\d|-|\.|_|~|
> > [\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])*([a-z]|\d|[\u00A0-\uD7FF
> > \uF900-\uFDCF\uFDF0-\uFFEF])))\.)+(([a-z]|[\u00A0-\uD7FF\uF900-\uFDCF
> > \uFDF0-\uFFEF])|(([a-z]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])([a-
> > z]|\d|-|\.|_|~|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])*([a-z]|
> > [\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])))\.?$/i.test(value);
> > },
>
> > into this:
>
> > email: function(value, element) {
> > var emails = value.split(,);
> > for(var emailAddress in emails)
> > {
> > return this.optional(element) ||
> > /^((([a-z]|\d|[!#\$%&'\*\+\-\/=\?
> > \^_`{\|}~]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])+(\.([a-z]|\d|[!#\
> > $%&'\*\+\-\/=\?\^_`{\|}~]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])+)
> > *)|((\x22)\x20|\x09)*(\x0d\x0a))?(\x20|\x09)+)?(([\x01-\x08\x0b\x0c
> > \x0e-\x1f\x7f]|\x21|[\x23-\x5b]|[\x5d-\x7e]|[\u00A0-\uD7FF\uF900-\uFDCF
> > \uFDF0-\uFFEF])|(\\([\x01-\x09\x0b\x0c\x0d-\x7f]|[\u00A0-\uD7FF\uF900-
> > \uFDCF\uFDF0-\uFFEF]*(((\x20|\x09)*(\x0d\x0a))?(\x20|\x09)+)?
> > (\x22)))@((([a-z]|\d|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])|(([a-
> > z]|\d|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])([a-z]|\d|-|\.|_|~|
> > [\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])*([a-z]|\d|[\u00A0-\uD7FF
> > \uF900-\uFDCF\uFDF0-\uFFEF])))\.)+(([a-z]|[\u00A0-\uD7FF\uF900-\uFDCF
> > \uFDF0-\uFFEF])|(([a-z]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])([a-
> > z]|\d|-|\.|_|~|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])*([a-z]|
> > [\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])))\.?$/i.test(emailAddress);
> > }
> > },
>
> > any thoughts why this is not working? Thanks,
>
> > On Feb 13, 11:10 am, Ed Lerner wrote:
> >> I'm new to jQuery as well. In other languages, you would take the
> >> string that holds all of the emails and do a 'split' on commas. This
> >> should give you an array where each element is an individual email.
> >> From there, just validate each element.
> >> How to do this in jQuery, someone more experienced than I may be able
> >> to help with.
>
> >> On Feb 13, 11:28 am,roryreiff wrote:
>
> >> > Hi there,
>
> >> > I am using the Validation plugin to validate a form that emails the
> >> > current pages URL to the recipients entered in to the "email to"
> >> > field. I want to validate that field for multiple emails addressed
> >> > separated by commas...and ideas on how to do this? I'm a bit new to
> >> > jQuery so I am a little confused how to approach this. I was thinking
> >> > somehow altering the email function so that is parses the input and
> >> > does a for each on every email address. Is this correct thinking? Is
> >> > there an easier way to do this?
>
> >> > Thanks,
[jQuery] Re: jQuery validation question: validating multiple email inputs
Rob,
By not working I mean that it now will not return an error message
when the first input is a well formed email. So, I could put in the
following (correctly formed email, incorrectly formed email + and
number of items) and it is validating that field, i.e. not producing
the error message. I want it to only validate when all the input email
addresses are well formed.
I will look into what you have put above, though I am wondering if
there is something I am missing with what I have so far that will
force the validation plugin email method, which I have adapted, to
consider all the inputs in the to field. It seems to only be taking
into consideration the first. Perhaps the problem exists in using a
for loop? Is that loop ending as soon as a well formed email address
is encountered?
Thanks so much for the help,
On Feb 16, 8:03 pm, RobG wrote:
> On Feb 17, 10:53 am, roryreiff wrote:
>
>
>
> > So far, I have adapted this:
>
> [...]
> > into this:
>
> > email: function(value, element) {
> > var emails = value.split(,);
> > for(var emailAddress in emails)
> > {
> > return this.optional(element) ||
> > /^((([a-z]|\d|[!#\$%&'\*\+\-\/=\?
> > \^_`{\|}~]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])+(\.([a-z]|\d|[!#\
> > $%&'\*\+\-\/=\?\^_`{\|}~]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])+)
> > *)|((\x22)\x20|\x09)*(\x0d\x0a))?(\x20|\x09)+)?(([\x01-\x08\x0b\x0c
> > \x0e-\x1f\x7f]|\x21|[\x23-\x5b]|[\x5d-\x7e]|[\u00A0-\uD7FF\uF900-\uFDCF
> > \uFDF0-\uFFEF])|(\\([\x01-\x09\x0b\x0c\x0d-\x7f]|[\u00A0-\uD7FF\uF900-
> > \uFDCF\uFDF0-\uFFEF]*(((\x20|\x09)*(\x0d\x0a))?(\x20|\x09)+)?
> > (\x22)))@((([a-z]|\d|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])|(([a-
> > z]|\d|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])([a-z]|\d|-|\.|_|~|
> > [\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])*([a-z]|\d|[\u00A0-\uD7FF
> > \uF900-\uFDCF\uFDF0-\uFFEF])))\.)+(([a-z]|[\u00A0-\uD7FF\uF900-\uFDCF
> > \uFDF0-\uFFEF])|(([a-z]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])([a-
> > z]|\d|-|\.|_|~|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])*([a-z]|
> > [\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])))\.?$/i.test(emailAddress);
> > }
> > },
>
> > any thoughts why this is not working? Thanks,
>
> What does "not work" mean? Does it reject valid addresses? Allow
> invalid addresses? It is at least scrupulously complex. :-)
>
> How about simply testing for something basic like /^[^\...@[^\s]+$/
> and leaving it at that? You can't trust that your client-side script
> has validated the string before being sent, so you have to do whatever
> processing you require on the server anyway.
>
> The fact that the address is well-formed (per RFC 5321 and RFC 5322)
> doesn't mean it is valid (as in working or exists).
>
> If you are expecting a comma separated list, consider something like:
>
> var addresses = '@foo.com, a...@foo.com, st...@bar.com';
> var valid;
> $((addresses).split(',')).each(
> (function() {
> var re = /^[^\...@[^\s]+$/;
> return function(i, s) {
> valid = re.test(jQuery.trim(s));
> return valid;
> };
> })());
> alert(valid);
>
> --
> Rob
[jQuery] Re: jQuery validation question: validating multiple email inputs
Allow me to show you what I have so far. It seems to validate base on
the first email, but none of the successive ones, in regards to the to
field: http://www.pomona.edu/asp/mailthis-redux.asp
On Feb 16, 4:53 pm, roryreiff wrote:
> So far, I have adapted this:
>
> email: function(value, element) {
> return this.optional(element) ||
> /^((([a-z]|\d|[!#\$%&'\*\+\-\/=\?
> \^_`{\|}~]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])+(\.([a-z]|\d|[!#\
> $%&'\*\+\-\/=\?\^_`{\|}~]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])+)
> *)|((\x22)\x20|\x09)*(\x0d\x0a))?(\x20|\x09)+)?(([\x01-\x08\x0b\x0c
> \x0e-\x1f\x7f]|\x21|[\x23-\x5b]|[\x5d-\x7e]|[\u00A0-\uD7FF\uF900-\uFDCF
> \uFDF0-\uFFEF])|(\\([\x01-\x09\x0b\x0c\x0d-\x7f]|[\u00A0-\uD7FF\uF900-
> \uFDCF\uFDF0-\uFFEF]*(((\x20|\x09)*(\x0d\x0a))?(\x20|\x09)+)?
> (\x22)))@((([a-z]|\d|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])|(([a-
> z]|\d|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])([a-z]|\d|-|\.|_|~|
> [\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])*([a-z]|\d|[\u00A0-\uD7FF
> \uF900-\uFDCF\uFDF0-\uFFEF])))\.)+(([a-z]|[\u00A0-\uD7FF\uF900-\uFDCF
> \uFDF0-\uFFEF])|(([a-z]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])([a-
> z]|\d|-|\.|_|~|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])*([a-z]|
> [\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])))\.?$/i.test(value);
> },
>
> into this:
>
> email: function(value, element) {
> var emails = value.split(,);
> for(var emailAddress in emails)
> {
> return this.optional(element) ||
> /^((([a-z]|\d|[!#\$%&'\*\+\-\/=\?
> \^_`{\|}~]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])+(\.([a-z]|\d|[!#\
> $%&'\*\+\-\/=\?\^_`{\|}~]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])+)
> *)|((\x22)\x20|\x09)*(\x0d\x0a))?(\x20|\x09)+)?(([\x01-\x08\x0b\x0c
> \x0e-\x1f\x7f]|\x21|[\x23-\x5b]|[\x5d-\x7e]|[\u00A0-\uD7FF\uF900-\uFDCF
> \uFDF0-\uFFEF])|(\\([\x01-\x09\x0b\x0c\x0d-\x7f]|[\u00A0-\uD7FF\uF900-
> \uFDCF\uFDF0-\uFFEF]*(((\x20|\x09)*(\x0d\x0a))?(\x20|\x09)+)?
> (\x22)))@((([a-z]|\d|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])|(([a-
> z]|\d|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])([a-z]|\d|-|\.|_|~|
> [\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])*([a-z]|\d|[\u00A0-\uD7FF
> \uF900-\uFDCF\uFDF0-\uFFEF])))\.)+(([a-z]|[\u00A0-\uD7FF\uF900-\uFDCF
> \uFDF0-\uFFEF])|(([a-z]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])([a-
> z]|\d|-|\.|_|~|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])*([a-z]|
> [\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])))\.?$/i.test(emailAddress);
> }
> },
>
> any thoughts why this is not working? Thanks,
>
> On Feb 13, 11:10 am, Ed Lerner wrote:
>
> > I'm new to jQuery as well. In other languages, you would take the
> > string that holds all of the emails and do a 'split' on commas. This
> > should give you an array where each element is an individual email.
> > From there, just validate each element.
> > How to do this in jQuery, someone more experienced than I may be able
> > to help with.
>
> > On Feb 13, 11:28 am,roryreiff wrote:
>
> > > Hi there,
>
> > > I am using the Validation plugin to validate a form that emails the
> > > current pages URL to the recipients entered in to the "email to"
> > > field. I want to validate that field for multiple emails addressed
> > > separated by commas...and ideas on how to do this? I'm a bit new to
> > > jQuery so I am a little confused how to approach this. I was thinking
> > > somehow altering the email function so that is parses the input and
> > > does a for each on every email address. Is this correct thinking? Is
> > > there an easier way to do this?
>
> > > Thanks,
[jQuery] Re: jQuery validation question: validating multiple email inputs
So far, I have adapted this:
email: function(value, element) {
return this.optional(element) ||
/^((([a-z]|\d|[!#\$%&'\*\+\-\/=\?
\^_`{\|}~]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])+(\.([a-z]|\d|[!#\
$%&'\*\+\-\/=\?\^_`{\|}~]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])+)
*)|((\x22)\x20|\x09)*(\x0d\x0a))?(\x20|\x09)+)?(([\x01-\x08\x0b\x0c
\x0e-\x1f\x7f]|\x21|[\x23-\x5b]|[\x5d-\x7e]|[\u00A0-\uD7FF\uF900-\uFDCF
\uFDF0-\uFFEF])|(\\([\x01-\x09\x0b\x0c\x0d-\x7f]|[\u00A0-\uD7FF\uF900-
\uFDCF\uFDF0-\uFFEF]*(((\x20|\x09)*(\x0d\x0a))?(\x20|\x09)+)?
(\x22)))@((([a-z]|\d|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])|(([a-
z]|\d|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])([a-z]|\d|-|\.|_|~|
[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])*([a-z]|\d|[\u00A0-\uD7FF
\uF900-\uFDCF\uFDF0-\uFFEF])))\.)+(([a-z]|[\u00A0-\uD7FF\uF900-\uFDCF
\uFDF0-\uFFEF])|(([a-z]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])([a-
z]|\d|-|\.|_|~|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])*([a-z]|
[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])))\.?$/i.test(value);
},
into this:
email: function(value, element) {
var emails = value.split(,);
for(var emailAddress in emails)
{
return this.optional(element) ||
/^((([a-z]|\d|[!#\$%&'\*\+\-\/=\?
\^_`{\|}~]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])+(\.([a-z]|\d|[!#\
$%&'\*\+\-\/=\?\^_`{\|}~]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])+)
*)|((\x22)\x20|\x09)*(\x0d\x0a))?(\x20|\x09)+)?(([\x01-\x08\x0b\x0c
\x0e-\x1f\x7f]|\x21|[\x23-\x5b]|[\x5d-\x7e]|[\u00A0-\uD7FF\uF900-\uFDCF
\uFDF0-\uFFEF])|(\\([\x01-\x09\x0b\x0c\x0d-\x7f]|[\u00A0-\uD7FF\uF900-
\uFDCF\uFDF0-\uFFEF]*(((\x20|\x09)*(\x0d\x0a))?(\x20|\x09)+)?
(\x22)))@((([a-z]|\d|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])|(([a-
z]|\d|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])([a-z]|\d|-|\.|_|~|
[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])*([a-z]|\d|[\u00A0-\uD7FF
\uF900-\uFDCF\uFDF0-\uFFEF])))\.)+(([a-z]|[\u00A0-\uD7FF\uF900-\uFDCF
\uFDF0-\uFFEF])|(([a-z]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])([a-
z]|\d|-|\.|_|~|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])*([a-z]|
[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])))\.?$/i.test(emailAddress);
}
},
any thoughts why this is not working? Thanks,
On Feb 13, 11:10 am, Ed Lerner wrote:
> I'm new to jQuery as well. In other languages, you would take the
> string that holds all of the emails and do a 'split' on commas. This
> should give you an array where each element is an individual email.
> From there, just validate each element.
> How to do this in jQuery, someone more experienced than I may be able
> to help with.
>
> On Feb 13, 11:28 am,roryreiff wrote:
>
> > Hi there,
>
> > I am using the Validation plugin to validate a form that emails the
> > current pages URL to the recipients entered in to the "email to"
> > field. I want to validate that field for multiple emails addressed
> > separated by commas...and ideas on how to do this? I'm a bit new to
> > jQuery so I am a little confused how to approach this. I was thinking
> > somehow altering the email function so that is parses the input and
> > does a for each on every email address. Is this correct thinking? Is
> > there an easier way to do this?
>
> > Thanks,
[jQuery] [validate] jQuery validation question: validating multiple email inputs
Hi there, I am using the Validation plugin to validate a form that emails the current pages URL to the recipients entered in to the "email to" field. I want to validate that field for multiple emails addressed separated by commas...and ideas on how to do this? I'm a bit new to jQuery so I am a little confused how to approach this. I was thinking somehow altering the email function so that is parses the input and does a for each on every email address. Is this correct thinking? Is there an easier way to do this? Thanks,
[jQuery] [validate] multiple email addresses in single input
Hi there, I was wondering how I might approach altering the jQuery Validate plugin to allow for an input with multiple email addresses, separated by commas, that validates each email address as being correct. I'm still a bit new to jQuery/javascript, so I'm curious as to how exactly I might approach this. Thanks,
