I was thinking "Element", but now that you mention it, "Erik" makes
more sense. :-)
On May 6, 11:36 pm, Hector Virgen <[EMAIL PROTECTED]> wrote:
> Very nice! Is $E() short for Erik? :)
>
> Erik R. wrote:
> > Recently I've been using prototype's wonderful new DOM creation
> > syntax. But I found that it's still too verbose. Say I want to
> > create the following table:
>
> > <table id="myTable">
> > <thead>
> > <tr>
> > <th>Title A</th>
> > <th>Title B</th>
> > </tr>
> > </thead>
> > <tbody>
> > <tr>
> > <td>A</td>
> > <td>B</td>
> > </tr>
> > </tbody>
> > </table>
>
> > Simple, right? But, as I understand the prototype.js DOM building, to
> > build this table, I'd have to do:
>
> > var table = new Element('table', {id:myTable});
> > var thead = new Element('thead');
> > table.appendChild(thead);
> > var theadRow = new Element('tr');
> > thead.appendChild(theadRow);
> > theadRow.appendChild(new Element('th').update('Title A'));
> > theadRow.appendChild(new Element('th').update('Title B'));
> > var tbody = new Element('tbody');
> > table.appendChild(tbody);
> > var tbodyRow = new Element('tr');
> > tbody.appendChild(tbodyRow);
> > tbodyRow.appendChild(new Element('td').update('A'));
> > tbodyRow.appendChild(new Element('td').update('B'));
>
> > Grossly verbose, I think you'll agree. Particularly, it's the saving
> > of the local variables that bothers me.
>
> > But what if we had a shortcut function? Just like $() is short for
> > document.getElementById(), I think we could benefit from a shortcut
> > element function. So I've written one: $E.
>
> > var $E = function(tagName, attributes, childrenVarArgs)
> > {
> > var element = new Element(tagName, attributes);
> > $A(arguments).flatten().each(function(child, i)
> > {
> > if (i > 1 && child)
> > element.appendChild(child);
> > });
> > return element;
> > };
>
> > It takes the tagName and attributes just like the Element constructor,
> > but it will also take other arguments that will be appended as
> > children. Look at the new code to create that same table:
>
> > var table = $E('table', {id:myTable},
> > $E('thead', null,
> > $E('tr', null,
> > $E('th').update('Title A'),
> > $E('th').update('Title B'))),
> > $E('tbody', null,
> > $E('tr', null,
> > $E('td').update('Title A'),
> > $E('td').update('Title B'))));
>
> > A little nicer, don't you think? Some intelligent argument parsing
> > might also be added to get rid of those null attribute parameters.
>
> > Anyway, I'm submitting this as a suggestion to be incorporated into
> > the next release of prototype.js. Let me know what you think.
>
> > Cheers,
> > Erik
--~--~---------~--~----~------------~-------~--~----~
You received this message because you are subscribed to the Google Groups "Ruby
on Rails: Spinoffs" group.
To post to this group, send email to [email protected]
To unsubscribe from this group, send email to [EMAIL PROTECTED]
For more options, visit this group at
http://groups.google.com/group/rubyonrails-spinoffs?hl=en
-~----------~----~----~----~------~----~------~--~---
