[Proto-Scripty] Re: Checking the DOM is ready to manupulated
document.observe(dom:loaded, function() {
.});- Original Message -
From: Denis Weerasiri
To: prototype-scriptaculous@googlegroups.com
Sent: Friday, June 19, 2009 6:46 AM
Subject: [Proto-Scripty] Checking the DOM is ready to manupulated
Hi all,
Is there a method in Prototype to check whether the DOM is ready to be
traversed and manipulated?
Cheers,
Denis
--~--~-~--~~~---~--~~
You received this message because you are subscribed to the Google Groups
Prototype script.aculo.us group.
To post to this group, send email to prototype-scriptaculous@googlegroups.com
To unsubscribe from this group, send email to
prototype-scriptaculous+unsubscr...@googlegroups.com
For more options, visit this group at
http://groups.google.com/group/prototype-scriptaculous?hl=en
-~--~~~~--~~--~--~---
[Proto-Scripty] Re: Event.observe and Ajax.Updater recursion problems?
Try http://pastie.org/517369
The code is untested but i cant forsee any problems...
Basically it creates an array called cached and everytime a click handler
is added its id is added to the cached array Every time #add_edit_cats
is clicked it checks the length of the array is greater than or equal to 1
and if so it loops through the array and calls prototye's stopObserving()
function on that element...
I clean up your code slightly as you said you were new to javascript /
prototype
the main difference is removed Event.observe .. $(elem).observe.. does
exatcly the same thing but its less code !!..
You will also notice var params=$(this).serialze(true); `this` is can
be used in the scope because its observed and `this` is contained in the
calling (it has a name but i cant remember what it is !!) so any time
you want to get the object or element when using observe you can use this
`this` keyword (a little bit like php classes)
I would also recommend assigning your Ajax.Updater stuff to variables so
they can be nulled when they are finished ... example: var req=new
Ajax.Updater({..}); req=null; - this unloads some of
it from client memory and makes for a faster application (tried and tested)
I cant see why there will be an infinite loop but there is no point
attaching more than one observer to a click if you dont need to (hence the
stopObserving() )...
Anyway
HTH
ALex
.
- Original Message -
From: ph...@ryangibbons.net
To: Prototype script.aculo.us prototype-scriptaculous@googlegroups.com
Sent: Friday, June 19, 2009 4:19 AM
Subject: [Proto-Scripty] Event.observe and Ajax.Updater recursion problems?
Hey all,
I will preface this with the fact that I am a new user of both
prototype and javascript, so I am learning (slowly) as I go. I am
currently working on a blog interface and I was going to use this as
my opportunity to learn prototype and some more dynamic ways to handle
form data.
That all being said I am running into problems on a Select
Categories form that toggles between being editable and used to
select the categories that apply to a blog post. The best way to
describe it is to show it to you: http://www.wiredphotographer.com/?s=new
once you get there click on the ADD / EDIT CATEGORIES link in the
bottom right. Please note this is a rough draft of the site so not
everything is functional and the code might not yet be as tidy as it
should be.
Anyways where I have problems are with event observers, I am finding
that I would almost have to have an indefinite loop of onComplete
followed by new observers.
Here is the javascript that I have been toying with:
http://pastie.org/517240
I know that it is not correct or good code and I know that the
approach I am trying is probably fundamentally flawed. So I am
looking for someone that might be able to set me in the right direct.
Thanks for all the help,
Ryan
--~--~-~--~~~---~--~~
You received this message because you are subscribed to the Google Groups
Prototype script.aculo.us group.
To post to this group, send email to prototype-scriptaculous@googlegroups.com
To unsubscribe from this group, send email to
prototype-scriptaculous+unsubscr...@googlegroups.com
For more options, visit this group at
http://groups.google.com/group/prototype-scriptaculous?hl=en
-~--~~~~--~~--~--~---
[Proto-Scripty] Re: Event.observe and Ajax.Updater recursion problems?
Try http://pastie.org/517369
The code is untested but i cant forsee any problems...
Basically it creates an array called cached and everytime a click handler
is added its id is added to the cached array Every time #add_edit_cats
is clicked it checks the length of the array is greater than or equal to 1
and if so it loops through the array and calls prototye's stopObserving()
function on that element...
I clean up your code slightly as you said you were new to javascript /
prototype
the main difference is removed Event.observe .. $(elem).observe.. does
exatcly the same thing but its less code !!..
You will also notice var params=$(this).serialze(true); `this` is can
be used in the scope because its observed and `this` is contained in the
calling (it has a name but i cant remember what it is !!) so any time
you want to get the object or element when using observe you can use this
`this` keyword (a little bit like php classes)
I would also recommend assigning your Ajax.Updater stuff to variables so
they can be nulled when they are finished ... example: var req=new
Ajax.Updater({..}); req=null; - this unloads some of
it from client memory and makes for a faster application (tried and tested)
I cant see why there will be an infinite loop but there is no point
attaching more than one observer to a click if you dont need to (hence the
stopObserving() )...
Anyway
HTH
ALex
.
- Original Message -
From: ph...@ryangibbons.net
To: Prototype script.aculo.us prototype-scriptaculous@googlegroups.com
Sent: Friday, June 19, 2009 4:19 AM
Subject: [Proto-Scripty] Event.observe and Ajax.Updater recursion problems?
Hey all,
I will preface this with the fact that I am a new user of both
prototype and javascript, so I am learning (slowly) as I go. I am
currently working on a blog interface and I was going to use this as
my opportunity to learn prototype and some more dynamic ways to handle
form data.
That all being said I am running into problems on a Select
Categories form that toggles between being editable and used to
select the categories that apply to a blog post. The best way to
describe it is to show it to you: http://www.wiredphotographer.com/?s=new
once you get there click on the ADD / EDIT CATEGORIES link in the
bottom right. Please note this is a rough draft of the site so not
everything is functional and the code might not yet be as tidy as it
should be.
Anyways where I have problems are with event observers, I am finding
that I would almost have to have an indefinite loop of onComplete
followed by new observers.
Here is the javascript that I have been toying with:
http://pastie.org/517240
I know that it is not correct or good code and I know that the
approach I am trying is probably fundamentally flawed. So I am
looking for someone that might be able to set me in the right direct.
Thanks for all the help,
Ryan
--~--~-~--~~~---~--~~
You received this message because you are subscribed to the Google Groups
Prototype script.aculo.us group.
To post to this group, send email to prototype-scriptaculous@googlegroups.com
To unsubscribe from this group, send email to
prototype-scriptaculous+unsubscr...@googlegroups.com
For more options, visit this group at
http://groups.google.com/group/prototype-scriptaculous?hl=en
-~--~~~~--~~--~--~---
[Proto-Scripty] Re: Event.observe and Ajax.Updater recursion problems?
Hi, http://www.wiredphotographer.com/?s=new once you get there click on the ADD / EDIT CATEGORIES link in the bottom right I'm not seeing that link. It could be because of an error, I'm seeing this where I'm guessing content would normally go: Unknown column 'b.userFirst' in 'field list' (It's very hard to see, it's in dark grey on black.) Anyways where I have problems are with event observers, I am finding that I would almost have to have an indefinite loop of onComplete followed by new observers. Here is the javascript that I have been toying with:http://pastie.org/517240 It's not really a loop, is it? It's just that when you're adding new elements, you're then hooking up the events on them, which is reasonable. When you add new elements that you need to observe events on, there are two fundamental approaches as far as I know: 1. Hook the events on the actual elements after you've added them. This is useful in scenarios where, for instance, you've added a button and you want to watch for it being clicked, or when you're hooking an event that doesn't bubble[1]. (You can either do this manually, or there are some plug-ins that let you give a CSS selector and will automagically hook events whenever elements are added matching that selector.) 2. Hook the event on an element that contains the elements you're adding, and handle the event when it bubbles up to the container. This is sometimes called event delegation and can be very, very powerful and compact. For example, say you have a table with 100 rows of 20 cells that you retrieve via an Ajax call, and you want to know when any of the cells is clicked. Now, you _could_ hook the 'click' event on all 2,000 cells, but there's a much easier way: Hook the click event on the tbody element (or the table element) containing the rows instead. You can still find out what element was actually clicked via Prototype's Event#findElement[2] method. [Arguably, a third approach is to have all of the elements already present in the page, just hidden (via display: none).] Here's a quick and dirty demo of using event delegation with dynamically-added content: http://pastie.org/517390 Click inside the cells (they have blue borders) and it shows you which cell you clicked in; click within the table but outside of any cell (between cells, or on a header) and it tells you you did that. For the table observation, only one handler is required, and yet it's very easy to differentiate what was clicked within the table. (Note I observed the table element in this example; usually when doing this I'd observe the tbody element, but I wanted to make it easy to click within the observed element but outside of a cell.) A parting note: When you're removing an element and you've hooked an observer on that element, be sure to call Element#stopObserving[3] first to release the handler and the memory it's consuming. [1] http://www.w3.org/TR/DOM-Level-2-Events/events.html#Events-flow-bubbling [2] http://prototypejs.org/api/event/findElement [3] http://prototypejs.org/api/element/stopObserving HTH, -- T.J. Crowder tj / crowder software / com Independent Software Engineer, consulting services available On Jun 19, 4:19 am, ph...@ryangibbons.net ph...@ryangibbons.net wrote: Hey all, I will preface this with the fact that I am a new user of both prototype and javascript, so I am learning (slowly) as I go. I am currently working on a blog interface and I was going to use this as my opportunity to learn prototype and some more dynamic ways to handle form data. That all being said I am running into problems on a Select Categories form that toggles between being editable and used to select the categories that apply to a blog post. The best way to describe it is to show it to you:http://www.wiredphotographer.com/?s=new once you get there click on the ADD / EDIT CATEGORIES link in the bottom right. Please note this is a rough draft of the site so not everything is functional and the code might not yet be as tidy as it should be. Anyways where I have problems are with event observers, I am finding that I would almost have to have an indefinite loop of onComplete followed by new observers. Here is the javascript that I have been toying with:http://pastie.org/517240 I know that it is not correct or good code and I know that the approach I am trying is probably fundamentally flawed. So I am looking for someone that might be able to set me in the right direct. Thanks for all the help, Ryan --~--~-~--~~~---~--~~ You received this message because you are subscribed to the Google Groups Prototype script.aculo.us group. To post to this group, send email to prototype-scriptaculous@googlegroups.com To unsubscribe from this group, send email to prototype-scriptaculous+unsubscr...@googlegroups.com For more options, visit this group at http://groups.google.com/group/prototype-scriptaculous?hl=en
[Proto-Scripty] Re: Event.observe and Ajax.Updater recursion problems?
My bad, I thought that I had checked all the links evidently I had not. http://www.wiredphotographer.com/admin/?s=new Sorry about that. Thanks for all the replies I am going through them now, but I wanted to fix that link first. --~--~-~--~~~---~--~~ You received this message because you are subscribed to the Google Groups Prototype script.aculo.us group. To post to this group, send email to prototype-scriptaculous@googlegroups.com To unsubscribe from this group, send email to prototype-scriptaculous+unsubscr...@googlegroups.com For more options, visit this group at http://groups.google.com/group/prototype-scriptaculous?hl=en -~--~~~~--~~--~--~---
[Proto-Scripty] Doing some operation for all response
Hi all, I am using Prototype 1.5. I want my JS to invoke some function everytime a successful response is received. I think I have to extend the Ajax.Request.prototype so that i can add on200 method to it. (From the Prototype code is saw it looks for 'on'+status code) Is this approach correct? Can you give me pointers on how to proceed with this? -- Ram --~--~-~--~~~---~--~~ You received this message because you are subscribed to the Google Groups Prototype script.aculo.us group. To post to this group, send email to prototype-scriptaculous@googlegroups.com To unsubscribe from this group, send email to prototype-scriptaculous+unsubscr...@googlegroups.com For more options, visit this group at http://groups.google.com/group/prototype-scriptaculous?hl=en -~--~~~~--~~--~--~---
[Proto-Scripty] Problem using prototype.js
Hi guys,
I have downloaded the newest prototype.js 1.6 version.
I am using AJAX:
I have used the prototype in my page lets say newpage1.asp and its
working fine.
but when i bind a new page shippingandbillinginfo.asp the prototype
does not work.
below code is inside my newpage1.asp
function FindOldCustomerInfo(custid){
var url = ShippingandBillingInfo.asp;
I was trying to capture the event focus on my second page
(ShippingandBillingInfo.asp) but its not working, it only worked on my
newpage1.asp
I was trying to have this code work
$('ZipPostal')
.observe('focus', respondToFocus2)
.observe('change', respondToChange2);
function respondToChange2(event) {
var element = Event.element(event);
alert(element.value);
}
function respondToFocus2(event) {
var element = Event.element(event);
var options = {
script: function (input_zip) { return ('http://cebsql05/
addressvalidation/default.aspx?city='+$('City')+'state='+$
('StateProvince')+'zip='+ input_zip); },
callback: function (obj) {
t = obj.value.split(',');
document.getElementById('City').value = t
[0];
document.getElementById('ZipPostal').value = obj.info;
setSelectedState2(t[1].replace('
',''));
document.getElementById('Country').focus()
}
};
document.getElementById('SubmitOrder').disabled = false;
var xml=new AutoComplete('ZipPostal',options);return true;
}
but it wont work on the page ShippingandBillinginfo.asp
please advice on what I should do.
Thanks.
--~--~-~--~~~---~--~~
You received this message because you are subscribed to the Google Groups
Prototype script.aculo.us group.
To post to this group, send email to prototype-scriptaculous@googlegroups.com
To unsubscribe from this group, send email to
prototype-scriptaculous+unsubscr...@googlegroups.com
For more options, visit this group at
http://groups.google.com/group/prototype-scriptaculous?hl=en
-~--~~~~--~~--~--~---
[Proto-Scripty] Re: Doing some operation for all response
2009/6/19 T.J. Crowder t...@crowdersoftware.com: Hi Ram, I am using Prototype 1.5. First off, Prototype 1.5 is very out of date. You really want to start using 1.6.0.3 and, soon, 1.6.1 for continued browser compatibility. I think I have to extend the Ajax.Request.prototype so that i can add on200 method to it. (From the Prototype code is saw it looks for 'on'+status code) You don't have to extend any prototypes (at least not with 1.6+), just specify an onSuccess handler: http://prototypejs.org/api/ajax/options HTH, -- T.J. Crowder tj / crowder software / com Independent Software Engineer, consulting services available On Jun 19, 10:17 am, Ram Kumar Hariharan coolramku...@gmail.com wrote: Hi all, I am using Prototype 1.5. I want my JS to invoke some function everytime a successful response is received. I think I have to extend the Ajax.Request.prototype so that i can add on200 method to it. (From the Prototype code is saw it looks for 'on'+status code) Is this approach correct? Can you give me pointers on how to proceed with this? -- Ram You could also specify a default responder (http://prototypejs.org/api/ajax/responders). I use this to allow me to show a spinner/wait icon when requests are actually in progress. Add a little fadeIn/fadeOut the the spinner (with a small delay to exclude the really fast responses) and you get a nice little effect. Richard -- - Richard Quadling Zend Certified Engineer : http://zend.com/zce.php?c=ZEND002498r=213474731 Standing on the shoulders of some very clever giants! --~--~-~--~~~---~--~~ You received this message because you are subscribed to the Google Groups Prototype script.aculo.us group. To post to this group, send email to prototype-scriptaculous@googlegroups.com To unsubscribe from this group, send email to prototype-scriptaculous+unsubscr...@googlegroups.com For more options, visit this group at http://groups.google.com/group/prototype-scriptaculous?hl=en -~--~~~~--~~--~--~---
[Proto-Scripty] Re: Problem using prototype.js
Could you post an example page?
Upon initial inspection... without delving too deep, I notice this:
Your references to the form elements are just that - not form element
values.
$('StateProvince') should be $('StateProvince').value or $F('StateProvince')
$('City') should be $('City').value or $F('City')
And anywhere you've used vanilla JS document.getElementById('') would be
better read as: $
document.getElementById = $
script: function (input_zip) { return ('http://cebsql05/
addressvalidation/default.aspx?city='+$('City')+'state='+$http://cebsql05/addressvalidation/default.aspx?city=%27+$%28%27City%27%29+%27state=%27+$
('StateProvince')+'zip='+ input_zip); },
callback: function (obj) {
t = obj.value.split(',');
document.getElementById('City').value = t
[0];
document.getElementById('ZipPostal').value = obj.info;
setSelectedState2(t[1].replace('
',''));
document.getElementById('Country').focus()
On Fri, Jun 19, 2009 at 6:09 AM, vincejun vince...@gmail.com wrote:
Hi guys,
I have downloaded the newest prototype.js 1.6 version.
I am using AJAX:
I have used the prototype in my page lets say newpage1.asp and its
working fine.
but when i bind a new page shippingandbillinginfo.asp the prototype
does not work.
below code is inside my newpage1.asp
function FindOldCustomerInfo(custid){
var url = ShippingandBillingInfo.asp;
I was trying to capture the event focus on my second page
(ShippingandBillingInfo.asp) but its not working, it only worked on my
newpage1.asp
I was trying to have this code work
$('ZipPostal')
.observe('focus', respondToFocus2)
.observe('change', respondToChange2);
function respondToChange2(event) {
var element = Event.element(event);
alert(element.value);
}
function respondToFocus2(event) {
var element = Event.element(event);
var options = {
script: function (input_zip) { return ('http://cebsql05/
addressvalidation/default.aspx?city='+$('City')+'state='+$http://cebsql05/%0Aaddressvalidation/default.aspx?city=%27+$%28%27City%27%29+%27state=%27+$
('StateProvince')+'zip='+ input_zip); },
callback: function (obj) {
t = obj.value.split(',');
document.getElementById('City').value = t
[0];
document.getElementById('ZipPostal').value = obj.info;
setSelectedState2(t[1].replace('
',''));
document.getElementById('Country').focus()
}
};
document.getElementById('SubmitOrder').disabled = false;
var xml=new AutoComplete('ZipPostal',options);return true;
}
but it wont work on the page ShippingandBillinginfo.asp
please advice on what I should do.
Thanks.
--~--~-~--~~~---~--~~
You received this message because you are subscribed to the Google Groups
Prototype script.aculo.us group.
To post to this group, send email to prototype-scriptaculous@googlegroups.com
To unsubscribe from this group, send email to
prototype-scriptaculous+unsubscr...@googlegroups.com
For more options, visit this group at
http://groups.google.com/group/prototype-scriptaculous?hl=en
-~--~~~~--~~--~--~---
[Proto-Scripty] draggables...
I'm working through Andrew Dupont's great book, Practical Prototype and script.aculo.us. The draggables example in the sample code isn't working. Does anyone know if this is a known problem? The sortables example works, so I assume all the files are in the correct location. --~--~-~--~~~---~--~~ You received this message because you are subscribed to the Google Groups Prototype script.aculo.us group. To post to this group, send email to prototype-scriptaculous@googlegroups.com To unsubscribe from this group, send email to prototype-scriptaculous+unsubscr...@googlegroups.com For more options, visit this group at http://groups.google.com/group/prototype-scriptaculous?hl=en -~--~~~~--~~--~--~---
[Proto-Scripty] Re: draggables...
Can you post or paste the code into a pastebin (http://pastie.org) and we can examine why it doesnt work Thanks Alex - Original Message - From: Avram abas...@mitre.org To: Prototype script.aculo.us prototype-scriptaculous@googlegroups.com Sent: Friday, June 19, 2009 3:54 PM Subject: [Proto-Scripty] draggables... I'm working through Andrew Dupont's great book, Practical Prototype and script.aculo.us. The draggables example in the sample code isn't working. Does anyone know if this is a known problem? The sortables example works, so I assume all the files are in the correct location. --~--~-~--~~~---~--~~ You received this message because you are subscribed to the Google Groups Prototype script.aculo.us group. To post to this group, send email to prototype-scriptaculous@googlegroups.com To unsubscribe from this group, send email to prototype-scriptaculous+unsubscr...@googlegroups.com For more options, visit this group at http://groups.google.com/group/prototype-scriptaculous?hl=en -~--~~~~--~~--~--~---
[Proto-Scripty] Re: sessvars
Since no one else has replied, justly so as this is not a Prototype related question... I'm vaguely familiar with sessvars.js - what did you need help with? Rick On Fri, Jun 19, 2009 at 10:47 AM, cob brenda...@gmail.com wrote: Has anyone here used the sessvars lib, would like to ask a question if you have thx Boc --~--~-~--~~~---~--~~ You received this message because you are subscribed to the Google Groups Prototype script.aculo.us group. To post to this group, send email to prototype-scriptaculous@googlegroups.com To unsubscribe from this group, send email to prototype-scriptaculous+unsubscr...@googlegroups.com For more options, visit this group at http://groups.google.com/group/prototype-scriptaculous?hl=en -~--~~~~--~~--~--~---
