CODEWITHSUNDEEP
javascriptjquery
xid
xid

Reputation: 7

jQuery function into ajax

I'm using jQuery for a while but it is the first time I need to create my own function. (I'm using noConflict)

I have a code who work like this :

jQuery(function()
    {
        jQuery("#tabs-3").dynatree({
            checkbox: true,
            onActivate: function(dtnode) {
                alert("You activated " + dtnode);
            }
        });

        //etendre tt les noeuds
        jQuery("#tabs-3").dynatree("getRoot").visit(function(dtnode){
                dtnode.expand(true);
            });
    });

The code above is working, BUT, this part of code is in an ajax call, it worked for the first time when I called it, but not the second time or in future. when i call it with a function it gives error "jQuery.mytree is not a function". So what's wrong in my code. please help me .

(function(jQuery){
        jQuery.fn.extend({
            mytree: function (mytreename) 
            {
            alert(mytreename);
                jQuery(mytreename).dynatree({
                    checkbox: true,
                    onActivate: function(dtnode) {
                        alert("You activated " + dtnode);
                    }
                });
            }
        });
        jQuery.mytree('#tabs-3');
    })(jQuery);

Thanks!

Upvotes: -1

Views: 107

Answers (4)

xid
xid

Reputation: 7

Got the answer here!

I call now the function on the success call ajax on 1.php. (I think it's best coding just for that)

But before i check may tabs content, if it's not empty (previous tree) i destroy it before recreate it.

success : function(msg) 
                                    {
                                        if(msg!="")
                                        {
                                            //jQuery("#tabs-3").html(msg);
                                            (function(jQuery){
                                                //alert('Pass!'+jQuery("#tabs-3").text());
                                                if(jQuery("#tabs-3").text()!="")
                                                {
                                                    jQuery("#tabs-3").dynatree("destroy");
                                                }
                                                jQuery("#tabs-3").html(msg);
                                                jQuery("#tabs-3").mytree();
                                            })(jQuery);
                                        }
                                    }

Maybe not the more efficient but the best i found ;)

Special thanks to arun kumar!

Upvotes: -1

Arun Marimuthu
Arun Marimuthu

Reputation: 1

To call dynatree,

jQuery.fn.extend({
        mytree: function mytree() {
            console.log("My tree ", this.attr("id"));
            jQuery("#"+this.attr("id")).dynatree({
                checkbox: true,
                onActivate: function(dtnode) {
                    alert("You activated " + dtnode);
                }
            });
        }
    });

Upvotes: 0

Arun Marimuthu
Arun Marimuthu

Reputation: 1

you have to call like,

jQuery("#tabs-3").mytree();

Upvotes: 0

Alexey Soshin
Alexey Soshin

Reputation: 17711

That's because when you do jQuery.fn.extend, it extends your selector.

For example:

<div id = "tabs-3"></div>
<script type="text/javascript">

    (function(jQuery){
        jQuery.fn.extend({
            mytree: function mytree() {
                console.log("My tree ", this.attr("id"));
                // Do your cool AJAX calls 
            }
        });
        jQuery("#tabs-3").mytree();
    })(jQuery);

</script>

Will work. Inside mytree(), this is the result of your selector.

Upvotes: 0

Related Questions