[Proto-Scripty] Re: simple question on Prototype (methinks...)
Hi, The fragment you've quoted shouldn't be replacing the content of the link. It's getting the link element $(link) then going to its parent element .up() then inserting content *after* the parent element .insert({after: ...}) The link should remain intact, nothing should be replaced, just something new added immediately after the link's parent element. If you want to insert something inside the link element, do this: $(link).insert({ ... }); For instance, to add something at the end of the link (but inside it): $(link).insert({bottom: "stuff here"}); If you've inherited a Prototype-based project, it may be worth spending just an hour or so reading through the API docs (literally takes about that long, it's not massive undertaking): The new API docs: http://api.prototypejs.org The old API docs (which sadly still have some content that isn't in the new ones, but people are busily transferring content over): http://prototypejs.org/api HTH, -- T.J. Crowder Independent Software Consultant tj / crowder software / com www.crowdersoftware.com On Feb 27, 8:41 pm, Grary wrote: > Hi, > > I've inherited a project with some Prototype connections I do not > understand. > > To wit, I'd like to modify the following javascript function so that I > can append to the link element, not replace the content: > > function add_fields(link, association, content) { > var new_id = new Date().getTime(); > var regexp = new RegExp("new_" + association, "g") > $(link).up().insert({ > after: content.replace(regexp, new_id) > }); > > } > > Any suggestions? > > Thanks, > > Grar -- 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-scriptacul...@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: Simple question
Thanks everyone! Sorry Im getting back so late. I was visiting family over the Thanksgiving holiday. Anyhow, it seems as all these solutions work. Thank you so much! Im looking forward to diving into this framework and I appreciate having this group here for support. Cheers, justclint On Nov 28, 5:31 am, Henry <[EMAIL PROTECTED]> wrote: > On Nov 27, 10:50 pm, seasoup wrote: > > > > > On Nov 27, 7:14 am, RobG wrote: > >> On Nov 27, 11:32 pm, spradeepkumar wrote: > >> [...] > >>> If you are particular in using this...prototype has got > >>> bind methods with which you can control your scope > > >> The value of a function's this keyword has nothing to do > >> with scope, it is set by the call. > > $(selector).each(function(){ > > alert(this); > > > }.bind($(somethingElse)); > > > sets somethingElse as the 'this' inside of the each function, > > instead of the item in the array. That's what spradeepkumar > > was referring to by controlling scope. > > And it was referring to setting the - this - value as "controlling > scope" (or as having anything to do with scope at all) that was being > corrected. Scope is quite an important concept in javascript, indeed > being 'lexically scoped' is one of the defining characteristics of the > language. (With the exception of possible used of the - with - > statement) Scope is defined by the ((lexical) structure of the) source > code and not amenable to runtime modification (or control). The value > of the - this - keyword in a function is determined at runtime by how > the function is called, and can be 'controlled'. It may be > (unfortunately) common to speak of 'scope' when talking about the - > this - keyword but the two are really very different things that > should not be confused. --~--~-~--~~~---~--~~ 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 [EMAIL PROTECTED] For more options, visit this group at http://groups.google.com/group/prototype-scriptaculous?hl=en -~--~~~~--~~--~--~---
[Proto-Scripty] Re: Simple question
On Nov 27, 10:50 pm, seasoup wrote: > On Nov 27, 7:14 am, RobG wrote: >> On Nov 27, 11:32 pm, spradeepkumar wrote: >> [...] >>> If you are particular in using this...prototype has got >>> bind methods with which you can control your scope > >> The value of a function's this keyword has nothing to do >> with scope, it is set by the call. > $(selector).each(function(){ > alert(this); > > }.bind($(somethingElse)); > > sets somethingElse as the 'this' inside of the each function, > instead of the item in the array. That's what spradeepkumar > was referring to by controlling scope. And it was referring to setting the - this - value as "controlling scope" (or as having anything to do with scope at all) that was being corrected. Scope is quite an important concept in javascript, indeed being 'lexically scoped' is one of the defining characteristics of the language. (With the exception of possible used of the - with - statement) Scope is defined by the ((lexical) structure of the) source code and not amenable to runtime modification (or control). The value of the - this - keyword in a function is determined at runtime by how the function is called, and can be 'controlled'. It may be (unfortunately) common to speak of 'scope' when talking about the - this - keyword but the two are really very different things that should not be confused. --~--~-~--~~~---~--~~ 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 [EMAIL PROTECTED] For more options, visit this group at http://groups.google.com/group/prototype-scriptaculous?hl=en -~--~~~~--~~--~--~---
[Proto-Scripty] Re: Simple question
On Nov 27, 5:54 pm, seasoup <[EMAIL PROTECTED]> wrote: [...] > still binds another id to this inside of the each function. But for > eventlisteners you need to .bindAsEventListener() Not really. `bindAsEventListener` is only needed when currying arguments to event handler. [...] -- kangax --~--~-~--~~~---~--~~ 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 [EMAIL PROTECTED] For more options, visit this group at http://groups.google.com/group/prototype-scriptaculous?hl=en -~--~~~~--~~--~--~---
[Proto-Scripty] Re: Simple question
oops, I was in jQuery mode. $('id').each(function(eachThing) { }.bind($('anotherId')); still binds another id to this inside of the each function. But for eventlisteners you need to .bindAsEventListener() On Nov 27, 7:14 am, RobG <[EMAIL PROTECTED]> wrote: > On Nov 27, 11:32 pm, spradeepkumar <[EMAIL PROTECTED]> wrote: > [...] > > > If you are particular in using this...prototype has got > > bind methods with which you can control your scope > > The value of a function's this keyword has nothing to do with scope, > it is set by the call. > > -- > Rob --~--~-~--~~~---~--~~ 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 [EMAIL PROTECTED] For more options, visit this group at http://groups.google.com/group/prototype-scriptaculous?hl=en -~--~~~~--~~--~--~---
[Proto-Scripty] Re: Simple question
$(selector).each(function(){ alert(this); }.bind($(somethingElse)); sets somethingElse as the 'this' inside of the each function, instead of the item in the array. That's what spradeepkumar was referring to by controlling scope. On Nov 27, 7:14 am, RobG <[EMAIL PROTECTED]> wrote: > On Nov 27, 11:32 pm, spradeepkumar <[EMAIL PROTECTED]> wrote: > [...] > > > If you are particular in using this...prototype has got > > bind methods with which you can control your scope > > The value of a function's this keyword has nothing to do with scope, > it is set by the call. > > -- > Rob --~--~-~--~~~---~--~~ 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 [EMAIL PROTECTED] For more options, visit this group at http://groups.google.com/group/prototype-scriptaculous?hl=en -~--~~~~--~~--~--~---
[Proto-Scripty] Re: Simple question
On Nov 27, 11:32 pm, spradeepkumar <[EMAIL PROTECTED]> wrote: [...] > If you are particular in using this...prototype has got > bind methods with which you can control your scope The value of a function's this keyword has nothing to do with scope, it is set by the call. -- Rob --~--~-~--~~~---~--~~ 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 [EMAIL PROTECTED] For more options, visit this group at http://groups.google.com/group/prototype-scriptaculous?hl=en -~--~~~~--~~--~--~---
[Proto-Scripty] Re: Simple question
Hey JC, first let me clarify about this > refers to object. If you are particular in using this...then no need to worry about that because prototype has got bind methods with which you can control your scope Regards, pradeep. On Thu, 27 Nov 2008 Mona Remlawi <[EMAIL PROTECTED]> wrote > > Hi JC, > > Best way to do this is by using the Event.observe method > (http://prototypejs.org/api/event/observe) > to attach your fading method to designated divs. > > // assign a class name to the divs you want to have the fading behaviour > Click me to fade away > or click me to fade away > > // event.target to get the element that fired the click event > function myeffect(event) { > event.target.fade({ duration: 3.0, from: 1, to: 0 }); > } > > // on domload, find all elements with fadeable class name > // observe their click event and attach myeffect as its handler > document.observe('dom:loaded', function() { > $('.fadeable').invoke("observe", "click", myeffect); > }); > > That's how i would do it, complete separation between html and its behaviour. > > Or of course, you can also > Click me to fade away > > function myeffect(zdiv) { >zdiv.fade({ duration: 3.0, from: 0, to: 1 }); > } > > But I strongly advice the first approach. > > cheers > > -- > mona > [EMAIL PROTECTED] > > On Wed, Nov 26, 2008 at 10:56 PM, justclint <[EMAIL PROTECTED]> wrote: > > > > Im just getting into script.aculo.us by way of cakephp. As for > > javascript frameworks Ive only used jquery. > > > > This question is so basic I cant find anything on past posts here in > > the groups hence this post. > > > > Basically I just took a random effect and it worked as described in > > the github area by applying it to an element selected by id. > > > > Im trying to get the effect to work "not by id" but by "this". Heres > > my example but not working: > > > > script: > > > > > > // >function myeffect() { > >$(this).fade({ duration: 3.0, from: 0, to: 1 }); > >} > > // ]]> > > > > > > > > html > > > > > > Click me to fade away > > > > > > or click me to fade away > > > > > > > > I dont see any documentation on how to apply to "document.this" > > > > Im sure my syntax is wrong but everyway I switch it around it still > > wont work. > > > > What am I doing wrong? > > > > Thanks in advance! > > > > jc > > > > > > > > > --~--~-~--~~~---~--~~ 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 [EMAIL PROTECTED] For more options, visit this group at http://groups.google.com/group/prototype-scriptaculous?hl=en -~--~~~~--~~--~--~---
[Proto-Scripty] Re: Simple question
I think this is what you are trying to do: script: // html Click me to fade away or click me to fade away but this can be achieved by Click me to fade away or click me to fade away $$('fadeAway').observe('click', function(event) { var element = event.element(); $(element).fade({ duration: 3.0, from: 0, to: 1 }); }); actually, I'm not sure if prototype can chain the observe like that, you might need to: $$('fadeAway').each(function(obj){ $(obj).observe('click', function(event) { var element = event.element(); $(element).fade({ duration: 3.0, from: 0, to: 1 }); }); }); Since you know jQuery, the equivalent in jQuery is: $('fadeAway').click(function() { $(this).fadeOut('slow'); }); On Nov 26, 1:56 pm, justclint <[EMAIL PROTECTED]> wrote: > Im just getting into script.aculo.us by way of cakephp. As for > javascript frameworks Ive only used jquery. > > This question is so basic I cant find anything on past posts here in > the groups hence this post. > > Basically I just took a random effect and it worked as described in > the github area by applying it to an element selected by id. > > Im trying to get the effect to work "not by id" but by "this". Heres > my example but not working: > > script: > > > // function myeffect() { > $(this).fade({ duration: 3.0, from: 0, to: 1 }); > } > // ]]> > > > > html > > > Click me to fade away > > > or click me to fade away > > > > I dont see any documentation on how to apply to "document.this" > > Im sure my syntax is wrong but everyway I switch it around it still > wont work. > > What am I doing wrong? > > Thanks in advance! > > jc --~--~-~--~~~---~--~~ 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 [EMAIL PROTECTED] For more options, visit this group at http://groups.google.com/group/prototype-scriptaculous?hl=en -~--~~~~--~~--~--~---
[Proto-Scripty] Re: Simple question
Hi JC, Best way to do this is by using the Event.observe method (http://prototypejs.org/api/event/observe) to attach your fading method to designated divs. // assign a class name to the divs you want to have the fading behaviour Click me to fade away or click me to fade away // event.target to get the element that fired the click event function myeffect(event) { event.target.fade({ duration: 3.0, from: 1, to: 0 }); } // on domload, find all elements with fadeable class name // observe their click event and attach myeffect as its handler document.observe('dom:loaded', function() { $$('.fadeable').invoke("observe", "click", myeffect); }); That's how i would do it, complete separation between html and its behaviour. Or of course, you can also Click me to fade away function myeffect(zdiv) { zdiv.fade({ duration: 3.0, from: 0, to: 1 }); } But I strongly advice the first approach. cheers -- mona [EMAIL PROTECTED] On Wed, Nov 26, 2008 at 10:56 PM, justclint <[EMAIL PROTECTED]> wrote: > > Im just getting into script.aculo.us by way of cakephp. As for > javascript frameworks Ive only used jquery. > > This question is so basic I cant find anything on past posts here in > the groups hence this post. > > Basically I just took a random effect and it worked as described in > the github area by applying it to an element selected by id. > > Im trying to get the effect to work "not by id" but by "this". Heres > my example but not working: > > script: > > > // function myeffect() { >$(this).fade({ duration: 3.0, from: 0, to: 1 }); >} > // ]]> > > > > html > > > Click me to fade away > > > or click me to fade away > > > > I dont see any documentation on how to apply to "document.this" > > Im sure my syntax is wrong but everyway I switch it around it still > wont work. > > What am I doing wrong? > > Thanks in advance! > > jc > > > > --~--~-~--~~~---~--~~ 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 [EMAIL PROTECTED] For more options, visit this group at http://groups.google.com/group/prototype-scriptaculous?hl=en -~--~~~~--~~--~--~---
[Proto-Scripty] Re: Simple $( ) question
Thanks everyone. Very helpful. I also like the Prototype 'stripTags()' method. Very useful! On Nov 6, 3:55 am, "T.J. Crowder" <[EMAIL PROTECTED]> wrote: > Hi, > > > Should I be able to say the following? > > > var total = parseFloat($('foo')); > > No, $() gives you -- as you discovered -- a reference to the Element > object for the span, not the text of its content. It's an object with > lots of properties and methods. To get the text of its content, you > have to go get it. This HTML: > > > 50 > > Consists of two nodes: A span element containing a text node. The > text node's value is "50", so you *could* do this: > > var total = parseFloat($('foo').firstChild.nodeValue); > > That might meet your needs provided you know for sure that the HTML > will look exactly like that and not (for instance) like this for some > reason: > > > 50 > > or indeed this: > > > > > ...because in each case that's a different structure and the code > above would break. > > If what you're looking for is the text content of the Element and all > of its children, bundled up together, there's the DOM3 'textContent' > property[1] supported by Firefox (and other Gecko-based browsers), > Opera, and Safari (at least, Safari on Windows). IE6 doesn't support > it (don't know about IE7), but it has an equivalent called > innerText[2]. So you can test whether the browser provides > textContent, use it if so, and if not see if it provides innerText. > > [1]http://www.w3.org/TR/DOM-Level-3-Core/core.html#Node3-textContent > [2]http://msdn.microsoft.com/en-us/library/ms533899(VS.85).aspx > > Alternately, there's a very handy property called 'innerHTML' that's > not a W3C standard but is widely-supported; it was an IE thing that's > been picked up by other browsers. It gives you the HTML > representation of everything inside the element, including the tags. > Now, in your situation you don't want the tags, but Prototype provides > a handy stripTags() method on the String object, and so: > > var total = $('foo').innerHTML.stripTags(); > > ...would give you the equivalent of textContent/innerHTML another way. > > Finally, you could do a recursive descent with pure DOM methods > collecting the nodeValue of all text nodes you found. But it would > probably be slower than the shortcuts provided by browsers. > > Anyone out there have better approaches than textContent/innerText or > using innerHTML and stripping the tags? > > HTH, > -- > T.J. Crowder > tj / crowder software / com > > On Nov 6, 2:06 am, Scott <[EMAIL PROTECTED]> wrote: > > > If I have an element: > > > 50 > > > Should I be able to say the following? > > > var total = parseFloat($('foo')); > > > Instead, I am getting a return value of: > > > [object HTMLSpanElement] > > > and parseFloat is returning NaN. > > > Thanks in advance. --~--~-~--~~~---~--~~ 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 [EMAIL PROTECTED] For more options, visit this group at http://groups.google.com/group/prototype-scriptaculous?hl=en -~--~~~~--~~--~--~---
[Proto-Scripty] Re: Simple $( ) question
Hi, > Should I be able to say the following? > > var total = parseFloat($('foo')); No, $() gives you -- as you discovered -- a reference to the Element object for the span, not the text of its content. It's an object with lots of properties and methods. To get the text of its content, you have to go get it. This HTML: > 50 Consists of two nodes: A span element containing a text node. The text node's value is "50", so you *could* do this: var total = parseFloat($('foo').firstChild.nodeValue); That might meet your needs provided you know for sure that the HTML will look exactly like that and not (for instance) like this for some reason: > 50 or indeed this: > ...because in each case that's a different structure and the code above would break. If what you're looking for is the text content of the Element and all of its children, bundled up together, there's the DOM3 'textContent' property[1] supported by Firefox (and other Gecko-based browsers), Opera, and Safari (at least, Safari on Windows). IE6 doesn't support it (don't know about IE7), but it has an equivalent called innerText[2]. So you can test whether the browser provides textContent, use it if so, and if not see if it provides innerText. [1] http://www.w3.org/TR/DOM-Level-3-Core/core.html#Node3-textContent [2] http://msdn.microsoft.com/en-us/library/ms533899(VS.85).aspx Alternately, there's a very handy property called 'innerHTML' that's not a W3C standard but is widely-supported; it was an IE thing that's been picked up by other browsers. It gives you the HTML representation of everything inside the element, including the tags. Now, in your situation you don't want the tags, but Prototype provides a handy stripTags() method on the String object, and so: var total = $('foo').innerHTML.stripTags(); ...would give you the equivalent of textContent/innerHTML another way. Finally, you could do a recursive descent with pure DOM methods collecting the nodeValue of all text nodes you found. But it would probably be slower than the shortcuts provided by browsers. Anyone out there have better approaches than textContent/innerText or using innerHTML and stripping the tags? HTH, -- T.J. Crowder tj / crowder software / com On Nov 6, 2:06 am, Scott <[EMAIL PROTECTED]> wrote: > If I have an element: > > 50 > > Should I be able to say the following? > > var total = parseFloat($('foo')); > > Instead, I am getting a return value of: > > [object HTMLSpanElement] > > and parseFloat is returning NaN. > > Thanks in advance. --~--~-~--~~~---~--~~ 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 [EMAIL PROTECTED] For more options, visit this group at http://groups.google.com/group/prototype-scriptaculous?hl=en -~--~~~~--~~--~--~---
[Proto-Scripty] Re: Simple $( ) question
innerHTML will work but you need to remove any tags in tat may be inside it var regExp = /<\/?[^>]+>/gi; function ReplaceTags(xStr){ xStr = xStr.replace(regExp,""); return xStr; } A little snippet i found on google would work here var total=ReplaceTags($('foo').innerHTML); alert(parseFloat(total)); Enjoy :) - Original Message - From: "Luca Manganelli" <[EMAIL PROTECTED]> To: Sent: Thursday, November 06, 2008 9:44 AM Subject: [Proto-Scripty] Re: Simple $( ) question Try: var total = parseFloat($('foo').innerHTML); On Thu, Nov 6, 2008 at 03:06, Scott <[EMAIL PROTECTED]> wrote: > > If I have an element: > > 50 > > Should I be able to say the following? > > var total = parseFloat($('foo')); > > Instead, I am getting a return value of: > > [object HTMLSpanElement] > > and parseFloat is returning NaN. > > Thanks in advance. > > > > -- Grazie al modello matematico posso dirvi Come è nato l'universo: non chiedetemi il Perché. (Stephen Hawking) --~--~-~--~~~---~--~~ 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 [EMAIL PROTECTED] For more options, visit this group at http://groups.google.com/group/prototype-scriptaculous?hl=en -~--~~~~--~~--~--~---
[Proto-Scripty] Re: Simple $( ) question
Try: var total = parseFloat($('foo').innerHTML); On Thu, Nov 6, 2008 at 03:06, Scott <[EMAIL PROTECTED]> wrote: > > If I have an element: > > 50 > > Should I be able to say the following? > > var total = parseFloat($('foo')); > > Instead, I am getting a return value of: > > [object HTMLSpanElement] > > and parseFloat is returning NaN. > > Thanks in advance. > > > > -- Grazie al modello matematico posso dirvi Come è nato l'universo: non chiedetemi il Perché. (Stephen Hawking) --~--~-~--~~~---~--~~ 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 [EMAIL PROTECTED] For more options, visit this group at http://groups.google.com/group/prototype-scriptaculous?hl=en -~--~~~~--~~--~--~---
[Proto-Scripty] Re: Simple $( ) question
You need to get the contents of the element as $('foo') is the element itself .. innerHTML or innerTEXT should work ... var total=$('foo').innerTEXT; alert(parseFloat(total)); - Original Message - From: "Scott" <[EMAIL PROTECTED]> To: "Prototype & script.aculo.us" Sent: Thursday, November 06, 2008 2:06 AM Subject: [Proto-Scripty] Simple $( ) question > > If I have an element: > > 50 > > Should I be able to say the following? > > var total = parseFloat($('foo')); > > Instead, I am getting a return value of: > > [object HTMLSpanElement] > > and parseFloat is returning NaN. > > Thanks in advance. > > > > --~--~-~--~~~---~--~~ 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 [EMAIL PROTECTED] For more options, visit this group at http://groups.google.com/group/prototype-scriptaculous?hl=en -~--~~~~--~~--~--~---