Element.insert() help

[LexNonScripta]

I must say that I was quite surprised to see the Prototype
documentation being so unclear about the Element.insert function
(http://www.prototypejs.org/api/element/insert).

I tried testing it, but I could not make any sense of it. Where does
the "position" of the insert go as an argument.

I would really appreciate a clear example.

Tnx,

DizyArt

[Jerod Venema]

I'm not positive of this (still using v1.5), but I believe the syntax is:

$('foobar').insert({ before : '<b>Check this stuff out</b>'});

...and you can replace "before" with "top", "bottom", or "after" I believe.
 

Tnx,

DizyArt

--
Jerod Venema
Senior Software Engineer
Nth Penguin, LLC
http://www.nthpenguin.com
(919) 368-5105
---
WebWidgetry.com / MashupStudio.com
Future Home of the World's First Complete Web Platform

[LexNonScripta]

Actually both of these work (if someone is interested):

Element.insert( $('debug'), { top: 'The next thing!' } );
$('debug').insert( { top: "the next thing!"} );

On Nov 21, 3:10 pm, "Jerod Venema" <jven...@gmail.com> wrote:
> > I must say that I was quite surprised to see the Prototype
> > documentation being so unclear about the Element.insert function
> > (http://www.prototypejs.org/api/element/insert).
>
> > I tried testing it, but I could not make any sense of it. Where does
> > the "position" of the insert go as an argument.
>
> > I would really appreciate a clear example.
>
> I'm not positive of this (still using v1.5), but I believe the syntax is:
>
> $('foobar').insert({ before : '<b>Check this stuff out</b>'});
>
> ...and you can replace "before" with "top", "bottom", or "after" I believe.
>
>
>
> > Tnx,
>
> > DizyArt
>
> --
> Jerod Venema
> Senior Software Engineer

> Nth Penguin, LLChttp://www.nthpenguin.com

[themire]

Agreed. They don't explain what keywords to use for at the top, etc.

On Nov 21, 12:17 pm, LexNonScripta <lex.non.scri...@gmail.com> wrote:
> I must say that I was quite surprised to see the Prototype
> documentation being so unclear about theElement.insertfunction
> (http://www.prototypejs.org/api/element/insert).
>
> I tried testing it, but I could not make any sense of it. Where does

> the "position" of theinsertgo as an argument.

[LexNonScripta]

As I was combing through the API yesterday, I saw a HUGE surprise

ELEMENT IS A CONSTRUCTOR!! HIP HIP - HOOORAY!

Just what we needed!

Now, there was something I didn't understand. Can you append a newly
created html element
// fancy_input = new Element('input', {yada:'yada'... }) //
to an existing element
// $('my_test_form_thingie').insert( bottom: fancy_input ); //
(is element.appendChild() called internally)


Also, can I chain stuff like this:
[A] $('my_test_form_thingie').insert( bottom: fancy_input, bottom:
'<br /> This thing I inserted above is a fancy input. Prototype I love
you. Marry me!' );

OR must I use

[B] $('my_test_form_thingie').insert( bottom:
fancy_input).insert(bottom: '<br /> This thing I inserted above is a
fancy input. I like chaining.. boohoo.. :(' );


Cheers!

[Nicolás Sanguinetti]

All of insert/update/replace can take several kind of arguments:

- A string of HTML (how Prototype worked up until 1.5.2)
- An Element (either something you build with new Element or something
you get from the dom -- ie, $("something"))
- An object that responds to "toElement", which should return an Element object.
- An object that responds to "toHTML", which should return a string of HTML.

So for example:

var Person = Class.create({
initialize: function(name) {
this.name = name;
},
toElement: function() {
return new Element("li", { className: "person" }).update(this.name);
}
});

var john = new Person("John");
$("people").insert(john);

Should work fine :)

Best,
-Nicolas