[jQuery] Re: Creating DIV with JEditable Callback Function

[Jimmy Lee]

I had actually already tried using .html(), but it still didn't work.
I did some more research, and it looks like the issue has something to
do with the event handlers for the newly written divs not being
bound.  See this article for reference:

http://groups.google.com/group/jquery-en/browse_thread/thread/4c592bd7454c632f/17e4093d7ec7951e?lnk=gst&q=not+firing&rnum=3#17e4093d7ec7951e

I tried to put some code to bind the new divs to the click event:

        $(document).ready(function(){
                $(".editemail").editable("save1.php", {
                        cancel    : 'Cancel',
                        submit    : 'Submit'
                });

                $(".addemail").editable("save2.php", {
                        cancel    : 'Cancel',
                        submit    : 'Submit'
                }, function(value, settings) {
                        addedDiv.html('<div id="newDiv1"
class="editemail">mama</
div> <div id="newDiv2" class="editemail">papa</div>');
                        $(".editemail").unbind('click').bind('click', 
function() {
                                $(".editemail").editable("save1.php", {
                                        cancel    : 'Cancel',
                                        submit    : 'Submit'
                                });
                        });
                });
        });


This enables the in-line edit box on the new divs to function.
However, Save and Cancel buttons on the in-line edit box on the new
divs throw a runtime javascript error.  I'm guess this is because the
save and cancel buttons (for the Jeditable plug-in) on the new divs
are not bound.

Since I don't have too much time more to work on this, but I decided
to take an alternate approach of creating a bunch of iframes and
reloading them after the new divs are created.  Not so ideal, but oh
well.

Thanks,

Jimmy



On May 23, 10:29 pm, "Jean Nascimento" <[EMAIL PROTECTED]> wrote:
> dont work??
>
> On 5/23/07, Jean Nascimento <[EMAIL PROTECTED]> wrote:
>
>
>
> > $(document).ready(function(){
> >                $(".editemail").editable("save1.php", {
> >                        cancel    : 'Cancel',
> >                        submit    : 'Submit'
> >                });
> > var newDivz = <div id="newDiv1" class="editemail">mama</
> > div> <div id="newDiv2" class="editemail">papa</div>
>
> >                 $(".addemail").editable("save2.php", {
> >                        cancel    : 'Cancel',
> >                        submit    : 'Submit'
> >                }, function(value, settings) {
> >                      addedDiv.html(newDivz)
> > //or
> > //addedDiv.append(newDivz);
> >                });
> >        });
>
> > On 5/23/07, Jimmy Lee <[EMAIL PROTECTED]> wrote:
>
> > > Hi,
>
> > > I am trying to create a new div with the Jeditable callback function
> > > and have that new div also be editable in-line.  i.e. I want to do
> > > something like this:
>
> > >         $(document).ready(function(){
> > >                 $(".editemail").editable("save1.php", {
> > >                         cancel    : 'Cancel',
> > >                         submit    : 'Submit'
> > >                 });
>
> > >                 $(".addemail").editable("save2.php", {
> > >                         cancel    : 'Cancel',
> > >                         submit    : 'Submit'
> > >                 }, function(value, settings) {
> > >                         addedDiv.innerHTML = '<div id="newDiv1" 
> > > class="editemail">mama</
> > > div> <div id="newDiv2" class="editemail">papa</div>';
> > >                 });
> > >         });
>
> > > However, when clicking on "mama" and "papa" in newDiv1 and newDiv2,
> > > the in-line editor does not function.  Is there anything I can  do to
> > > make this work?
>
> > > Thanks,
>
> > > Jimmy
>
> > --
>
> > []´s Jean
> >www.suissa.info
>
> >    Ethereal Agency
> >www.etherealagency.com
>
> --
>
> []´s Jeanwww.suissa.info
>
>    Ethereal Agencywww.etherealagency.com