[Proto-Scripty] Re: Appending a template evaluation to an HTML element.
As it turns out, I had to revise the program flow and, since the data
is available at the time I write the data for the innerHTML, I simply
incorporated it into the data with javascript as it is written. So
the result is nice and efficient, all html and no DOM.
I'm sure I'll wind up needing your tip anyway though. Thanks a lot.
On Aug 19, 12:12 am, "T.J. Crowder" wrote:
> Hi,
>
> > Should the form elements of an innerHTML assignment be
> > addressable after its insertion?
>
> Yes, but there are browser bugs around both forms and tables (mostly
> but not entirely IE bugs). The good news is that Prototype includes
> workarounds for them, so if you use Element#update rather than setting
> innerHTML directly, you should be okay.
>
> -- T.J. :-)
>
> On Aug 18, 4:24 pm, ChrisH wrote:
>
> > I was using the innerHTML method to produce a table of forms. I had
> > to change to the DOM element method because I couldn't address the
> > form elements created by the innerHTML method and the whole purpose
> > was to be able to submit another ajax request with data from the
> > forms. Should the form elements of an innerHTML assignment be
> > addressable after its insertion? If so, how?
>
> > On Aug 17, 10:34 am, "T.J. Crowder" wrote:
>
> > > Hi,
>
> > > The original code:
>
> > > $('vsNewUsers').update($('vsNewUsers').innerHTML +
> > > tmpl_NewUser.evaluate({NewUserID : --i_NewUserID}));
>
> > > ...will require the browser to spin through the tree inside vsNewUsers
> > > and create an equivalent HTML string to give you; then tear down that
> > > tree, parse the HTML you give it back (including re-parsing the stuff
> > > it just gave you), re-instantiate a lot of elements that look exactly
> > > the same as the previous one (plus the new ones at the end), re-
> > > calculate the layout of the previous elements (and then the additional
> > > ones), etc. (Layout can be expensive with tables, too, so...)
>
> > > Seems like unnecessary work. :-) Granted the browser's going to do it
> > > really fast, but still. Also, you'd lose any event handlers you'd
> > > hooked up to the elements in there and any other data you may have
> > > stored on them. If your user is using IE, any elements that
> > > Prototype's already extended will have to be re-extended (which takes
> > > non-trivial time on big tables).
>
> > > Fortunately, Element#insert[1] is for exactly this situation:
>
> > > $('vsNewUsers').insert({
> > > bottom: tmpl_NewUser.evaluate({NewUserID : --i_NewUserID})
>
> > > });
>
> > > [1]http://api.prototypejs.org/dom/element/insert/
>
> > > Vis-a-vis using `new Element` rather than HTML: Parsing HTML and
> > > showing the result on the page is fundamentally what browsers do, and
> > > they do it really, _really_ fast. When rendering HTML, they can work
> > > directly with their internal structures. When you use the DOM API, you
> > > lose that benefit and have to work through the browser's DOM API ->
> > > internal structures mapping. And you're doing all of your work in an
> > > interpreted (or at least compiled-on-the-fly) language.
>
> > > Net result? Markedly slower -- like an order of magnitude -- to go
> > > through the DOM API vs. using HTML. This isn't a Prototype thing at
> > > all, it's just the nature of browsers and what they're optimized for.
> > > I actually did a test page (not much of one) a little over a year back
> > > when answering a question for someone that showed this in action, and
> > > through the wonder that is 'net search:http://pastie.org/521342
>
> > > HTH,
> > > --
> > > T.J. Crowder
> > > Independent Software Consultant
> > > tj / crowder software / comwww.crowdersoftware.com
>
> > > On Aug 17, 2:09 pm, Phil Petree wrote:
>
> > > > I would think that Creating elements is less limiting... but I have no
> > > > idea
> > > > what most developers do.
>
> > > > On Tue, Aug 17, 2010 at 8:29 AM, Richard Quadling
> > > > wrote:
>
> > > > > On 17 August 2010 12:59, Phil Petree wrote:
> > > > > > ===
> > > > > > HTML save as index.html:
> > > > > >
> > > > > >
> > > > > >
> > > > > >
> > > > > >
> > > > > >
> > > > > >
> > > > > > Keyword > > > > > name="keyword_1">
> > > > > >
> > > > > >
> > > > > >
> > > > > >
> > > > > >
> > > > > >
> > > > > >
> > > > > > var nextkeyid = 2;
> > > > > > function addkeyword()
> > > > > > {
> > > > > > var elTR = $('keytable').insertRow( -1 );
> > > > > > var elTitleTD = elTR.insertCell( -1 );
> > > > > > elTitleTD.appendChild( document.createTextNode( 'Keyword' ) );
> > > > > > var elInput = document.createElement( 'input' );
> > > > > > elInput.type = 'text';
> > > > > > elInput.name = 'keyword_'+nextkeyid;
> > > > > > nextkeyid++;
> > > > > > var elInputTD = elTR.insertCell( -1 );
> > > > > > elInputTD.appendChild( elInput );
> > > > > > }
> > > > > > function dosubmit( ) {
> > > > > > new Ajax.Updater( 'result', 'add.php', { method: 'post',
> > > > > > p
Re: [Proto-Scripty] Re: how to modify a part of an
I found one called Reggy quite a while ago. It's written by Sam
Souder, but I don't have a URL for it.
Walter
On Aug 20, 2010, at 2:26 AM, Erwin wrote:
thanks I'll look at that... and maybe try to find a RegExp app for
Mac...
On 19 août, 21:01, Dave Kibble wrote:
depends entirely on what you are trying to capture - is the "edit"
always there? is the /admin/users/ always there?
yes... they are, only the 'id' number is going to change
in general I'm a great fan ofhttp://www.w3schools.com/but not sure
what to recommend for regular expressions in general - most sites are
confusing rather than educational for the novice :) you can
tryhttp://www.w3schools.com/jsref/jsref_obj_regexp.asp
On 19 August 2010 14:26, Erwin wrote:
I tried the following
var editRegExp = /(^.*?)([^\/]*)\/edit\?(.*$)/;
var edit_link = $('edit_user').down('a');
var match = editRegExp.exec(edit_link.href.toString());
on this url :
/admin/users/4c6a275ea326cb01f401/edit?locale=en
seems to work , maybe a better writing ?
On 19 août, 15:10, Erwin wrote:
Hi Dave .. sorry to ask you an additional trick ... but as you are
qui good in RegExp ...
what if the href is as following :
/admin/users/4c6a275ea326cb01f401/edit?locale=en
in this case (^.*?) is getting the 'edit' string, not the id
number :
4c6a275ea326cb01f401
btw : which tutorial do you recommend to get a better
understanding of
RegExp ..? (I found some of them w good explanation but few
examples;..)
erwin
On 18 août, 19:27, Dave Kibble wrote:
you might find this regular expression useful:
var myRegExp = /(^.*?)([^\/]*)\?(.*$)/;
var match = myRegExp.exec(link.href.toString());
alert(match[1] + '\n' + match[2] + '\n' + match[3]);
--
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 athttp://groups.google.com/group/prototype-scriptaculous?hl=en
.
--
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
.
--
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] Would like to convert my little checkbox grid into a component of some sort.
Hi.
I have some code, developed using Prototye (code works in IE8, Firefox
and Chrome) which displays a list of checkboxes in an order that is
alphabetically sorted and displayed top to bottom, left to right in
auto-sized columns and padded to fit the width of the container.
So, if the list of items is a,b,c,d, if these were added to a
container and the container could display them 2 wide, the display
would be ...
a b
c d
My code will display them ...
a c
b d
See http://twitpic.com/2ggng3 for a real example. Notice how the names
are arranged in columns and easier to read. Find all the SFS ones is a
LOT easier this way.
It is probably pretty raw code - I'm not a genius.
What I'd like to do is "componentize" it, turn it into something that
is as simple to use as ...
new cbGrid('cbGridContainer', {options});
where options would include the data to show on the grid and anything
else that can be configured.
Currently I have only 1 use for it but maybe others could use it too.
The use I have is to display a list of contract names. The list is
dynamic and retrieved via an AJAX call.
I'm willing to do the donkey work, but would like some advice on how I
go about doing this.
I'm happy to make the code open source (where's the best place to show
it ... github? I've just created a public repository (but I've never
used git properly ... )
So. Anyone interested in some handholding whilst I get to grips with this?
Or have I just re-invented the wheel?
Regards,
Richard Quadling.
--
Richard Quadling.
--
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: video element not playing on IE
Hi,
> I know IE does not support , but mine does thanks to kaltura
> library.
Probably a question best addressed to Kaltura, then. My suspicion is
that they can't add the video functions to the element instance
automagically for the same reason Prototype can't, and so I bet they
have an equivalent to the $ function you need to pass the element
through before calling `play`. Just a guess, but since we know they
can't extend the element object via its prototype (because IE doesn't
allow that)...
FWIW,
--
T.J. Crowder
Independent Software Consultant
tj / crowder software / com
www.crowdersoftware.com
On Aug 20, 11:22 am, Alberto Gil Fernández wrote:
> To moderators: i just posted this problem but im now an step ahead.
> Wanted to edit/delete previous entry but couldn't fin how.
>
> I have got the following function:
>
> function tts() {
> var videoElement = $(document.createElement('video'));
> videoElement.setAttribute('src','anim1.ogg');
>
> videoElement.observe("loadeddata",
> function() {
> $('response').innerHTML="";
> $('response').appendChild(videoElement);
> }, true);
>
> videoElement.observe("ended",
> function() {
> $('response').innerHTML =
> " alt=\"avatar\" />"
> }, true);
>
> videoElement.play();
>
> }
>
> This works just fine on FF and Chrome, but does not work on IE. I got
> the annoying "Object does not support this property or method" error
> when i reach the "videoElement.play();" line.
>
> I know IE does not support , but mine does thanks to kaltura
> library. This code works:
>
>
>
>
>
> so i guess the error is coming from somewhere else.
>
> Suggestions?
>
> Thanks you :)
--
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: IE "Object doesn't support the property or method"
All:
The OP figured this out himself while this message was pending
moderation, no need to answer this one. (There's a separate follow-up
to answer instead, though.)
--
T.J. Crowder
Independent Software Consultant
tj / crowder software / com
www.crowdersoftware.com
On Aug 20, 10:25 am, Alberto Gil Fernández wrote:
> I have got the following code
>
> function tts() {
> var videoElement = document.createElement('video');
> videoElement.setAttribute('src','anim1.ogg');
>
> videoElement.observe("loadeddata",
> function() {
> $('response').innerHTML="";
> $('response').appendChild(videoElement);
> }, true);
>
> videoElement.observe("ended",
> function() {
> $('response').innerHTML =
> " alt=\"avatar\" />"
> }, true);
>
> videoElement.play();
>
> }
>
> Works fine in FF but i got the annoying error on IE "Object doesn't
> support the property or method" on the
> videoElement.observe,videoElement.observe, and videoElement.play()
> lines.
>
> I have read that the solution is passing the element trought $. i have
> tried it, but seems i am doing somethig bad. if i change the the code
> to:
>
> function tts() {
> var videoElement = document.createElement('video');
> videoElement.setAttribute('src','anim1.ogg');
> videoElement.setAttribute('id', 'mivideo');
> //alert(videoElement.id);
>
> $('mivideo').observe("loadeddata",
> function() {
> $('response').innerHTML="";
> $('response').appendChild(videoElement);
> }, true);
>
> $('mivideo').observe("ended",
> function() {
> $('response').innerHTML =
> " alt=\"avatar\" />"
> }, true);
>
> $('mivideo').play();
>
> }
>
> then i get the following error: $("mivideo") is null, on the first $
> ('mivideo').observe line, and this time i got it on FF.
>
> Suggestions?
>
> Thanks for your help :)
--
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] video element not playing on IE
To moderators: i just posted this problem but im now an step ahead.
Wanted to edit/delete previous entry but couldn't fin how.
I have got the following function:
function tts() {
var videoElement = $(document.createElement('video'));
videoElement.setAttribute('src','anim1.ogg');
videoElement.observe("loadeddata",
function() {
$('response').innerHTML="";
$('response').appendChild(videoElement);
}, true);
videoElement.observe("ended",
function() {
$('response').innerHTML =
""
}, true);
videoElement.play();
}
This works just fine on FF and Chrome, but does not work on IE. I got
the annoying "Object does not support this property or method" error
when i reach the "videoElement.play();" line.
I know IE does not support , but mine does thanks to kaltura
library. This code works:
so i guess the error is coming from somewhere else.
Suggestions?
Thanks you :)
--
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] IE "Object doesn't support the property or method"
I have got the following code
function tts() {
var videoElement = document.createElement('video');
videoElement.setAttribute('src','anim1.ogg');
videoElement.observe("loadeddata",
function() {
$('response').innerHTML="";
$('response').appendChild(videoElement);
}, true);
videoElement.observe("ended",
function() {
$('response').innerHTML =
""
}, true);
videoElement.play();
}
Works fine in FF but i got the annoying error on IE "Object doesn't
support the property or method" on the
videoElement.observe,videoElement.observe, and videoElement.play()
lines.
I have read that the solution is passing the element trought $. i have
tried it, but seems i am doing somethig bad. if i change the the code
to:
function tts() {
var videoElement = document.createElement('video');
videoElement.setAttribute('src','anim1.ogg');
videoElement.setAttribute('id', 'mivideo');
//alert(videoElement.id);
$('mivideo').observe("loadeddata",
function() {
$('response').innerHTML="";
$('response').appendChild(videoElement);
}, true);
$('mivideo').observe("ended",
function() {
$('response').innerHTML =
""
}, true);
$('mivideo').play();
}
then i get the following error: $("mivideo") is null, on the first $
('mivideo').observe line, and this time i got it on FF.
Suggestions?
Thanks for your help :)
--
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: Really Simple History + Prototype
Hi,
I know of three gotchas with RSH (none of them specific to Prototype):
1. You _have_ to call `window.dhtmlHistory.create` from a script tag
in the `body` element of your page, because it uses `document.write`
(sadly) to write elements during the course of that call. I have it
right at the end of my `body` tag.
2. You _have_ to call `window.dhtmlHistory.initialize` from the window
`load` event or later, not earlier (for instance, not from
dom:loaded).
3. You _have_ to have a file called 'blank.html' alongside the HTML
file you're using rsh.js in (or edit rsh.js to change the name and/or
path of that file).
YMMV, but looking at an app where I used it and it seems to work okay,
I call this function from with the `body` tag:
function writeHistoryElements() {
window.dhtmlHistory.create({
toJSON: Object.toJSON,
fromJSON: function(s)
{
return s.evalJSON();
}
});
}
...and then this code one once `window.load` has fired:
var history = window.dhtmlHistory;
history.initialize();
history.addListener(historyChange);
if (history.isFirstLoad())
{
// Do anything you may want to do on the first load
}
Example:
http://pastie.org/1103706
I don't use the data feature, just the notification of hash changes --
I store all state I'm going to need in the hash or on the server, so
that all URLs are bookmarkable. I think the idea of the data stuff is
that you can cache stuff on the client, but I don't need that for this
app and the data stuff didn't seem to work very well cross-browser
(RSH hasn't been maintained in a while).
HTH,
--
T.J. Crowder
Independent Software Consultant
tj / crowder software / com
www.crowdersoftware.com
On Aug 19, 5:21 pm, JJS wrote:
> Hello, I'm trying to get RSH (or anything that works for the back
> button problem) implemented with prototype. I've tried what it says in
> the usage instructions, and some other alternatives in the comments
> (http://code.google.com/p/reallysimplehistory/wiki/UsageInstructions),
> but I can't get this to work
>
> I'd appreciate it if something could write out the really simple
> history functions to put in, and a working ajax example where the
> history is recorded.
>
> Thank You
--
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.
