Re: [jQuery] Re: Two search kriteria

2010-01-24 Thread John Arrowwood
Do you have firebug installed?  Or Safari?  Or something which gives you a
console?  If so, before the autocomplete line, insert:

console.log( $('#zip').val() );

By the way, it was 'val' and not 'value', I was working from memory, and my
memory was obviously a tad faulty.  I usually don't use it, so...

Where would I look it up?  The jquery documentation:  api.jquery.com, more
specifically http://api.jquery.com/category/attributes/

Anyway, if the console.log command outputs the correct value, check to make
sure that the back-end script is being called.  If not, we will need more
details.

On Sun, Jan 24, 2010 at 11:18 AM, Frank Becker  wrote:

> Give your Zip field an ID, then use $('#zip').value() instead of
>> form.ZIP.value.  Or maybe it's .value without parenthesis, I don't
>> remember, and I'm not in the mood to go look it up for you.  :)  But
>> bottom line, don't use 'form.ZIP'.  That's the part that isn't working.
>>
>
> Hi John,
>
> The input-field for the zip-code has the id zip already.
>
> Unfortunately this doesn't work.
>
>$("#street").autocomplete('search.php?what=street&
>add='+$('#zip').value(), {
> The script search.php isn't called. Nothing happens.
>
> The other possibility also doesn't work
>
>$("#street").autocomplete('search.php?what=street&
>    add='+$('#zip').value, {
> In search.php the parameter "add" is undefined.
>
> You wrote, you are not in the mood to look for me. Where would you look? I
> can do it too.
>
> Best regards
> --
> Frank Becker
>
>


-- 
John Arrowwood
John (at) Irie (dash) Inc (dot) com
John (at) Arrowwood Photography (dot) com
John (at) Hanlons Razor (dot) com
--
http://www.irie-inc.com/
http://arrowwood.blogspot.com/


Re: [jQuery] Two search kriteria

2010-01-23 Thread John Arrowwood
Give your Zip field an ID, then use $('#zip').value() instead of
form.ZIP.value.  Or maybe it's .value without parenthesis, I don't remember,
and I'm not in the mood to go look it up for you.  :)  But bottom line,
don't use 'form.ZIP'.  That's the part that isn't working.

On Sat, Jan 23, 2010 at 4:17 PM, Frank Becker
wrote:

> Hi all,
>
> first of all I'm sorry if this posting is hard to read. English is not my
> mother tongue.
>
> I'm new to jQuery and jQuery-Autocomplete. I want to create an
> "intelligent" input form like
>
> Name: 
> ZIP: ___
> City: 
> Street: _
>
> If the ZIP-code is entered the city is filled automatically. That works.
> What I want is an autocompletion for street. In my database I have a list of
> all streets and the appropriate ZIP-codes
> e.g.
>
> 34128 / A-Road
> 34128 / B-Road
> 34128 / B-Street
> 34128 / C-Street
>
> If the ZIP-Code is 34128 and the first key pressed in the street-field is a
> "B", then only B-Road and B-Street should be shown in the autocomplete list.
>
> I have the following code fragment, taken from the demo (json.html) and
> adapted to fit my needs.
>
> $("#street").autocomplete('search.php?what=street&add='+$('#zip').val(), {
> ...
>
>
> search.php receives $_GET[q] the input of the user, in $_GET[what] what to
> search for (street, ZIP, ...) and in $_GET[add] is stored an additional
> parameter (ZIP in this case).
>
> The problem is, that I cannot send the value of the ZIP-code to search.php.
> I tried with the example above and with
>
> $("#street").autocomplete('search.php?what=street&add='+form.ZIP.value, {
> ...
>
> In this case, the additional parameter $add contains form.ZIP.value and not
> 34128.
>
> If I write
> $("#street").autocomplete('search.php?what=street&add=34128', { ...
>
> everything works fine.
>
>
> Thank you in advance for your help and hava a nice weekend.
> --
> Frank Becker
>
>


-- 
John Arrowwood
John (at) Irie (dash) Inc (dot) com
John (at) Arrowwood Photography (dot) com
John (at) Hanlons Razor (dot) com
--
http://www.irie-inc.com/
http://arrowwood.blogspot.com/


Re: [jQuery] jQuery and div/iframe/pane content replace

2010-01-22 Thread John Arrowwood
You could probably come up with a dozen ways of doing it.  You could have
different divs all loaded but hidden, then hide and show them as needed,
which would be a very different animation than you have now.  Or you could
use ajax to load the different DIV contents (which might be nice for site
organization) and then either load them into the hidden divs or just store
them in variables for swapping in and out.

If you need fancy animations, you are going to want to do something like
hide (or fade out) the old div, and then have some custom animation that
causes the new div to appear in the way you want it to appear.

If you are aiming for search engine optimization, you probably don't want to
rely on AJAX to load the content.  You probably want to just have three (or
more) divs that start hidden.  Each has a unique ID.  You could even store a
reference to a unique 'animateShow' function attached to each div.

One
Two
Three
...
One's content
Two's content
Three's content

Assuming each div needs a custom 'show' animation, you could do this:

$('#one').data('animateShow',showOne);
$('#two').data('animateShow',showTwo);
$('#three').data('animateShow',showThree);

Then to hook it all up:

var activeContent = 'one';
$('a.leftMenu').click(function(ev){
  var targetId = $(ev.target).attr('target');
  if ( targetId != activeContent ) {
var targetDiv = $('#'+targetId)[0];
if ( targetDiv != null ) {
  $('#' + activeContent ).fadeOut('fast');
  var animation = $(targetDiv).data('animateShow');
  if ( animation ) animation( targetDiv )
  else $(targetDiv).fadeIn('fast');
  activeContent = targetId;
}
  }
  return false;
});

Hope that gets you down the road towards where you want to be.

On Fri, Jan 22, 2010 at 3:31 PM, Eugene Hourany  wrote:

> Hi everyone,
>
> I'm using jQuery to power all the nice animation effects and such. But I'm
> also using it to make my DOM life easier too.
>
> With that, here's what I want to do:
>
> When you click on a link (in this case, an ), the  to its right is
> replaced with new content. I tried to do this earlier with an  but I
> think it's overkill for what I want.
>
> I'm working on this page to get a "non-flash" version running because of
> SEO compliance: http://www.theportalgrp.com. So, for example, clicking on
> "services" will bring up the services div on the right. Would using jQuery
> objects that contain the s be better, and then do a content replace?
>
> And I don't know if .toggle() is better, or .click() or which function to
> do what I want.
>
> Any help would be greatly appreciated.
>
> Thanks!
>
> Eugene
>



-- 
John Arrowwood
John (at) Irie (dash) Inc (dot) com
John (at) Arrowwood Photography (dot) com
John (at) Hanlons Razor (dot) com
--
http://www.irie-inc.com/
http://arrowwood.blogspot.com/


Re: [jQuery] Re: New Forums

2010-01-22 Thread John Arrowwood
Silly thought:

What if the forums were 'published' to the mailing list, and the mailing
list were made read-only?  That is, every time a post is published on the
forum, it is automatically sent to the mailing list.  Then, in the footer of
the message is a link to reply to the post, which when clicked takes you to
the forum in such a way that the user can immediately reply to that post.

The mailing list could be set up so that nobody except the forum 'bot' could
post to it, which would make spam go away.  People that have accessibility
issues or just prefer to get their information via their email client could
continue to read things that way.  And you would have all of the benefits of
the forum.

Best of both worlds.  Make everybody happy.  I know it would make me
happier.

On Fri, Jan 22, 2010 at 1:05 PM, Octavian Rasnita wrote:

> From: "MorningZ" 
> Besides, as Richard pointed out, the mailing list right here will
> still exist, it just won't be moderated/managed by the people it was
> before..
>
> That would be good, because at least for a period there would still be an
> accessible source of information for JQuery.
>
> Octavian
>
>


-- 
John Arrowwood
John (at) Irie (dash) Inc (dot) com
John (at) Arrowwood Photography (dot) com
John (at) Hanlons Razor (dot) com
--
http://www.irie-inc.com/
http://arrowwood.blogspot.com/


Re: [jQuery] Re: saving state of treeview and form data afteer refresh

2010-01-21 Thread John Arrowwood
So if I understand correctly, you are trying to make the page links work in
a search results page?

So let's pretend it is Google.  You have a search form at the top, so you
can search again, and you have some search results, and you have a series of
links that represent which page in the search results you want to see.
Assuming that is the set up, there are many ways to do this, but the
simplest way I can think of is this:

You have your initial search form.
Add a hidden form field, call it 'viewPage' and initially set the value to
'1'.
When the user clicks Search, the PHP script gets the message that it is
supposed to display page 1 of the results.
It generates the results page, like you are used to.
In that result page is the search form, again, including the viewPage hidden
field.
The default value of the search form is the value that was passed in to the
script that generated the page.  That part is done in PHP, not in
Javascript.
Same with the viewPage hidden value.
Now, the page links invoke JavaScript which modifies the viewPage variable,
and then submits the form.
Then, when a link is clicked, the user sends the search string back to the
server, along with the 'viewPage' parameter.
Your server-side script looks at it, sees that you want page 2, for example,
and generates the appropriate result.

WARNING: If you modify the search term, and then click a page link, it may
not do exactly what the user expected.  If you don't want it to behave that
way, you will need to save the original search term, and submit that.

Now, if you are trying to do this all dynamically, and trying to avoid any
page reloads, then modify the page number links so that the click event
returns false.  Then, the page will not reload, and you won't lose the form
contents.

On Thu, Jan 21, 2010 at 12:29 PM, Danijel  wrote:

> I said F5 because i have problem wiht pressing button on loaded form
> in div #forms, this form is search form, when i click button "Show
> data" in next div #data i display data with pagging, but i do not use
> jquery paging, bucause i need different showing items ( description
> and picture) and when i click on page "2" page is set to default
> values #treview is set to root, #forms is clean,  #data dvi is empty.
>
> on search form
> $("#btnsearch").click(function() {
>$.post("Advert/pagingAdvert.php",
> $("#searchEstate").serialize(),
>function(data){
>  $("#result1").html(data.description);
>   }, "json");
>  return false;
>});
>
>
> with result "false" i disabled reloading page. but when i click on
> page where i used :
>  2
>
> page is refreshed and all data and froms are set to default values. I
> do not have idea hot save state of page.
>
> can you help maybe with some example, i programming in php in jquery 1
> month and web pages.
>
> br,Dani
>
>
> On 21 jan., 15:53, John Arrowwood  wrote:
> > Try creating an unload event handler that goes through your forms and
> writes
> > the data therein to a cookie.  Same thing with the state of the tree.
>  Then
> > write an onload event handler that looks for the cookies, and if found,
> > populates the form elements and the tree state.
> >
> > If that doesn't work, then you are going to have to add events to all of
> the
> > form elements that allow the cookie data to be saved as you go.
> >
> > But...  why are you pressing F5 in the first place?
> >
> >
> >
> > On Thu, Jan 21, 2010 at 1:32 AM, Danijel 
> wrote:
> > > i spent about several days trying to figure out hot to save state of
> > > open forms.
> >
> > > In my web page I have a jquery treeview tool, when I click form is
> > > loaded into the #treview div.
> >
> > > $(document).ready(function(){
> > > 
> >
> > > $("#treview").treeview({
> > >   url: "category_async.php",
> > >fileClick: function() {
> > >   id = $(this).attr("id");
> > >   $.get("categories.php?id=" + id, {}, function
> > > (data) {
> > >  $("#forms").html(data);
> > >});
> > >  }
> > >});
> > > ...
> >
> > > };
> >
> > > data repreesnt url page address i.e. "forms/inputdata.php"
> >
> > > When i F5 - refresh page on browser div #forms clears and div #treevew
> > > is set
> > 

Re: [jQuery] saving state of treeview and form data afteer refresh

2010-01-21 Thread John Arrowwood
Try creating an unload event handler that goes through your forms and writes
the data therein to a cookie.  Same thing with the state of the tree.  Then
write an onload event handler that looks for the cookies, and if found,
populates the form elements and the tree state.

If that doesn't work, then you are going to have to add events to all of the
form elements that allow the cookie data to be saved as you go.

But...  why are you pressing F5 in the first place?

On Thu, Jan 21, 2010 at 1:32 AM, Danijel  wrote:

> i spent about several days trying to figure out hot to save state of
> open forms.
>
>
> In my web page I have a jquery treeview tool, when I click form is
> loaded into the #treview div.
>
> $(document).ready(function(){
> 
>
> $("#treview").treeview({
>   url: "category_async.php",
>fileClick: function() {
>   id = $(this).attr("id");
>   $.get("categories.php?id=" + id, {}, function
> (data) {
>  $("#forms").html(data);
>});
>  }
>});
> ...
>
> };
>
> data repreesnt url page address i.e. "forms/inputdata.php"
>
> When i F5 - refresh page on browser div #forms clears and div #treevew
> is set
> to root element.
>
> I exepcteed #treeview should stay open (on the node which i clicked)
> and #form should have page loaded with inserted data ../forms/
> inputdata.php
>
> What should i do to treevew will stay open, page will stay in div
> #forms and
> data will be displayed on page?
>
> thanks in advance
>
> br,Dani
>



-- 
John Arrowwood
John (at) Irie (dash) Inc (dot) com
John (at) Arrowwood Photography (dot) com
John (at) Hanlons Razor (dot) com
--
http://www.irie-inc.com/
http://arrowwood.blogspot.com/


Re: [jQuery] Lists, Filtering and Searching, Oh My!

2010-01-19 Thread John Arrowwood
json is one approach.  XML is another.  CSV works, too.  The format of the
file should be what works best for the people that need to maintain it.
Then, you need to find a good way of getting that data into the browser and
in a format that is easy to work with.

How often does this file change?  Is this something that can be loaded at
the beginning of the user session and then cached?  Or do you need to update
the user's view regularly?  That is, do you need multiple ajax calls, or
just load it all in on page load?

If it were me, using Excel to manage the list, and exporting to CSV, then
loading and parsing that is probably what I would do.  Just make sure your
CSV parsing code is bug-free.  :)  When you load and parse the CSV, just
load each record into an object in an array.  Piece of cake.  Then you build
your display based on the array, sorting and/or filtering as you do so,
based on what the user needs.  That last part has the potential to be a
slightly sticky piece of cake if you tried to do it all yourself, but even
then it is doable.

Using the QuickSearch might work, but looking at the sample, it's pretty
slow with even a small list (looking at the table example), so with such a
large data set, it may not be much fun.  Won't know until you try.  There
are also plugins (are there not?) which turn tables into sortable/searchable
data sets.  You could build one of those as an 'alternative possibility' for
your users to look at.



On Tue, Jan 19, 2010 at 4:54 AM, david.vansc...@gmail.com <
david.vansc...@gmail.com> wrote:

> A while back, the company I work for tasked me with coming up with a
> better way to move through a listing of forms on our Intranet.  The
> way it was done before involved two identical files being maintained
> simultaneously, one sorted by the form ID (AA0001) and the other by
> name.  The list of forms is nothing to sneeze at ... the first page
> includes a list of over 1800 forms.
>
> My first stab at a solution moved everything into a single unordered
> list.  I was able to assign classes to each list item for the alpha
> character, the ID and type.  Clicking on the appropriate links would
> show only those items which you selected.  I also plugged in Rik
> Lomas' awesome QuickSearch plugin to quickly search the list.  The
> only drawback was that the group responsible for maintaining the list
> of forms had to choose whether they wanted the list sorted by name or
> form ID.  They chose name.  Last week though, they decided that wasn't
> good enough and they needed to be able to sort by either name or form
> ID, so I've been handed this project again and told to make it work
> more to their liking.  A table would break from the way they've
> organized these forms for years now, so they're really not interested
> in something like that, so it'd really need to be a list.  The forms
> need to be able to be sorted alphabetically by name or form ID as well
> as organized by category.
>
> My first idea was to build a big (and I mean BIG) JSON file that would
> store all the information for these forms.  I'd then be able to parse
> through the JSON object and build the list on the fly based on what
> they clicked.  Of course, we're talking about a JSON file that'd
> probably be over 2000 lines and would have to be parsed every time
> they click something (I'm not sure if I could call in the JSON file
> and have it available instead of using $.getJSON).  Then there's the
> issue of searching.  Obviously QuickSearch works great, but how am I
> going to search through a static file without throwing everything on
> to the page?
>
> As you can see, I've begun brainstorming some ideas, but I'd really
> love to hear what other solutions come to mind for you guys.  Any
> ideas you have would be awesome.  Thanks!
>
>
> David
>



-- 
John Arrowwood
John (at) Irie (dash) Inc (dot) com
John (at) Arrowwood Photography (dot) com
John (at) Hanlons Razor (dot) com
--
http://www.irie-inc.com/
http://arrowwood.blogspot.com/


Re: [jQuery] Animation for cloned elements

2010-01-18 Thread John Arrowwood
Is the item you are cloning already visible?  If so, there is nothing for
'slideDown' to do.  After you clone, but before you append, make it so that
it is not visible (by whatever means is most appropriate), and see if that
solves the problem.

On Mon, Jan 18, 2010 at 3:28 PM, Andy789  wrote:

> Hi All,
>
> I am trying to clone an element and add it with some animation efects.
> something like
>
> $item.clone(true).appendTo($list).slideDown("slow");
>
> It adds an element correctly, but I cannot get any effects working
> (tried fadeIn etc).
>
> What am i doing wrong?
>
> Thanks
>



-- 
John Arrowwood
John (at) Irie (dash) Inc (dot) com
John (at) Arrowwood Photography (dot) com
John (at) Hanlons Razor (dot) com
--
http://www.irie-inc.com/
http://arrowwood.blogspot.com/


[jQuery] Mixing jsTree with jqueryUI draggable and droppable

2010-01-18 Thread John Arrowwood
I'm trying to create a tight integration between two trees and a 'desktop'
on which are floating elements (cards).  I need to be able to:

* drag and drop a tree node to the 'desktop' to 'open' the card that the
node represents
* drop a tree node onto an open card in order to create a relationship
between them
* drop an open card onto a tree node (also creates a relationship)
* drop either an open card or a tree node anywhere on the 'tree' object that
is not otherwise a drop target in order to effectively drop the card on the
'root' node of the tree

(because 1.0 is not out yet, I'm using 0.9.9a of jsTree)

I added droppable to my desktop element, but no event fires when I drop a
tree node onto it.  What is the correct way of telling when a tree node is
dropped on something outside the tree?  Does the helper need to have the
ui-draggable class in order to work with a droppable, or is there more to
it?

I also added a call to the tree's drop_mode inside the draggable's .start()
event.  I can't see any evidence that it did anything, other than I know the
call was made:  $.tree.drop_mode({type:X}).  Now, when I drag around a card,
it drags the original element, so it is possible that the mouse events are
being received by the card element, and never making it to the tree.  But
the drag-and-drop behavior of the card is exactly what I want, the card is
semi-transparent so I can see what I am dropping it on.  Items set as drop
points using 'droppable' work fine, but the tree does not.  What is the
correct way of working with the tree and 'draggable' objects?

Also, draggable objects support a 'revert' animation.  I'd like to be able
to revert the dropped card if I am holding the meta key, and close the open
card if I am not.  That is a question for the jQuery UI team, I suppose, but
I'm asking it here, too, in case you happen to know the answer.

Another thing I want is to have the default behavior differ depending on
whether or not I am dragging-and-dropping within a tree, or between trees.
Within a tree, I want the default action to be a 'move'.  Between trees, I
want it to be a 'copy'.  Looking at the source, it looks like it won't work
that way.  Am I understanding what I am reading correctly?  Is there a way
to simulate it?  Or do I need to add a feature to the tree code in order to
get that behavior?

-- 
John Arrowwood
John (at) Irie (dash) Inc (dot) com
John (at) Arrowwood Photography (dot) com
John (at) Hanlons Razor (dot) com
--
http://www.irie-inc.com/
http://arrowwood.blogspot.com/


Re: [jQuery] Re: Real time AJAX

2010-01-17 Thread John Arrowwood
Have you looked at Web Sockets?

On Sun, Jan 17, 2010 at 5:17 AM, Izad CM  wrote:

> Hmm, I get what you mean, but how exactly do I update the label
> text in real-time? One of the better ways that I've discovered is by
> using "long polling" technique (
>
> http://blog.perplexedlabs.com/2009/05/04/php-jquery-ajax-javascript-long-polling/
> ). What do you think?
>
> On Jan 17, 12:16 am, waseem sabjee  wrote:
> > I'm guessing you mean like on google wave.
> >
> > ok.
> > AJAX would mean passing data to a file and returning a response to the
> user
> > without refreshing the page the user is on.
> >
> > you could say what you want falls sort of under JavaScript animation
> >
> > say you have something like this.
> >
> > My test th at can be edited
> > My test th at can be edited
> >
> > the above is you HTML markup.
> > the text area is hidden and the label is shown.
> > when the user clicks the label you would hide the label and show the text
> > area. as well as focus on the textarea.
> > when the users blurs from the text are or presses enter you hide the text
> > are and show the label. however you update the label text.
> >
> > var obj = $(".editable");
> > var lbl = obj.next();
> > lbl.click(function() {
> >  lbl.hide();
> >  obj.show();
> >  obj.focus();
> >
> > });
> >
> > obj.blur(function() {
> >  lbl.text(obj.text());
> >  obj.hide();
> >  lbl.show()l;
> >
> > });
> >
> > obj.keypress(function(e) {
> >  if(e.which == 13) {
> >  lbl.text(obj.text());
> >  obj.hide();
> >  lbl.show()l;
> >  }
> >
> > });
> > On Sat, Jan 16, 2010 at 7:45 AM, Izad CM  wrote:
> > > Hi guys. I'm a jQuery newbie and naturally I have a question. :)
> >
> > > What's the best way to do real-time AJAX calls? I'm developing a web
> > > app that has a functionality which is somewhat similar to Google
> > > Wave's "real-time blip editing feature". Well, you know that thing
> > > where we can see the blip being edited by someone else in real-time?
> > > That's the thing I'm referring to.
> >
> > > What's the best way to do that? One think that I can think of is to do
> > > periodic ajax calls using setTimeout() or setInterval(), but I'm not
> > > sure if that's the standard way of doing this. Can someone point me in
> > > the right direction? Thanks.
>



-- 
John Arrowwood
John (at) Irie (dash) Inc (dot) com
John (at) Arrowwood Photography (dot) com
John (at) Hanlons Razor (dot) com
--
http://www.irie-inc.com/
http://arrowwood.blogspot.com/


Re: [jQuery] Re: background-color always returns "transparent"

2010-01-13 Thread John Arrowwood
That suggests that the selector that you are using to do your test is not
quite right.  Throw in a console.log( elem ) in a judicious location and
find out what is being passed in.

On Wed, Jan 13, 2010 at 12:00 PM, John  wrote:

> Yes, it does look right on screen. Also the wired thing is that if I
> use
> Firebug console to manually get the color by
>
> $("#category-list > li.division:eq(0) ul > li:eq(0)").css("background-
> color");
>
> it returns the correct one, rgb(255, 0, 0). Not sure why it does not
> work programmatically.
>
> Thanks,
>
> John
> On Jan 13, 2:37 pm, John Arrowwood  wrote:
> > But it LOOKS right on screen?
> >
> > On Wed, Jan 13, 2010 at 10:22 AM, John  wrote:
> > > Sorry for the confusion. Actually, the getColor is a function called
> > > by another function,
> > > which first checks all different css, if the css is color related and
> > > the value is transparent, then
> > > passes in the dom element, not jquery object, to the getColor function
> > > to get back the
> > > actual color. I did trace in firebug and the getColor did walk up to
> > > the body, all nodes
> > > returned "transparent" if I put the css style in the head. If I use in-
> > > line css style, it works
> > > fine.
> >
> > > Thanks,
> >
> > > John
> >
> > > On Jan 13, 10:42 am, John Arrowwood  wrote:
> > > > Make sure you are passing in a document node and not a jQuery object.
> >
> > > > if ( elem instanceof jQuery ) elem = elem.get(0);
> >
> > > > If you were passing in a jQuery object, the 'parent =
> parent.parentNode'
> > > > line would immediately set parent to null.
> >
> > > > Also, shouldn't your getColor function return the color if it is set
> on
> > > > elem, too, instead of always looking up the chain?  Doesn't it make
> more
> > > > sense to have one call, rather than putting some of your logic in the
> > > > function, and some outside of it?
> >
> > > > function getColor( of, what ) {
> > > >   var elem = of;
> > > >   if ( elem instanceof jQuery ) elem = elem.get(0);
> > > >   var color = null;
> > > >   while ( elem != null ) {
> > > > color = $(elem).css(what);
> > > > if ( color != '' && color != 'transparent' ||
> > > > jQuery.nodeName(elem,'body') ) break;
> > > > elem = elem.parentNode;
> > > >   }
> > > >   return color;
> >
> > > > }
> > > > On Tue, Jan 12, 2010 at 11:12 AM, John 
> wrote:
> > > > > Sorry, I have to come back for this question. I have really wired
> > > > > problem.
> >
> > > > > I implemented the getColor similar to the jQuery color plugin as
> > > > > follows,
> >
> > > > > function getColor(elem, cssName){
> > > > >  var color = null;
> >
> > > > >  if (elem != null) {
> > > > >   var parent = elem.parentNode;
> >
> > > > >   while (parent != null) {
> > > > >   color = $(parent).css(cssName);
> > > > >  //or
> > > > >  // color = jQuery.curCSS(parent, cssName);
> > > > >   if (color != '' && color != 'transparent' ||
> jQuery.nodeName
> > > > > (parent, "body"))
> > > > >   break;
> > > > >   parent = parent.parentNode;
> > > > >   }
> > > > >   }
> >
> > > > >  return color;
> > > > > };
> >
> > > > > If I use the background color inline such as
> > > > > 
> > > > > 
> > > > > 
> > > > > 
> >
> > > > > 
> > > > > 
> > > > > 
> > > > >  
> > > > >  
> > > > >  
> > > > >   style="background-
> > > > > color:red;">
> > > > >  
> > > > >   class="category-
> > > > > suv">SUVs (6)
> > > > >  
> >
> > > > >  
> >
> > > > >      
> 

Re: [jQuery] Re: background-color always returns "transparent"

2010-01-13 Thread John Arrowwood
But it LOOKS right on screen?

On Wed, Jan 13, 2010 at 10:22 AM, John  wrote:

> Sorry for the confusion. Actually, the getColor is a function called
> by another function,
> which first checks all different css, if the css is color related and
> the value is transparent, then
> passes in the dom element, not jquery object, to the getColor function
> to get back the
> actual color. I did trace in firebug and the getColor did walk up to
> the body, all nodes
> returned "transparent" if I put the css style in the head. If I use in-
> line css style, it works
> fine.
>
> Thanks,
>
> John
>
> On Jan 13, 10:42 am, John Arrowwood  wrote:
> > Make sure you are passing in a document node and not a jQuery object.
> >
> > if ( elem instanceof jQuery ) elem = elem.get(0);
> >
> > If you were passing in a jQuery object, the 'parent = parent.parentNode'
> > line would immediately set parent to null.
> >
> > Also, shouldn't your getColor function return the color if it is set on
> > elem, too, instead of always looking up the chain?  Doesn't it make more
> > sense to have one call, rather than putting some of your logic in the
> > function, and some outside of it?
> >
> > function getColor( of, what ) {
> >   var elem = of;
> >   if ( elem instanceof jQuery ) elem = elem.get(0);
> >   var color = null;
> >   while ( elem != null ) {
> > color = $(elem).css(what);
> > if ( color != '' && color != 'transparent' ||
> > jQuery.nodeName(elem,'body') ) break;
> > elem = elem.parentNode;
> >   }
> >   return color;
> >
> >
> >
> > }
> > On Tue, Jan 12, 2010 at 11:12 AM, John  wrote:
> > > Sorry, I have to come back for this question. I have really wired
> > > problem.
> >
> > > I implemented the getColor similar to the jQuery color plugin as
> > > follows,
> >
> > > function getColor(elem, cssName){
> > >  var color = null;
> >
> > >  if (elem != null) {
> > >   var parent = elem.parentNode;
> >
> > >   while (parent != null) {
> > >   color = $(parent).css(cssName);
> > >  //or
> > >  // color = jQuery.curCSS(parent, cssName);
> > >   if (color != '' && color != 'transparent' || jQuery.nodeName
> > > (parent, "body"))
> > >   break;
> > >   parent = parent.parentNode;
> > >   }
> > >   }
> >
> > >  return color;
> > > };
> >
> > > If I use the background color inline such as
> > > 
> > > 
> > > 
> > > 
> >
> > > 
> > > 
> > > 
> > >  
> > >  
> > >  
> > >  
> > >  
> > >  SUVs (6)
> > >  
> >
> > >  
> >
> > >  
> > >  
> > >  4x4 (6)
> > >  
> >
> > >  
> > >  
> > >  
> > >   > > class="category-hybrid">Hybrid
> > >  
> > >  
> > > 
> > >  
> > >   
> > > 
> > > 
> > > 
> >
> > > 
> > > 
> >
> > > I can get back the background color of the element " > > class="category selected" > correctly, i.e.,
> > > rgb(255,0,0). However, if I move the css style to the head as follows,
> >
> > > 
> > > 
> > > 
> > > .content .division .category.selected {
> > > background-color: red;
> > > }
> > > 
> > > 
> >
> > > I always get back the value "transparent" even with the getColor
> > > method. I couldn't figure out
> > > what was wrong and please help me with this. How can I get back the
> > > background-color as
> > > rgb(255,0,0) or "red" in the latter case.
> >
> > > Thanks in advance,
> >
> > > John
> >
> > > > On Jan 11, 2:31 pm, John Arrowwood  wrote:
> >
> > >

Re: [jQuery] Re: background-color always returns "transparent"

2010-01-13 Thread John Arrowwood
Make sure you are passing in a document node and not a jQuery object.

if ( elem instanceof jQuery ) elem = elem.get(0);

If you were passing in a jQuery object, the 'parent = parent.parentNode'
line would immediately set parent to null.

Also, shouldn't your getColor function return the color if it is set on
elem, too, instead of always looking up the chain?  Doesn't it make more
sense to have one call, rather than putting some of your logic in the
function, and some outside of it?

function getColor( of, what ) {
  var elem = of;
  if ( elem instanceof jQuery ) elem = elem.get(0);
  var color = null;
  while ( elem != null ) {
color = $(elem).css(what);
if ( color != '' && color != 'transparent' ||
jQuery.nodeName(elem,'body') ) break;
elem = elem.parentNode;
  }
  return color;
}

On Tue, Jan 12, 2010 at 11:12 AM, John  wrote:

> Sorry, I have to come back for this question. I have really wired
> problem.
>
> I implemented the getColor similar to the jQuery color plugin as
> follows,
>
> function getColor(elem, cssName){
>  var color = null;
>
>  if (elem != null) {
>   var parent = elem.parentNode;
>
>   while (parent != null) {
>   color = $(parent).css(cssName);
>  //or
>  // color = jQuery.curCSS(parent, cssName);
>   if (color != '' && color != 'transparent' || jQuery.nodeName
> (parent, "body"))
>   break;
>   parent = parent.parentNode;
>   }
>   }
>
>  return color;
> };
>
> If I use the background color inline such as
> 
> 
> 
> 
>
> 
> 
> 
>  
>  
>  
>  
>  
>  SUVs (6)
>  
>
>  
>
>  
>  
>  4x4 (6)
>  
>
>  
>  
>  
>   class="category-hybrid">Hybrid
>  
>  
> 
>  
>   
> 
> 
> 
>
> 
> 
>
> I can get back the background color of the element " class="category selected" > correctly, i.e.,
> rgb(255,0,0). However, if I move the css style to the head as follows,
>
> 
> 
> 
> .content .division .category.selected {
> background-color: red;
> }
> 
> 
>
> I always get back the value "transparent" even with the getColor
> method. I couldn't figure out
> what was wrong and please help me with this. How can I get back the
> background-color as
> rgb(255,0,0) or "red" in the latter case.
>
> Thanks in advance,
>
> John
>
> >
> > On Jan 11, 2:31 pm, John Arrowwood  wrote:
> >
> > > As a QA tester with a lot of test automation experience, a bit of
> advice:
> > > Ask if the product would not ship if it wasn't red.  If the answer is
> no,
> > > then you might not want to waste your time.  Unless you have automated
> > > everything else about the functionality of the application, and are
> looking
> > > for things to automate, but I would be surprised if you had gotten that
> far
> > > already! :)
> >
> > > There are some other things you can do, too, to make it easier or
> faster.
> > > If you want to discuss it off-list, email me at j...@irie-inc.com.
> >
> > > On Mon, Jan 11, 2010 at 9:54 AM, John 
> wrote:
> > > > Thanks for your reply. I will try to see if the background color on
> > > > the parent works or not.
> >
> > > > As for checking the "red" color, I need to do a UI test and check if
> > > > the background color
> > > > is set correctly. That is to say, I am testing other people's code
> and
> > > > web page.
> >
> > > > Thanks,
> >
> > > > John
> >
> > > > On Jan 11, 12:41 pm, John Arrowwood  wrote:
> > > > > The short answer is because the background color of the item you
> have
> > > > > selected is in fact transparent.
> >
> > > > > Your style makes the  tag red.  Then you query on a child
> element
> > > > that
> > > > > has no color specified.  The background color of the child element
> is
> > > > > 'transparent' which means that the color of someth

Re: [jQuery] Passing parameters by object

2010-01-13 Thread John Arrowwood
If I were you, I would resist the temptation to do too much 'correctness'
checking if it is a plugin that you are releasing to the general public.
The reason I say that is sometimes it is desirable to add extra things in to
your configuration that the plugin doesn't expect, so that it gets stored in
context.  To allow that to happen, don't halt execution if you find
something you didn't expect, just log it.

(function($){
  // list all of your expected options and their default values here
  var defaults = {};
  var validateOptions = function(o) {
  for ( var i in o ) {
if ( ! defaults.hasOwnProperty(i) ) console.log( 'MyPlugin:
unexpected option: ' + i );
  }
};
  var MyPlugin = function(o) {
  validateOptions(o);
  o = $.extend({},defaults,o);
  ...
};
})(jQuery);

Also, once you have everything debugged, I would comment out the call to
validateOptions, so that production code is not generating console output,
since that may generate errors for some users, and does not serve anyone but
the developer.


On Wed, Jan 13, 2010 at 6:24 AM, SamCKayak  wrote:

> Passing parameters using an object has become a popular method among
> jQuery add-ins.  Few plugins actually validate the passed parameter
> object to ensure that elements are spelled correctly.
>
> Most plugins use the jQuery.extend method which would copy the passed
> parameter { resiz: 1 } just as easily as the correctly spelled
> parameter { resize: 1 }.  A validation of the object before or after
> the $.extend would ensure there were no misspellings, something like:
>
> function( arg1, arg2, oParms ) {
>  oParms = $.extend( { resize: 0, height: 100, width: 100 }, oParms )
>  // $.notIn is fictitious, returns true if any element of oParm is
> not in oAllParms
>  if ( $.notIn( oAllParms, oParms ) { some error notification here }
>  // We know the parms are good so proceed here
>
> Before inventing the wheel again, can anyone point to a clean example
> of a plugin that validates object parameters?
>



-- 
John Arrowwood
John (at) Irie (dash) Inc (dot) com
John (at) Arrowwood Photography (dot) com
John (at) Hanlons Razor (dot) com
--
http://www.irie-inc.com/
http://arrowwood.blogspot.com/


Re: [jQuery] Looping help

2010-01-12 Thread John Arrowwood
Before we start, note this:
http://www.w3schools.com/tags/att_standard_id.asp which says that an ID must
begin with a letter.  So you are going to need to modify your HTML so that
your ID values are letter then number.  Chances are, this is your whole
problem.

var list = /* JSON array */

for ( var i = 0 ; i < list.length ; i++ ) {
  var id = 'img' + ( i + 1 );  // assumes div ID's are 'img1' and 'img2' and
so forth.  Adjust accordingly
  var img = document.createElement( 'img' );
  $(img).attr('src') = list[i];
  $('#filmstrip ' + id).append( img );
}

There are many ways to do this, the above code is just a clean, instructive
way of doing it.

On Mon, Jan 11, 2010 at 9:30 PM, Randall Morgan  wrote:

> Here is a print out of the Json array returned from my php script.
>
>
> ["http:\/\/localhost\/f-stopart2\/photoshoots\/n\/PICT0853.JPG","http:\/\/localhost\/f-stopart2\/photoshoots\/n\/PICT0855.JPG","http:\/\/localhost\/f-stopart2\/photoshoots\/n\/PICT0856.JPG","http:\/\/localhost\/f-stopart2\/photoshoots\/n\/PICT0857.JPG","http:\/\/localhost\/f-stopart2\/photoshoots\/n\/PICT0858.JPG","http:\/\/localhost\/f-stopart2\/photoshoots\/n\/PICT0860.JPG","http:\/\/localhost\/f-stopart2\/photoshoots\/n\/PICT0859.JPG","http:\/\/localhost\/f-stopart2\/photoshoots\/n\/PICT0861.JPG","http:\/\/localhost\/f-stopart2\/photoshoots\/n\/PICT0862.JPG","http:\/\/localhost\/f-stopart2\/photoshoots\/n\/PICT0863.JPG","http:\/\/localhost\/f-stopart2\/photoshoots\/n\/PICT0864.JPG","http:\/\/localhost\/f-stopart2\/photoshoots\/n\/PICT0847.JPG","http:\/\/localhost\/f-stopart2\/photoshoots\/n\/PICT0849.JPG","http:\/\/localhost\/f-stopart2\/photoshoots\/n\/PICT0851.JPG","http:\/\/localhost\/f-stopart2\/photoshoots\/n\/PICT0845.JPG","http:\/\/localhost\/f-stopart2\/photoshoots\/n\/PICT0846.JPG","http:\/\/localhost\/f-stopart2\/photoshoots\/n\/PICT0850.JPG","http:\/\/localhost\/f-stopart2\/photoshoots\/n\/PICT0848.JPG"]
>
> Thank you for you help
>
> On Mon, Jan 11, 2010 at 10:25 PM, John Arrowwood 
> wrote:
> > What does your JSON array look like?
> >
> > On Mon, Jan 11, 2010 at 9:23 PM, Randall Morgan 
> wrote:
> >>
> >> Hello,
> >>
> >> I'm still pretty new to JQuery and I need to figure out how to loop
> >> over a json array and assign the array values to each of a list of
> >> divs. What I need to do is fill each filmstrip-cell with an image tag
> >> and set the source to the current value in the array. The array
> >> contains urls for each of 35 images.
> >>
> >> My code is similar to:
> >>
> >> 
> >>>>   
> >>   >>   
> >>   >>   
> >>   >>   
> >>   ...
> >>   >>   
> >> 
> >>
> >>
> >> --
> >> If you ask me if it can be done. The answer is YES, it can always be
> >> done. The correct questions however are... What will it cost, and how
> >> long will it take?
> >
> >
> >
> > --
> > John Arrowwood
> > John (at) Irie (dash) Inc (dot) com
> > John (at) Arrowwood Photography (dot) com
> > John (at) Hanlons Razor (dot) com
> > --
> > http://www.irie-inc.com/
> > http://arrowwood.blogspot.com/
> >
>
>
>
> --
> If you ask me if it can be done. The answer is YES, it can always be
> done. The correct questions however are... What will it cost, and how
> long will it take?
>



-- 
John Arrowwood
John (at) Irie (dash) Inc (dot) com
John (at) Arrowwood Photography (dot) com
John (at) Hanlons Razor (dot) com
--
http://www.irie-inc.com/
http://arrowwood.blogspot.com/


Re: [jQuery] Looping help

2010-01-11 Thread John Arrowwood
What does your JSON array look like?

On Mon, Jan 11, 2010 at 9:23 PM, Randall Morgan  wrote:

> Hello,
>
> I'm still pretty new to JQuery and I need to figure out how to loop
> over a json array and assign the array values to each of a list of
> divs. What I need to do is fill each filmstrip-cell with an image tag
> and set the source to the current value in the array. The array
> contains urls for each of 35 images.
>
> My code is similar to:
>
> 
>  
> 
> 
> 
>   ...
> 
> 
>
>
> --
> If you ask me if it can be done. The answer is YES, it can always be
> done. The correct questions however are... What will it cost, and how
> long will it take?
>



-- 
John Arrowwood
John (at) Irie (dash) Inc (dot) com
John (at) Arrowwood Photography (dot) com
John (at) Hanlons Razor (dot) com
--
http://www.irie-inc.com/
http://arrowwood.blogspot.com/


Re: [jQuery] Re: Ajax forms help

2010-01-11 Thread John Arrowwood
Your problem looks like it may be on the back-end.  Send the code that
generates the JSON.

On Mon, Jan 11, 2010 at 11:41 AM, Dave Maharaj :: WidePixels.com <
d...@widepixels.com> wrote:

> My response comes back from the server looking like this: (don’t think its
> right to begin with)
>
>
> {"data":{"title":"","year_rec":{"year":"2010"},"description":"","id":"0936d6
>
> 115e4","profile_id":"4b40eea7-2608-4a3b-9c24-7cb04adcd75b"},"status":true,"h
> tml":"this is a good test<\/p>\r\n"}this is a good test
>
> But how would I display only the html section and clean it so its not all
> slashed and escaped?
>
> Thanks
>
> Dave
> -Original Message-
> From: MorningZ [mailto:morni...@gmail.com]
> Sent: January-11-10 11:44 AM
> To: jQuery (English)
> Subject: [jQuery] Re: Ajax forms help
>
> "But if I am returning json I cant return my normal html"
>
> I don't understand why...
>
> I pretty much exclusively use JSON back and forth in my jQuery AJAX calls
> and have a standard JSON object i return:
>
> {
>   HasError: ,
>   Message: .
>   Data: ,
>   Count: 
> }
>
> Many times i'll return HTML on the data property there  i think the
> problem you are having is how you are creating the JSON return string,
> maybe
> that's not the right way to do it in PHP ??  (to note, i'm a .NET guy, i
> don't know what the PHP way is)
>
> On Jan 11, 10:06 am, "Dave Maharaj :: WidePixels.com"
>  wrote:
> > Right on...looks easy enough.
> >
> > Is response.html saying to display it as html? I tried making an array
> > to pass as json from php then json_encode it so my arrr was $response
> > = array('status' => true , 'view' => 'all my html code went here')
> >
> > But when I returned my view data from the array it was all slahsed  > "// /" / / like that.
> >
> > -Original Message-
> > From: Ibatex [mailto:mjgris...@gmail.com]
> > Sent: January-11-10 4:35 AM
> > To: jQuery (English)
> > Subject: [jQuery] Re: Ajax forms help
> >
> > The beauty of json is that you can transfer alot of different data in
> > an organized way. You can very easily send back success/failure status
> > along with the html.
> >
> > success: function(response) {
> > // Response was a success
> > if (response.status) {
> > //update my target div
> > $('#target_div').html(response.html);
> > // Response contains errors
> > } else {
> > // return the form with the errors
> >
> > }
> >
> > On Jan 10, 5:00 pm, "Dave Maharaj :: WidePixels.com"
> >  wrote:
> > > I need some help with a form.
> >
> > > I submit the form fine, my problem is depending on the success or
> > > failure of the form being saved. I will try to explain as simple as
> > > possible
> >
> > > form is in its own div 
> >
> > >  saved data will appear here
> >
> > > So what I need is i guess json success true or false response from
> > > the form being saved or not then in my success
> >
> > > success: function(response) {
> > > // Response was a success
> > > if (response) {
> > > //update my target div
> > > // Response contains errors
> > > } else {
> > > // return the form with the errors
> >
> > >     }
> >
> > > But if I am returning json I cant return my normal html after the
> > > successful save, and if I return my response as html there is no way
> > > to tell the js what to do.
> > > The form or the target is html code
> >
> > > How can I tell what the response was (true or false) and return the
> > > appropriate html code for the appropriate form or target?
> >
> > > Thanks
> >
> > > Dave
> > No virus found in this incoming message.
> > Checked by AVG -www.avg.com
> > Version: 9.0.725 / Virus Database: 270.14.130/2607 - Release Date:
> > 01/10/10 16:05:00
> No virus found in this incoming message.
> Checked by AVG - www.avg.com
> Version: 9.0.725 / Virus Database: 270.14.130/2607 - Release Date: 01/11/10
> 04:05:00
>
>


-- 
John Arrowwood
John (at) Irie (dash) Inc (dot) com
John (at) Arrowwood Photography (dot) com
John (at) Hanlons Razor (dot) com
--
http://www.irie-inc.com/
http://arrowwood.blogspot.com/


Re: [jQuery] Re: background-color always returns "transparent"

2010-01-11 Thread John Arrowwood
As a QA tester with a lot of test automation experience, a bit of advice:
Ask if the product would not ship if it wasn't red.  If the answer is no,
then you might not want to waste your time.  Unless you have automated
everything else about the functionality of the application, and are looking
for things to automate, but I would be surprised if you had gotten that far
already! :)

There are some other things you can do, too, to make it easier or faster.
If you want to discuss it off-list, email me at j...@irie-inc.com.

On Mon, Jan 11, 2010 at 9:54 AM, John  wrote:

> Thanks for your reply. I will try to see if the background color on
> the parent works or not.
>
> As for checking the "red" color, I need to do a UI test and check if
> the background color
> is set correctly. That is to say, I am testing other people's code and
> web page.
>
> Thanks,
>
> John
>
> On Jan 11, 12:41 pm, John Arrowwood  wrote:
> > The short answer is because the background color of the item you have
> > selected is in fact transparent.
> >
> > Your style makes the  tag red.  Then you query on a child element
> that
> > has no color specified.  The background color of the child element is
> > 'transparent' which means that the color of something up the tree is what
> > you will see.
> >
> > You will never see 'red' by looking at the child element.  But what you
> can
> > do (and jquery.color.js does this) is while you get 'transparent' then
> you
> > can look at the parent object.  You can walk up the tree until you get
> what
> > you are looking for.
> >
> > But before you go down that road, why are you looking to see the color of
> > the element?  If you can describe what you are trying to do in more
> general
> > terms, someone may be able to give a better suggestion on how to
> accomplish
> > it.
> >
> >
> >
> > On Mon, Jan 11, 2010 at 7:39 AM, John  wrote:
> > > Hi,
> >
> > > I used jQuery 1.3.2 and Firefox for the following html
> >
> > > 
> > > 
> > > 
> > > .content .division .category.selected {
> > > background: red;
> > > }
> >
> > > 
> > > 
> > > 
> >
> > > 
> > > 
> > > 
> > >   
> > >   
> > >   
> > >   
> > >   
> > >   SUVs (6)
> > >   
> >
> > >   
> >
> > >   
> > >   
> > >   4x4 (6)
> > >   
> >
> > >   
> > >   
> > >   
> > >> > class="category-hybrid">Hybrid
> > >   
> > >   
> > >  
> > >   
> > >
> > > 
> > > 
> > > 
> >
> > > 
> > > 
> >
> > > I used the following css command to get back the background color:
> >
> > > $("#category-list > li.division:eq(0) ul > li:eq(0) a").css
> > > ("background-color");
> >
> > > but it always returned the value "transparent" instead of the "red"
> > > color rgb(255,0,0).
> > > I also tried "backgroundColor" and it did not work either
> > > ("transparent"). How to get back
> > > the correct background color?
> >
> > > Thanks in advance,
> >
> > > John
> >
> > --
> > John Arrowwood
> > John (at) Irie (dash) Inc (dot) com
> > John (at) Arrowwood Photography (dot) com
> > John (at) Hanlons Razor (dot) com
> > --http://www.irie-inc.com/http://arrowwood.blogspot.com/
>



-- 
John Arrowwood
John (at) Irie (dash) Inc (dot) com
John (at) Arrowwood Photography (dot) com
John (at) Hanlons Razor (dot) com
--
http://www.irie-inc.com/
http://arrowwood.blogspot.com/


Re: [jQuery] background-color always returns "transparent"

2010-01-11 Thread John Arrowwood
The short answer is because the background color of the item you have
selected is in fact transparent.

Your style makes the  tag red.  Then you query on a child element that
has no color specified.  The background color of the child element is
'transparent' which means that the color of something up the tree is what
you will see.

You will never see 'red' by looking at the child element.  But what you can
do (and jquery.color.js does this) is while you get 'transparent' then you
can look at the parent object.  You can walk up the tree until you get what
you are looking for.

But before you go down that road, why are you looking to see the color of
the element?  If you can describe what you are trying to do in more general
terms, someone may be able to give a better suggestion on how to accomplish
it.


On Mon, Jan 11, 2010 at 7:39 AM, John  wrote:

> Hi,
>
> I used jQuery 1.3.2 and Firefox for the following html
>
> 
> 
> 
> .content .division .category.selected {
> background: red;
> }
>
> 
> 
> 
>
> 
> 
> 
>   
>   
>   
>   
>   
>   SUVs (6)
>   
>
>   
>
>   
>   
>   4x4 (6)
>   
>
>   
>   
>   
>class="category-hybrid">Hybrid
>   
>   
>  
>   
>
> 
> 
> 
>
> 
> 
>
> I used the following css command to get back the background color:
>
> $("#category-list > li.division:eq(0) ul > li:eq(0) a").css
> ("background-color");
>
> but it always returned the value "transparent" instead of the "red"
> color rgb(255,0,0).
> I also tried "backgroundColor" and it did not work either
> ("transparent"). How to get back
> the correct background color?
>
> Thanks in advance,
>
> John
>



-- 
John Arrowwood
John (at) Irie (dash) Inc (dot) com
John (at) Arrowwood Photography (dot) com
John (at) Hanlons Razor (dot) com
--
http://www.irie-inc.com/
http://arrowwood.blogspot.com/


Re: [jQuery] Re: Extracting content from a div?

2010-01-11 Thread John Arrowwood
If the html is in a string, e.g. 's':

$(s).html() would return everything inside the outer div.

If it includes more than just that error, you can do something like:

$(s).find('div.error').html()

On Mon, Jan 11, 2010 at 6:42 AM, youradds  wrote:

> Hi,
>
> Thanks for the reply. However, your code only seems to be any good
> with the actual page content you are on, not the values of a string?
> Remember, this data is coming through as a string (as a response from
> a jQuery .post() function, so the returned HTML then holds errors
> which may have occured - and I need to pick up on those :))
>
> TIA
>
> Andy
>
>
>
> On Jan 9, 11:09 pm, Leonardo Balter  wrote:
> > 2010/1/9 youradds 
> >
> >
> >
> > > Hi,
> >
> > > Thanks. Ok, I have this string (for example):
> >
> > > 
> > > 
> > > 
> >
> > > bit of other junk here, and maybe other divs and stuff
> >
> > >
> > >
> > >Gast Email der Rezension
> > > kann nicht den Wert 'undefined'
> > >speichern.
> > >
> > >
> >
> > > some junk here
> >
> > > 
> > > 
> >
> > > So how exactly would I extract that from a string?
> >
> > > TIA :)
> >
> > > Andy
> >
> > > On Jan 9, 1:32 pm, Leonardo Balter  wrote:
> > > > And you can simply use .text() method. This will return you only the
> text
> > > > inside your selected element.
> >
> > > > Do you also need tips on getting the child elements on that div?
> >
> > > > --
> > > > At,
> > > > Leo Balterhttp://leobalter.net
> > > > Blog técnico:http://blog.leobalter.net
> >
> > Based on jquery documentation:
> >
> > First, you can define your selectors, it's the easier way if you already
> > work with CSSs:
> >
> > http://docs.jquery.com/Selectors
> >
> > You can use something like: $('.error > ul > li').text(); to match all
> li's
> > inside the element with class set to 'error' (the . referees a element
> using
> > class name right after the dot).
> >
> > You can also use $('.error ul li').text() to get "each" li descending
> from a
> > ul than from a element with a class named 'error'. In our .text() method
> > this won't make much diference than using the first selector.
> >
> > Now let's try some jquery methods without complicating our basic
> selector:
> >
> > We have the .find() and .children() methods
> >
> > From now I'm adapting the text from jquery documentation to our example:
> >
> > "In most cases two selections made with and without find() are
> equivalent,
> > such as $('.error').find('li') and $('.error ul li'). However, using a
> > selector filter may lead to unexpected results:
> > $('.error').find('li:first').length may be > 1, (whereas $('.error
> > li:first').length will never be > 1) as there is an implicit each() done
> > within find()."
> >
> > In other words: you can try to select the first li of all div with the
> class
> > attribute named 'error'.
> >
> > Now the .children(), this method will return all the immediate
> descendants
> > elements within the selected element.
> >
> > Example: $('.error').children('ul').children('li') this will return
> exactly
> > the directly children of the .error! .find() would return all
> descendants,
> > not only the immediate ones.
> >
> > As said in the jquery documentation, it's important to refrain here:
> while
> > .children() returns only the immediate descendants, .parents() will look
> at
> > all ancestors.
> >
> > That's all,
> >
> > Have a good day.
> >
> > --
> > At,
> > Leo Balterhttp://leobalter.net
> > Blog técnico:http://blog.leobalter.net
>



-- 
John Arrowwood
John (at) Irie (dash) Inc (dot) com
John (at) Arrowwood Photography (dot) com
John (at) Hanlons Razor (dot) com
--
http://www.irie-inc.com/
http://arrowwood.blogspot.com/


Re: [jQuery] Re: XML print all nodes ( html() )

2010-01-10 Thread John Arrowwood
Try it without the clone().  And try it without the '/' after ' wrote:

> no go.
>
> On Jan 9, 10:56 pm, John Arrowwood  wrote:
> > console.log( $('').append( $(itemsXML).clone() ).html() )
> >
> > See if that works.
> >
> > On Sat, Jan 9, 2010 at 7:27 PM, Shane  wrote:
> > > Is there a way to print out the structure of a jQuery xml element...
> > > heres some code
> >
> > > $(xml).find("item").each(function(){
> > >if(myid == $(this).find("id").text()){
> > >  itemsXML = $(this).html() <-- trying to do
> something
> > > like this
> > > }
> > > }
> >
> > > i would like itemsXML to contain the entire stucture of the xml rather
> > > than the jquery object.  thanks
> >
> > --
> > John Arrowwood
> > John (at) Irie (dash) Inc (dot) com
> > John (at) Arrowwood Photography (dot) com
> > John (at) Hanlons Razor (dot) com
> > --http://www.irie-inc.com/http://arrowwood.blogspot.com/
>



-- 
John Arrowwood
John (at) Irie (dash) Inc (dot) com
John (at) Arrowwood Photography (dot) com
John (at) Hanlons Razor (dot) com
--
http://www.irie-inc.com/
http://arrowwood.blogspot.com/


Re: [jQuery] XML print all nodes ( html() )

2010-01-09 Thread John Arrowwood
console.log( $('').append( $(itemsXML).clone() ).html() )

See if that works.

On Sat, Jan 9, 2010 at 7:27 PM, Shane  wrote:

> Is there a way to print out the structure of a jQuery xml element...
> heres some code
>
> $(xml).find("item").each(function(){
>if(myid == $(this).find("id").text()){
>  itemsXML = $(this).html() <-- trying to do something
> like this
> }
> }
>
> i would like itemsXML to contain the entire stucture of the xml rather
> than the jquery object.  thanks
>



-- 
John Arrowwood
John (at) Irie (dash) Inc (dot) com
John (at) Arrowwood Photography (dot) com
John (at) Hanlons Razor (dot) com
--
http://www.irie-inc.com/
http://arrowwood.blogspot.com/


Re: [jQuery] Custom animations

2010-01-09 Thread John Arrowwood
Try animating the position at the same time.  Or, position the element based
on the corner that you want to remain fixed.  Exactly how to do it depends
on what other restrictions you have on what you are trying to do.  Put
together a sample page.

On Sat, Jan 9, 2010 at 11:22 AM, Wroathe  wrote:

> Hi there! I was curious if there is a way to set up custom animations
> so that a div will expand from a specified corner to another specified
> corner?
>
> (Ex. If I have a div with a background color of #000 that is 200px by
> 200px and when I hover over it it expands to 500px by 500px from top
> left to bottom right, by default. I want it to expand from top right
> to bottom left or bottom right to top left, etc.)
>
> This is how I have it set up (but it only goes from top left to bottom
> right)
>
> $('div.item').hover(function() {
>$(this).animate(
>height: 500px,
>width: 500px
>);
> });
>



-- 
John Arrowwood
John (at) Irie (dash) Inc (dot) com
John (at) Arrowwood Photography (dot) com
John (at) Hanlons Razor (dot) com
--
http://www.irie-inc.com/
http://arrowwood.blogspot.com/


[jQuery] Re: Anybody ever come up with a good way of doing dynamic CSS?

2010-01-08 Thread John Arrowwood
Sorry, I hit tab/space which auto-sent.  Let's try to finish this...

Basic idea is a template:

.card .ct-$(type.id()) {
  width: x;  /* etc. */
  color: $(type.color());
}

In truth, it is a little more complicated, because I have to make lots of
rules for all different classes, but the key element is that they have
different colors (at least), and I want to be able to define them based on
configuration that I loaded via AJAX, which defines the types.

Now, I need to take the existing CSS file, loop through all possible values
of object 'type' and then generate new CSS and make it be included in the
document.

I've seen the 'rules' plugin.  I suppose I could fetch my 'template' css
file, do find/replace on it to substitute the appropriate values (once per
type), and then use the Rules plugin to add the rules to the current
document.

But I wonder:  Is there a more elegant (client-side) solution?  Has anyone
else ever done client-side CSS rule generation based on data returned from
the database?  I'm just looking for people's ideas of 'best practices' since
I know that CSS doesn't yet support macros (right?).


On Fri, Jan 8, 2010 at 11:20 PM, John Arrowwood  wrote:}

 --
John Arrowwood
John (at) Irie (dash) Inc (dot) com
John (at) Arrowwood Photography (dot) com
John (at) Hanlons Razor (dot) com
--
http://www.irie-inc.com/
http://arrowwood.blogspot.com/


[jQuery] Anybody ever come up with a good way of doing dynamic CSS?

2010-01-08 Thread John Arrowwood
Basic idea is a template:

.card .ct-$(type) {
  width: x


-- 
John Arrowwood
John (at) Irie (dash) Inc (dot) com
John (at) Arrowwood Photography (dot) com
John (at) Hanlons Razor (dot) com
--
http://www.irie-inc.com/
http://arrowwood.blogspot.com/


Re: [jQuery] ajax form plugin submit button

2010-01-06 Thread John Arrowwood
All of your forms must have an event handler associated with their onSubmit
event.  These event handlers need to do their AJAX stuff, and then stop the
browser from doing the default action by returning false.  Since you are
creating these forms AFTER the page has already loaded, you need to either
create this event handler as part of creating the form, or use $().live() in
order to capture the event for ALL forms, present or future.  However, I
don't know that .live will work for that, I haven't tried, you will have to
experiment.

On Wed, Jan 6, 2010 at 11:06 PM, Alex  wrote:

> Hello everyone,
>
> I have a problem submitting a form tag with submit buttons. many of
> the scripts used in that page require the name of these submit buttons
> to work correctly. I already read about the serialize function and
> submit buttons so tried the form plugin as suggested on the jQuery
> page but i can't get this to work.
>
> On a single site there is no problem using the plugin but the site is
> only loaded at the beginning, after that everything works with ajax
> requests and the page is never reloaded. The response of nearly all
> ajax requests is a new page which is loaded into a draggable div so
> that the site works like an OS. My problem is that the form tags that
> are contained in these responses aren't submitted by the plugin, they
> have their normal function and reload the webpage which is
> catastrophical for that layout.
>
> If you need more information please let me know.
> Sorry for my english ;-)
>



-- 
John Arrowwood
John (at) Irie (dash) Inc (dot) com
John (at) Arrowwood Photography (dot) com
John (at) Hanlons Razor (dot) com
--
http://www.irie-inc.com/
http://arrowwood.blogspot.com/


Re: [jQuery] Help with change event

2010-01-06 Thread John Arrowwood
The last .change() fires the event.

On Wed, Jan 6, 2010 at 6:43 AM, NotionCommotion wrote:

>
>
> I am interested in the event change, and am looking at
> http://docs.jquery.com/Events/change.
>
>  $("select").change(function () {
>  var str = "";
>  $("select option:selected").each(function () {
>str += $(this).text() + " ";
>  });
>  $("div").text(str);
>})
>.change();
>
> It all makes sense except for the very last change().  Can anyone
> explain the purpose of this line?
>
> Thank you
>



-- 
John Arrowwood
John (at) Irie (dash) Inc (dot) com
John (at) Arrowwood Photography (dot) com
John (at) Hanlons Razor (dot) com
--
http://www.irie-inc.com/
http://arrowwood.blogspot.com/


Re: [jQuery] Re: ajax image

2010-01-06 Thread John Arrowwood
So, why can't you just create a new  node with a src attribute?  It
will automatically download the image in the background, much like with
AJAX.  Is the problem that you want to ensure that the image is fully
downloaded before you try to display it?  Have you tried
$(imgTag).ready(...)?  (Don't know if that works or not, never tried it)

On Wed, Jan 6, 2010 at 8:14 AM, Mean Mike  wrote:

>
>  > So you are trying to use jQuery's ".load()" functionality with an
>  > actual image (i assume that your php sets the content type to
> image/
>  > jpeg, image/gif, etc and writes out the actual binary image
> data) ?
>
> YES ! that is correct.
>
>  > that's not going to work, as the ".load()" loads the result of the
>  > Ajax call into the innerHtml of DOM object
>
> I'm assuming thats why I get Array
>
>  > I don't know though, you're talking "same function" but have
> posted
>  > about three different functions so far, $.ajax, .load, and your
> custom
>  > function
> mmm sorry for the confusion
>
> I wanted to see if i could just get it to work with load that's why I
> mentioned it ..
>
>  > but bottom line is, the $.ajax call which ultimately
>  > gets called wouldn't be a replacement for ,
>
> bummer 8 ^ (
>
>  > *unless* you wanted to use data url vales as image sources
> (like:http://www.websiteoptimization.com/speed/tweak/inline-images/),
> but
>  > the problem with that, like almost all cool ideas like that link
>  > shows, is it doesn't work with IE
>
> neat concept but not doable trying to stick with ajax
>
> Thanks for your help
> Mean Mike
>



-- 
John Arrowwood
John (at) Irie (dash) Inc (dot) com
John (at) Arrowwood Photography (dot) com
John (at) Hanlons Razor (dot) com
--
http://www.irie-inc.com/
http://arrowwood.blogspot.com/


Re: [jQuery] Re: simple jquery question

2010-01-05 Thread John Arrowwood
But if this code will get executed more than once (e.g. in response to user
actions), make sure you prefix it with code to remove all of the existing
options in the dropdown, otherwise it will be additive.

On Mon, Jan 4, 2010 at 5:23 AM, Karl Swedberg  wrote:

> this solution could be simplified a bit:
>
> $('h3.example').each(function() {
>   $('#deptFilter').append( ' + $(this).html() + '' );
> });
>
>
>
> --Karl
>
> 
> Karl Swedberg
> www.englishrules.com
> www.learningjquery.com
>
>
>
>
> On Jan 3, 2010, at 6:53 AM, Paul Hutson wrote:
>
> This will do what you want, first I assigned the elements via a
> filter :
>
> elements = $('h3').filter('.example');
>
> Then I scrolled around the items found and output them to a span for
> debugging.
>
> elements.each(function() {
> $('#Output').html($('#Output').html() + "" + $(this).html());
> });
>
> Here's the entire test code :
>
> 
> 
>  http://ajax.googleapis.com/ajax/</a>
> libs/jquery/1.3/jquery.min.js">
>  
>  $(document).ready(function(){
>   elements = $('h3').filter('.example');
>   elements.each(function() {
>$('#Output').html($('#Output').html() + "<br>" + $(this).html
> ());
>   });
>
>  });
>  
> 
> 
>  
>   LALALA
>  
>  
>  NOT example :)
>  
>  
>  Blub
>  
>
>  
>  
>  
> 
> 
>
> On Jan 2, 8:25 pm, jason  wrote:
>
> Hey,
>
>
> was wondering if anyone could help me with a basic JQ question. Ok so
>
> I am trying to select each element that has a certain class on my
>
> page, and then use what is inside of the  I am
>
> selecting to populate a drop down select box with the id of
>
> deptFilter. (with each result found inside of the H3, wrapped in
>
>  tags.) I am having trouble understanding how I actually store
>
> the variables found in each H3 with the class of "example".
>
>
> Any help would be greatly appreciated.
>
>
>


-- 
John Arrowwood
John (at) Irie (dash) Inc (dot) com
John (at) Arrowwood Photography (dot) com
John (at) Hanlons Razor (dot) com
--
http://www.irie-inc.com/
http://arrowwood.blogspot.com/


Re: [jQuery] vertical coverflow

2010-01-05 Thread John Arrowwood
Any idea how you intend to do the perspective shifts in pure JavaScript?
Because I do not know if it can even be done.  Maybe in a Canvas element,
but I don't know much about that.

On Mon, Jan 4, 2010 at 2:45 AM, John R  wrote:

> Hi ,
> I would like to create vertical coverflow using jquery like this link
>
> http://dougmccune.com/blog/2007/11/19/flex-coverflow-performance-improvement-flex-carousel-component-and-vertical-coverflow/
> Please help me as soon as possible.
> Regards,
> John
>



-- 
John Arrowwood
John (at) Irie (dash) Inc (dot) com
John (at) Arrowwood Photography (dot) com
John (at) Hanlons Razor (dot) com
--
http://www.irie-inc.com/
http://arrowwood.blogspot.com/


Re: [jQuery] Help needed to find image dimensions

2010-01-05 Thread John Arrowwood
It would be wonderful if I am wrong, but I don't think you can get the image
dimensions via JavaScript.  But you don't need to...


a.preview {
  max-width: 200px;
  max-height: 200px;
}


This will force the image to fit within a 200px by 200px window without
altering the image aspect ratio.

On Mon, Jan 4, 2010 at 6:51 AM, banacan  wrote:

> I'm using Preview.js to create image previews on hover.  The script as
> it is now displays the full size image on hover, but that is often too
> big.  I have been able to reduce the preview size by defining
> width='200px' which works fine in many cases, but when the image is
> tall and narrow a 200px wide image my be 700px tall.  So what I'm
> trying to do is determine the image dimensions and if the width is
> greater than the height, set width='200px', otherwise set
> height='200px'.  I haven't been able to figure out how to get the
> image dimensions from the wrapped set.
>
> Here is an excerpt of my markup:
>
> >  title="">
>
> Here is an excerpt of my js code:
>
> > $("a.preview").hover(function(e){
> > this.t = this.title;
> > this.title = "";
> > var orientation = ((this.img[src]).width() >
> (this.img[src]).height()) ? "' alt='Image preview' width ='200px' />" : "'
> alt='Image preview' height='200px' />");
> > var c = (this.t != "") ? "" + this.t : "";
> > $("body").append("
> TIA
>



-- 
John Arrowwood
John (at) Irie (dash) Inc (dot) com
John (at) Arrowwood Photography (dot) com
John (at) Hanlons Razor (dot) com
--
http://www.irie-inc.com/
http://arrowwood.blogspot.com/


[jQuery] Re: Draggable/Droppable - revert:'invalid' working on Firefox, not on Safari

2009-12-28 Thread John Arrowwood
I made a simplified page to demonstrate this behavior. Unfortunately, that
page doesn't exhibit the behavior.  *sigh*.  I'll keep investigating.  In
the mean time, if anyone has ever seen this kind of behavior and knows why
it happened to them, their feedback would be appreciated.

On Sun, Dec 27, 2009 at 11:10 PM, John Arrowwood  wrote:

> I am creating objects on the page which are meant to be dragged and
> dropped.  Here is how I am enabling it:
>
> $(this.element).draggable({
> start:P.startDragging,
> stop:P.stopDragging,
> revert:'valid',
> containment:CONTAINER,
> snap:SELECTOR,
> scroll:true,
> stack:{ group: SELECTOR, min: 1 },
> helper:'original',
> opacity:0.7,
> });
>
> $(this.element).droppable({
> accept:'.card',
> activeClass:false,
> addClasses:false,
> hoverClass:'dropHere',
> tolerance:'pointer',
> over:P.draggingCardOver,
> out:P.draggingCardOut,
> drop:P.droppedCardOn,
> });
>
> On Firefox, it behaves as expected.  Namely, if I click on a 'card' I can
> drag it around to reposition it.  If I drag a card over another card, the
> events for over/out are firing.  When I drop the card somewhere that is not
> another card, the draggable::stop event is fired.  When I drop on to a card,
> the droppable::drop event is fired, instead.
>
> On Safari, all the events APPEAR to be fired normally.  However, once I
> drop the card on another card, the card I was dragging remains slightly
> transparent, and is no longer draggable.  It is as though some kind of error
> condition happened during the animation of moving the card back to its
> original position, and so the animation never completed, and the element is
> left in a broken state.
>
> Has anyone else ever seen this?  Any ideas what to look at in trying to
> debug this?
>
>
> --
> John Arrowwood
> John (at) Irie (dash) Inc (dot) com
> John (at) Arrowwood Photography (dot) com
> John (at) Hanlons Razor (dot) com
> --
> http://www.irie-inc.com/
> http://arrowwood.blogspot.com/
>



-- 
John Arrowwood
John (at) Irie (dash) Inc (dot) com
John (at) Arrowwood Photography (dot) com
John (at) Hanlons Razor (dot) com
--
http://www.irie-inc.com/
http://arrowwood.blogspot.com/


[jQuery] Draggable/Droppable - revert:'invalid' working on Firefox, not on Safari

2009-12-27 Thread John Arrowwood
I am creating objects on the page which are meant to be dragged and
dropped.  Here is how I am enabling it:

$(this.element).draggable({
start:P.startDragging,
stop:P.stopDragging,
revert:'valid',
containment:CONTAINER,
snap:SELECTOR,
scroll:true,
stack:{ group: SELECTOR, min: 1 },
helper:'original',
opacity:0.7,
});

$(this.element).droppable({
accept:'.card',
activeClass:false,
addClasses:false,
hoverClass:'dropHere',
tolerance:'pointer',
over:P.draggingCardOver,
out:P.draggingCardOut,
drop:P.droppedCardOn,
});

On Firefox, it behaves as expected.  Namely, if I click on a 'card' I can
drag it around to reposition it.  If I drag a card over another card, the
events for over/out are firing.  When I drop the card somewhere that is not
another card, the draggable::stop event is fired.  When I drop on to a card,
the droppable::drop event is fired, instead.

On Safari, all the events APPEAR to be fired normally.  However, once I drop
the card on another card, the card I was dragging remains slightly
transparent, and is no longer draggable.  It is as though some kind of error
condition happened during the animation of moving the card back to its
original position, and so the animation never completed, and the element is
left in a broken state.

Has anyone else ever seen this?  Any ideas what to look at in trying to
debug this?


-- 
John Arrowwood
John (at) Irie (dash) Inc (dot) com
John (at) Arrowwood Photography (dot) com
John (at) Hanlons Razor (dot) com
--
http://www.irie-inc.com/
http://arrowwood.blogspot.com/


Re: [jQuery] Problem with jQuery and AJAX

2009-12-23 Thread John Arrowwood
I think the problem here is that you are destroying and then re-creating the
elements.  When you destroy the element, you lose all of the event handlers
that you had associated with them.

Try changing to:

jQuery('#login').live('click',function...

And see if that doesn't solve your problem.


On Wed, Dec 23, 2009 at 6:00 AM, Muaz  wrote:

> Hello I have this problem I am facing for past couple of days. I am
> using the following jQuery code
>
> jQuery(document).ready(function(){
>jQuery("#login").click(function(){
>jQuery("#logbox").slideToggle("slow");
>});
>jQuery("#loggedin").click(function(){
>jQuery("#logbox2").slideToggle("slow");
>});
> });
>
> notice that i am using jQuery instead of $ because I have included
> prototype.js in file
>
> login and loggedin are two div which are on same place. Both divs are
> recreated by AJAX but after they are recreated jQuery stops working
> untill i manually refresh the page i have seen all the solution
> already given but since i am a beginner in jQuery i am unable to
> understand and implement them..
>
> Kindly provide me with some guidlines on how to solve this problem
>
>
>


-- 
John Arrowwood
John (at) Irie (dash) Inc (dot) com
John (at) Arrowwood Photography (dot) com
John (at) Hanlons Razor (dot) com
--
http://www.irie-inc.com/
http://arrowwood.blogspot.com/


Re: [jQuery] Re: $(checkbox).css('background-color',value) does not work on FireFox?

2009-12-23 Thread John Arrowwood
I mean that in Safari and Firefox, the code produces:



Whether there is a visual modification or not, Safari at least tells me that
the background-color is what I set it to be.  Firefox tells me it is white.

I was simply wondering whether or not I should waste time trying to figure
out a work-around or not.  It sounds like this is just the way it is because
that is how Firefox works.  Yes?

2009/12/23 Šime Vidas 

>
> > So, on Safari, the code for the checkbox passes.  On Firefox, it does
> not.
> > Funny thing, the  element has a style for the background color,
> but
> > .css('background-color') is not returning the color I set.  It is
> returning
> > rgb(255,255,255).
>
>
> What do you mean by "in Safari the code passes" ?
> From my own testing, setting a background-color on checkboxes has
> visual effect only in IE and Opera... but not FF, Safari and Chrome.
>
> Also, what do you mean by "the input element has a style for the
> background color" ?
>



-- 
John Arrowwood
John (at) Irie (dash) Inc (dot) com
John (at) Arrowwood Photography (dot) com
John (at) Hanlons Razor (dot) com
--
http://www.irie-inc.com/
http://arrowwood.blogspot.com/


[jQuery] $(checkbox).css('background-color',value) does not work on FireFox?

2009-12-22 Thread John Arrowwood
All,

I am building a bunch of widgets, and creating standard tests for each
widget.  Part of the test involves setting the background color attribute to
a known value, and then making sure that the widget initialization code did
what it was asked to do.

So, on Safari, the code for the checkbox passes.  On Firefox, it does not.
Funny thing, the  element has a style for the background color, but
.css('background-color') is not returning the color I set.  It is returning
rgb(255,255,255).

Anybody else seen this?

-- 
John Arrowwood
John (at) Irie (dash) Inc (dot) com
John (at) Arrowwood Photography (dot) com
John (at) Hanlons Razor (dot) com
--
http://www.irie-inc.com/
http://arrowwood.blogspot.com/


Re: [jQuery] passing variables to JQuery

2009-12-22 Thread John Arrowwood
(function($){

var defaults = {
button: '#buttonId',
form:   '#formId',
target: '#targetId',
url:'/change/me',
page:   '/change/me/too',
};

clickToLoad = function( options ) {
var o = $.extend({},defaults,options);
$(o.button).live('click',function(){
$.ajax({
type:'post',
url: o.url,
data:$(o.form).serialize(),
cache:   false,
success: function(){$(o.target).load(o.page)},
error:   function(){alert('data');},
// is this really what you want?
});
return false;
});

})(jQuery);

Here's how you would use it:

clickToLoad({
button:  '#theButton',
form:'#theForm',
target:  '#theDiv',
url: '/path/to/data/handler',
page:'/page/to/load',
});

It's a little bit better than copy/paste/tweak.  Also, by standardizing your
pages so they always use the same button ID or form ID or target ID, you
could put that standard ID in the defaults section.  Then, on a page where
it uses the defaults, you can leave those parameters out of the call.

This, of course, pollutes the global namespace.  You probably should define
a namespace and put it there.  But that is your choice.

Also, re-think your use of .live().  Are you adding and removing buttons
that match that criteria during the life of the page?  If not, you don't
need to use .live().  You can, obviously, but should you?

On Tue, Dec 22, 2009 at 10:55 AM, Scott Stewart
wrote:

>  I’ve got a lot of hard coded values in JQuery functions like the one
> below
>
>
>
> $("#getTOByWeek").live("click", *function*(){
>
> $.ajax({
>
> type:"post",
>
> url:"webapps/hr/admin/actions/act_adminHR_Handler.cfm",
>
> data:$("#toByWeek").serialize(),
>
> cache:"false",
>
> success: *function*(){
>
> $("#content-box").load(
> "webapps/hr/admin/display/dsp_TOList.cfm");
>
> },
>
> error: *function*(){
>
> alert("data");
>
> }
>
>   });
>
>*return* *false*;
>
>   });
>
>
>
> I use this chunk of code repeatedly, changing the button name, form name,
> url loading div name, and the page that’s loaded
>
> (#getTOByWeek, /hr/admin/actions/act_adminHR_Handler.cfm, #toByWeek,
> #content-box, /hr/admin/display/dsp_TOList.cfm respectively in this case)
>
>
>
> What I’d like to be able to do is have one code chunk that I throw
> variables at, instead of cutting/pasting and changing the hard coded values
> it would be much more elegant and make troubleshooting a lot easier. Not to
> mention making my .js file a helluva lot smaller.
>
>
>
> Any thoughts on how to do this?
>
>
>
> Thanks
>
>
>
> sas
>
>
>
> --
>
> Scott Stewart
>
> IT Consultant/ColdFusion Developer
>
> 4405 Oakshyre Way
>
> Raleigh, NC 27616
>
> (919) 874-6229
>
>
>



-- 
John Arrowwood
John (at) Irie (dash) Inc (dot) com
John (at) Arrowwood Photography (dot) com
John (at) Hanlons Razor (dot) com
--
http://www.irie-inc.com/
http://arrowwood.blogspot.com/


Re: [jQuery] Re: Does jquery have problems with webkit browsers?

2009-12-22 Thread John Arrowwood
I'm pretty sure it has nothing to do with jQuery.  I use $.ajax flawlessly
on Safari.  However, I did note that some browsers are more forgiving than
others with respect to the data and the data type matching.  Make sure you
are telling your ajax call what kind of data it should expect back from the
server, and that may solve your problem.

On Tue, Dec 22, 2009 at 9:51 AM, pw  wrote:

> On Dec 22, 10:34 am, "T.J. Simmons"  wrote:
> > I'd provide more detail; $.ajax should work in every browser. There's
> > more than likely an issue with the script or the response. An example
> > of what you're doing would work wonders for helping us figure it out.
> >
> > - T.J.
> > > On 12/22/09, pw  wrote:
> >
> > > > I have a script which relies on $.ajax to retrieve data from my
> > > > server.  It works flawlessly in Firefox (Gecko), but is broken in
> > > > Chrome and Arora (two webkit-based browsers).  Are there known
> issues,
> > > > or do I need to provide more detail?
>
> OK, here's some more detail.  The actual application is password
> protected, because it contains student data.  I have a student
> 'facebook' in which each student in a class becomes a 'property' of
> the class roll, which is globally defined, in a variable called 's',
> so "var s = {};"  Then a function populates this object with the
> students and some properties, e.g. s['jsmith'].absent = new Array();
> in which will be recorded student absences.  The user then checks a
> box by the student picture, and selects 'Mark Absent' from a menu.
> The date is pushed onto the s['jsmith'].absent array.  This works in
> Firefox, but in Chrome I get "TypeError: cannot read property 'jsmith'
> of undefined".  I'm saving the data to my server as a data string,
> with $.ajax
> ({async:"false",cache:"false",url:"",contentType:"text/
> plain",processData:false,data:dataString,type:"POST"}); and retrieving
> it with $.ajax
> ({dataType:"text",cache:"false",url:"",success:function
> (data,status){  eval(data); });
>
> It's entirely possible that what I'm seeing has nothing to do with
> jquery but is rather due to the webkit javascript implementation, so
> apologies if that's so.  But if anyone could point me in the right
> direction, I'd appreciate it.
>
> pw
>



-- 
John Arrowwood
John (at) Irie (dash) Inc (dot) com
John (at) Arrowwood Photography (dot) com
John (at) Hanlons Razor (dot) com
--
http://www.irie-inc.com/
http://arrowwood.blogspot.com/


Re: [jQuery] Re: jquery.color.js no longer maintained?

2009-12-18 Thread John Arrowwood
Yep, that's the one!

On Thu, Dec 17, 2009 at 8:43 PM, Dave Methvin wrote:

> To be sure, you're talking about this plugin?
>
> http://plugins.jquery.com/project/color
>
> The plugins site is due to get a redesign for the jQuery 1.4 in
> January and I think that will help some of the plugins that have been
> neglected. Maybe we can get some people to adopt the plugins that seem
> to be popular but orphaned.
>
>


-- 
John Arrowwood
John (at) Irie (dash) Inc (dot) com
John (at) Arrowwood Photography (dot) com
John (at) Hanlons Razor (dot) com
--
http://arrowwood.blogspot.com
Joan Crawford<http://www.brainyquote.com/quotes/authors/j/joan_crawford.html>
- "I, Joan Crawford, I believe in the dollar. Everything I earn, I
spend."


[jQuery] jquery.color.js no longer maintained?

2009-12-17 Thread John Arrowwood
All,

I got bit by a number of bugs in the Color Animations plugin.  So, I fixed
them and uploaded the fix to the comments on the issue I submitted against
it.

Then I noticed, other people have submitted patches as far back as almost 2
years ago.  So it looks like this module is no longer being actively
maintained.

If that is the case, how do we go about getting a new release out there?

More importantly, when will this functionality be added to the core?  :)

-- 
John Arrowwood
John (at) Irie (dash) Inc (dot) com
John (at) Arrowwood Photography (dot) com
John (at) Hanlons Razor (dot) com
--
http://arrowwood.blogspot.com
Pablo Picasso<http://www.brainyquote.com/quotes/authors/p/pablo_picasso.html>
- "Computers are useless. They can only give you answers."


Re: [jQuery] Variable and additional selectors

2009-12-11 Thread John Arrowwood
var entry = $('#userlist > li").clone();
$('stuff',entry)...  | $(entry).find('stuff')...
$(entry).appendTo('#userlist')

On Fri, Dec 11, 2009 at 1:46 PM, Adomatic  wrote:

> I'm just starting to play with jQuery and, like everyone before me,
> I'm amazed by it's power.
>
> In short, my question is about cloning an object, manipulating it in
> multiple steps and and then appending it to a list.
>
> I have an li on my page containing several divs (a user avatar and a
> couple lines of text).  I wanted to clone that item (rather than
> building a whole lot of HTML in strings), change the avatar URL and
> some of the text then append the new object to a list.
>
> I see that I can do this:
>  var entry = $("#userlist > li").clone();
>  $(entry).appendTo("#userlist");
>
> However, entry has several divs that I'd like to manipulate between
> cloning and appending.  Is there a way to use selectors to get those
> divs, manipulate them within "entry"?
>
> Entry is a jQuery so I thought I could do something like entry
> (".avatar")... or something but that's not right.
>
> Your guidance would be appreciated!
>



-- 
John Arrowwood
John (at) Irie (dash) Inc (dot) com
John (at) Arrowwood Photography (dot) com
John (at) Hanlons Razor (dot) com
--
http://arrowwood.blogspot.com
Pablo Picasso<http://www.brainyquote.com/quotes/authors/p/pablo_picasso.html>
- "Computers are useless. They can only give you answers."


Re: [jQuery] proper way

2009-12-11 Thread John Arrowwood
Just put the calls to the functions that do the work inside of .ready().
Put everything else outside of it.

As for anonymous functions, they are good for creating a context that avoids
polluting your name space.  When the function ends, everything defined
within disappears into oblivion unless there is some reference to it from
the outside.  So, you need to create variables or objects outside, if you
want to be able to keep them around.  Or, you need to bind the things that
are inside the closure to events on objects (such as the DOM) that are
outside.



On Fri, Dec 11, 2009 at 2:02 PM, Jojje  wrote:

> My question is about syntax, or how to wite jquery code.
> Is the example below ok? Putting all your code between document.ready
> all your code with anonymous functions?
>
> $(document).ready(function() {
>   $('a.link1').click(function() {
>  //code
>   });
>   $('a.link2').click(function() {
>  //code
>   });
>   $('form.form1').submit(function() {
>  //code
>   });
>   $('img.myPic1').css('border','solid 3px red');
> });
>
> or should i call named functions?
>
> $(document).ready(function() {
>   $('a.link1').click(clickFunction1());
>
>   $('a.link2').click(clickFunction2());
> });
>
> function clickFunction1() {
>   //code
> }
>
> function clickFunction2() {
>//code
> }
>
> I´ve heard that anonymous functions is a faster way??
>
> thanks in advance
>
> George
>



-- 
John Arrowwood
John (at) Irie (dash) Inc (dot) com
John (at) Arrowwood Photography (dot) com
John (at) Hanlons Razor (dot) com
--
http://arrowwood.blogspot.com
Mike Ditka <http://www.brainyquote.com/quotes/authors/m/mike_ditka.html>  -
"If God had wanted man to play soccer, he wouldn't have given us arms."