[jQuery] Re: yet another beginner's diary (pls review!)
Anyway, I'm not sure if you've familiar with the thread yesterday. Nay, I'm not, but thank you for bringing it up. My apologies Cherry if I confused you; not my intention. Yes, monologues do sometimes spark sudden understanding (those ah, ha! moments). By all means, write for yourself first, if you are your audience. =) - Daniel --- On Feb 4, 7:52 am, Rick Faircloth [EMAIL PROTECTED] wrote: Hi, Daniel... You're telling Cherry almost the opposite of what she (she?) was told by someone on the list yesterday. She was complaining that there wasn't enough info out there from her perspective to accomplish simple tasks. There's documentation and plug-in usage, but she said she was frustrated trying to do simple tasks. So, someone recommended that she write about jQuery based on what she already knew... don't worry about whether is completely accurate, thorough, or a best-practice... someone will come along and correct any problems. So that's what's she's done... written about what she knows as a beginner. It's probably very helpful to those who are trying to get started with jQuery and want to learn by doing simple tasks, rather than reading documentation. Better to learn by doing rather than studying theory. Anyway, I'm not sure if you've familiar with the thread yesterday. I just don't want Cherry to think she's being jerked around by people on the list telling her one thing one day and something else the next. It's frustrating enough trying to get started with jQuery enough, as it is. I know. I started only a couple of months ago with absolutely no Javascript experience, so for me, it was especially frustrating. (And in some ways, still is.) Not trying to bust your chops on this, but trying to make sure Cherry doesn't get too frustrated. Also... reading monologues can be *very* beneficial... Rick -Original Message- From: jquery-en@googlegroups.com [mailto:[EMAIL PROTECTED] On Behalf Of Rabbit Sent: Monday, February 04, 2008 6:56 AM To: jQuery (English) Subject: [jQuery] Re: yet another beginner's diary (pls review!) Reads like a confused monologue. Before you start writing, really think about what you want to convey. If someone reads your blog, will they come away with anything new or useful? I find it often helps to explicitly answer my own questions when I write. In other words, write to learn. If you don't know something, learn it, then write about it. Writing about it will reinforce your understanding of the subject and probably be in a format that other people will readily enjoy, precisely because you set out to answer a very specific question. If you find you don't have a specific question, chances are you need to think about what _your_ personal goals are with jQuery (or anything). Do you want to create an image gallery? Do you want to make more usable forms? Do you want to learn how to create a modal window from scratch? Maybe you want to learn better ways to organize your code (I gleaned this as being true from your blog). Most often, the best teacher, and often enough, the only teacher, is personal experience. Fail enough times and eventually you'll have a foundation to write about and share with others. I wish you the best of luck with your blog, and hope you have a lot of fun with jQuery; I know I have! - Daniel --- On Feb 3, 8:54 pm, [EMAIL PROTECTED] [EMAIL PROTECTED] wrote: Seriously, I beg for your opinions/corrections/suggestions ... http://cherry.austin.googlepages.com/home Cherry
[jQuery] Re: yet another beginner's diary (pls review!)
Reads like a confused monologue. Before you start writing, really think about what you want to convey. If someone reads your blog, will they come away with anything new or useful? I find it often helps to explicitly answer my own questions when I write. In other words, write to learn. If you don't know something, learn it, then write about it. Writing about it will reinforce your understanding of the subject and probably be in a format that other people will readily enjoy, precisely because you set out to answer a very specific question. If you find you don't have a specific question, chances are you need to think about what _your_ personal goals are with jQuery (or anything). Do you want to create an image gallery? Do you want to make more usable forms? Do you want to learn how to create a modal window from scratch? Maybe you want to learn better ways to organize your code (I gleaned this as being true from your blog). Most often, the best teacher, and often enough, the only teacher, is personal experience. Fail enough times and eventually you'll have a foundation to write about and share with others. I wish you the best of luck with your blog, and hope you have a lot of fun with jQuery; I know I have! - Daniel --- On Feb 3, 8:54 pm, [EMAIL PROTECTED] [EMAIL PROTECTED] wrote: Seriously, I beg for your opinions/corrections/suggestions ... http://cherry.austin.googlepages.com/home Cherry
[jQuery] Re: Attaching events to dynamic DOM IDs
Wow. Talking about mind-blowing. I read through the dummy article and
I will definitely be reading it again tomorrow. And probably the next
day, too.
Thank you so much for taking the time to explain and share; I
appreciate it!
- Daniel
---
On Dec 22, 5:18 pm, Michael Geary [EMAIL PROTECTED] wrote:
In fact, it is a closure, and it works very much like closures in Ruby and
other languages.
Keep in mind that a JavaScript object is reference counted and remains in
existence as long as there are any references to the object. Once there are
no more references to an object, it becomes available for garbage
collection.
When you call a function, JavaScript creates a private object for that
particular call of the function. This object has properties for the
function's local variables and arguments. The object is not directly
accessible from JavaScript code, but it obeys the same garbage collection
rules as any other JavaScript object.
The function call object has one reference added when the function is
entered, and that reference is removed when the function exits. So, in the
typical case where there are no other references to the function call
object, it becomes available for garbage collection at that point.
However, if any other code holds onto a reference to the function call
object, then the object cannot be garbage collected until all of those
references are removed. Similarly, if you hold a reference to any of the
function's arguments or variables, that is also a reference to the function
call object. So as long as there are any references to the function call
object, all of that function's arguments and local variables are kept
around.
In the code I posted, the $(...).click(...) call creates a reference to the
inner anonymous function. That function in turn contains a reference to the
i variable in the outer function (the clicker function). So as long as
the click handler exists that reference to the outer function's function
call object will also exist. Therefore, all of the arguments and local
variables for that function call remain in existence.
Someone may be able to explain this better, but that's the general idea.
For more info, here are a couple of articles on JavaScript closures:
http://www.jibbering.com/faq/faq_notes/closures.html
http://blog.morrisjohns.com/javascript_closures_for_dummies
-Mike
From: Rabbit
Hmm... I didn't realize this until I was falling asleep last
night, but what you've demonstrated is similar to a closure
in Ruby, except not. My understanding of what you said is
something along the lines of...
An argument to a method becomes a local variable in that
method and is _retained_. But, how? I get the feeling that
when you pass an argument to a method the argument gets
stashed away for later, but how is it that the correct value
is recalled?
In other words, the code you presented works (I tested it),
and I understand that it does, but I don't understand how or why.
Can anyone shed some light on this?
- Daniel
---
On Dec 22, 12:55 am, Michael Geary [EMAIL PROTECTED] wrote:
As an alternative to the other solution you posted, here is how you
can do it with code more like the code below:
for(var i = 0; i 30; i++)
clicker( i );
function clicker( i ) {
jQuery('#day_' + i).click(function() {
console.log('i is ' + i);
jQuery('#day_' + i + '_modal').jqmShow();
});
}
As you can see, all I changed was to put your code inside a
function
and call that function 30 times.
Why did your original code show i is 30 for each element? Because
there is only a single variable i, and when you call console.log
it's using the current value of i - not the value that i had at
the time you added the click event.
By moving this code into a function, a new variable i is created
each time the function is called. You no longer have all the code
sharing a single variable - each instance of the function
gets its own.
-Mike
From: Rabbit
The following code:
for(var i = 0; i 30; i++) {
jQuery('#day_' + i).click(function() {
console.log('i is ' + i);
jQuery('#day_' + i + '_modal').jqmShow();
});
}
Runs, but always reports i is 30.
Now, I understand why it does that, but why doesn't the jqmShow
method work? It appears as though the code that gets
executed is
dynamic.
In other words, when the click event occurs JavaScript
looks up the
code as it was at the end of its execution, when variable
i is 30,
instead of remembering that at one point it was something else.
Did that make sense?
Any ideas how to get around this without typing in all 30 click
events?
[jQuery] Attaching events to dynamic DOM IDs
The following code:
for(var i = 0; i 30; i++) {
jQuery('#day_' + i).click(function() {
console.log('i is ' + i);
jQuery('#day_' + i + '_modal').jqmShow();
});
}
Runs, but always reports i is 30.
Now, I understand why it does that, but why doesn't the jqmShow method
work? It appears as though the code that gets executed is dynamic.
In other words, when the click event occurs JavaScript looks up the
code as it was at the end of its execution, when variable i is 30,
instead of remembering that at one point it was something else.
Did that make sense?
Any ideas how to get around this without typing in all 30 click events?
[jQuery] Re: Attaching events to dynamic DOM IDs
On Dec 22, 12:55 am, Michael Geary [EMAIL PROTECTED] wrote:
By moving this code into a function, a new variable i is created each time
the function is called. You no longer have all the code sharing a single
variable - each instance of the function gets its own.
Ah, brilliant. I see that distinction/technique used a lot in jQuery.
The fact that methods are first-class objects is incredibly powerful;
I have yet to fully utilize it. Thanks for the help, Michael. :)
---
On Dec 22, 12:55 am, Michael Geary [EMAIL PROTECTED] wrote:
As an alternative to the other solution you posted, here is how you can do
it with code more like the code below:
for(var i = 0; i 30; i++)
clicker( i );
function clicker( i ) {
jQuery('#day_' + i).click(function() {
console.log('i is ' + i);
jQuery('#day_' + i + '_modal').jqmShow();
});
}
As you can see, all I changed was to put your code inside a function and
call that function 30 times.
Why did your original code show i is 30 for each element? Because there is
only a single variable i, and when you call console.log it's using the
current value of i - not the value that i had at the time you added the
click event.
By moving this code into a function, a new variable i is created each time
the function is called. You no longer have all the code sharing a single
variable - each instance of the function gets its own.
-Mike
From: Rabbit
The following code:
for(var i = 0; i 30; i++) {
jQuery('#day_' + i).click(function() {
console.log('i is ' + i);
jQuery('#day_' + i + '_modal').jqmShow();
});
}
Runs, but always reports i is 30.
Now, I understand why it does that, but why doesn't the
jqmShow method work? It appears as though the code that gets
executed is dynamic.
In other words, when the click event occurs JavaScript looks
up the code as it was at the end of its execution, when
variable i is 30, instead of remembering that at one point
it was something else.
Did that make sense?
Any ideas how to get around this without typing in all 30
click events?
[jQuery] Re: Attaching events to dynamic DOM IDs
Hmm... I didn't realize this until I was falling asleep last night,
but what you've demonstrated is similar to a closure in Ruby, except
not. My understanding of what you said is something along the lines
of...
An argument to a method becomes a local variable in that method and is
_retained_. But, how? I get the feeling that when you pass an argument
to a method the argument gets stashed away for later, but how is it
that the correct value is recalled?
In other words, the code you presented works (I tested it), and I
understand that it does, but I don't understand how or why.
Can anyone shed some light on this?
- Daniel
---
On Dec 22, 12:55 am, Michael Geary [EMAIL PROTECTED] wrote:
As an alternative to the other solution you posted, here is how you can do
it with code more like the code below:
for(var i = 0; i 30; i++)
clicker( i );
function clicker( i ) {
jQuery('#day_' + i).click(function() {
console.log('i is ' + i);
jQuery('#day_' + i + '_modal').jqmShow();
});
}
As you can see, all I changed was to put your code inside a function and
call that function 30 times.
Why did your original code show i is 30 for each element? Because there is
only a single variable i, and when you call console.log it's using the
current value of i - not the value that i had at the time you added the
click event.
By moving this code into a function, a new variable i is created each time
the function is called. You no longer have all the code sharing a single
variable - each instance of the function gets its own.
-Mike
From: Rabbit
The following code:
for(var i = 0; i 30; i++) {
jQuery('#day_' + i).click(function() {
console.log('i is ' + i);
jQuery('#day_' + i + '_modal').jqmShow();
});
}
Runs, but always reports i is 30.
Now, I understand why it does that, but why doesn't the
jqmShow method work? It appears as though the code that gets
executed is dynamic.
In other words, when the click event occurs JavaScript looks
up the code as it was at the end of its execution, when
variable i is 30, instead of remembering that at one point
it was something else.
Did that make sense?
Any ideas how to get around this without typing in all 30
click events?
[jQuery] tablesorter options not working
Hi all. I've the following code:
jQuery('#bid_requests_for_part').tablesorter({
sortColumn: 'Vendor',
sortClassAsc: 'headerSortUp',
sortClassDesc: 'headerSortDown',
headerClass: 'header',
stripingRowClass: [ 'even', 'odd' ],
stripeRowsOnStartup: true
});
The sorting portion works, but none of the options are taking effect.
Except headerClass -- that is setting the class of the th elements.
Beyond that, nothing; no striping, no table header styles.
I've included the thead and tbody elements in my table, too.
Any ideas?
[jQuery] Re: Session management in an Ajax app
Rey Bango wrote: The gist is that if you have a dashboard-type app and you need to determine if your session has timed out on the next Ajax request, how would you go about doing it. He mentioned creating a ping-like service that would poll the server every so often. It seems that this would dramatically increase the number of HTTP requests. Disclaimer: My suggestion would probably work best for MVC-style frameworks like Rails. That said... I wouldn't poll the server on a timer. Instead I'd wrap the applicable controllers in a before_filter that check the age of the session. If the session is too old, intercept the request and render whatever is appropriate for your application. - Rabbit --- On Oct 8, 1:34 pm, Rey Bango [EMAIL PROTECTED] wrote: A buddy of mine, Raymond Camden, posted an interesting question on his blog: How can you timeout a session in an Ajax-based application? http://www.coldfusionjedi.com/index.cfm/2007/10/8/Ask-a-Jedi-How-can-... The gist is that if you have a dashboard-type app and you need to determine if your session has timed out on the next Ajax request, how would you go about doing it. He mentioned creating a ping-like service that would poll the server every so often. It seems that this would dramatically increase the number of HTTP requests. Since session management is available in many server-side languages, not just ColdFusion obviously, I think this is a good topic that's applicable to most any project. Is there a better way of doing it? Rey...
[jQuery] Re: I'm not a doctor, but I'm pretty sure this isn't right...
For objects that are loaded via ajax, that you want to bind clicks to, try the Live jQuery plugin. Wow! The jQuery community comes through once again, reaffirming my belief that I made the right choice moving away from Prototype and MooTools. Thanks, Glen, that's *exactly* what I was looking for. So much of my code is dependent on DOM elements not yet on the page. - Rabbit --- On Sep 22, 7:31 am, Glen Lipka [EMAIL PROTECTED] wrote: For objects that are loaded via ajax, that you want to bind clicks to, try the Live jQuery plugin.http://jquery.com/plugins/project/livequery This allows you to separate the click functions. Then it will look normal, when you call the load inside in them. Glen On 9/21/07, Rabbit [EMAIL PROTECTED] wrote: My code is starting to look like this... http://pastie.caboo.se/99522 And I'm pretty sure that's not how it could or should look. Does anyone have any pointers on how one could structure their code? Thanks, much! - Rabbit
[jQuery] Ajax load callback not firing
var ClientSearch = {
initialize: function() {
$('#start_search').click(this.search);
},
search: function() {
$('#search_results').load('/searches/create', { query: $
('#query').val() }, this.hyperlink_search_results);
},
hyperlink_search_results: function() {
console.log('This code is not being called...');
}
};
$(document).ready(function(){
ClientSearch.initialize();
});
The initialize method works. Search gets called and my search results
are returned. However, the callback method is never executed.
I have the exact same code, minus the hash, and it works fine.
Example:
$(document).ready(function() {
$('#start_search').click(function() {
$('#search_results').empty().show();
$('#search_results').load('/searches/create', { query: $
('#query').val() }, function() {
// Code here is run.
});
});
});
});
[jQuery] Re: Installation of UI?
Hi Christian, thanks for the reply. Here's the wiki page with the
tablesorter typo:
http://docs.jquery.com/Tutorials:Getting_Started_with_jQuery#Sort_me:_Using_the_tablesorter_plugin
On Sep 18, 3:56 am, Christian Bach [EMAIL PROTECTED]
wrote:
On what page in the wiki did you find tableSorter?
Could you point me to the page so i can change it.
/christian
2007/9/18, Rabbit [EMAIL PROTECTED]:
Ah, of course. It's tablesorter() -- lowercase 's'. The wiki needs to
be updated to reflect that, as it uses a capital 'S'.
On 9/17/07, Rabbit [EMAIL PROTECTED] wrote:
[ If this is a duplicate I apologize -- it's been about 15 minutes and
I don't see it on the list so I'm trying again. ]
Hi all. I'm attempting to move to jQuery from MooTools, as I
(generally) like the jQuery documentation better. However, I'm having
trouble using the tableSorter function.
I've downloaded jQuery 1.2.1 and UI 1.0. My JavaScript includes look
like...
script src=/javascripts/jquery-1.2.1.js?1190074502 type=text/
javascript/script
script src=/javascripts/ui.tablesorter.js?1190019796 type=text/
javascript/script
script src=/javascripts/rabbit.js?1190077112 type=text/
javascript/script
jQuery works, as I use $(document).ready... (inside rabbit.js) to
throw an alert. But calling $('#clients').tableSorter(); tells me no
such function.
Any ideas?
[jQuery] Installation of UI?
Hi all. I'm attempting to move to jQuery from MooTools, as I
(generally) like the jQuery documentation better. However, I'm having
trouble using the tableSorter function.
I've downloaded jQuery 1.2.1 and UI 1.0. My JavaScript includes look
like...
script src=/javascripts/jquery-1.2.1.js?1190074502 type=text/
javascript/script
script src=/javascripts/ui.tablesorter.js?1190019796 type=text/
javascript/script
script src=/javascripts/rabbit.js?1190077112 type=text/
javascript/script
jQuery works, as I use $(document).ready... (inside rabbit.js) to
throw an alert. But calling $('#clients').tableSorter(); tells me no
such function.
Any ideas?
[jQuery] Re: Installation of UI?
Ah, of course. It's tablesorter() -- lowercase 's'. The wiki needs to
be updated to reflect that, as it uses a capital 'S'.
On 9/17/07, Rabbit [EMAIL PROTECTED] wrote:
[ If this is a duplicate I apologize -- it's been about 15 minutes and
I don't see it on the list so I'm trying again. ]
Hi all. I'm attempting to move to jQuery from MooTools, as I
(generally) like the jQuery documentation better. However, I'm having
trouble using the tableSorter function.
I've downloaded jQuery 1.2.1 and UI 1.0. My JavaScript includes look
like...
script src=/javascripts/jquery-1.2.1.js?1190074502 type=text/
javascript/script
script src=/javascripts/ui.tablesorter.js?1190019796 type=text/
javascript/script
script src=/javascripts/rabbit.js?1190077112 type=text/
javascript/script
jQuery works, as I use $(document).ready... (inside rabbit.js) to
throw an alert. But calling $('#clients').tableSorter(); tells me no
such function.
Any ideas?
[jQuery] Installation of UI?
[ If this is a duplicate I apologize -- it's been about 15 minutes and
I don't see it on the list so I'm trying again. ]
Hi all. I'm attempting to move to jQuery from MooTools, as I
(generally) like the jQuery documentation better. However, I'm having
trouble using the tableSorter function.
I've downloaded jQuery 1.2.1 and UI 1.0. My JavaScript includes look
like...
script src=/javascripts/jquery-1.2.1.js?1190074502 type=text/
javascript/script
script src=/javascripts/ui.tablesorter.js?1190019796 type=text/
javascript/script
script src=/javascripts/rabbit.js?1190077112 type=text/
javascript/script
jQuery works, as I use $(document).ready... (inside rabbit.js) to
throw an alert. But calling $('#clients').tableSorter(); tells me no
such function.
Any ideas?
