0

I'm trying to get the id or name of the selected folder in a fuelux tree but couldnt manage to get it done.

My tree is a classic folder/file type tree and I want to be able to see the id of the folder when I click on a file.

this is my datasource for tree

var treeDataSource = new DataSourceTree({
                data: [
                    { name: 'Elektronik Belgelerim', type: 'folder', 'icon-class': 'blue', additionalParameters: { id: 'F1' } },
                    { name: 'Gelen Kutusu', type: 'folder', 'icon-class': 'blue', additionalParameters: { id: 'F2' } },
                    { name: 'Giden Kutusu', type: 'folder', 'icon-class': 'blue', additionalParameters: { id: 'F3' } },
                    { name: 'Çöp Kutusu', type: 'folder','icon-class':'green', additionalParameters: { id: 'I1' } },
                    //{ name: 'Çöp Kutusu', type: 'item', 'icon-class': 'success', additionalParameters: { id: 'F4' } },

                    //{ name: 'Reports', type: 'item', additionalParameters: { id: 'I1' } },
                    //{ name: 'Finance', type: 'item', additionalParameters: { id: 'I2' } }
                ],
                delay: 400
            });

js function for tree begins like this inside tree-custom.js

var e = function (e, i) {
        this.$element = t(e), this.options = t.extend({}, t.fn.tree.defaults, i), this.$element.on("click", ".tree-item", t.proxy(function (t) {
            this.selectItem(t.currentTarget)
        }, this)), this.$element.on("click", ".tree-folder-header", t.proxy(function (t) {
            this.selectFolder(t.currentTarget)
        }, this)), this.render()
    };

and this is where I add the links under folders again inside trree-custom.js. Very primitive I know but that's all I can do with my current skillset. The part I added is between quotes. Rest came with beyondadmin theme and looks like usual fuelux.

selectFolder: function (e) {
            //alert("testselectFolder");
            //
            //alert($('#myTree').tree({ dataSource: dataSource }));

            var i, n, r, o = t(e),
                s = o.parent(),
                a = s.find(".tree-folder-content"),
                l = a.eq(0);
            //-----------------------------------------------
            var li = $('<li>');
            var TcgbLink = $('<a href=/E-Belge/Main/Folder/Inbox/?Type=1&DocumentTypeId=3>e-TCGB</div>' +"</br>");
            var FaturaLink = $('<a href=/E-Belge/Main/Folder/Inbox/?Type=1&DocumentTypeId=4>e-Fatura</div>' + "</br>");
            var Dolasim = $('<a href=>e-Dolasim Belgesi</div>');
            li.append(FaturaLink);
            a.append(li);
            li.append(TcgbLink);
            a.append(li);
            li.append(Dolasim);
            a.append(li);
            //-----------------------------------------------
            o.find(".fa.fa-folder").length ? (i = "opened", n = ".fa.fa-folder", r = "fa fa-folder-open", l.show(), a.children().length || this.populate(o)) : (i = "closed", n = ".fa.fa-folder-open", r = "fa fa-folder", l.hide(), this.options.cacheItems || l.empty()), s.find(n).eq(0).removeClass("fa fa-folder fa-folder-open").addClass(r), this.$element.trigger(i, o.data())

        },

Now these links are being generated under all 4 folders. I want to be able to get the id (or name, preferably Id) of the folder so I can assign new Type parameters to querystring.

So far I tried to reach the id with this.data.id to no avail.

Ege Bayrak
  • 1,139
  • 3
  • 20
  • 49

1 Answers1

1

Instead of injecting the folder's children in the selectFolder callback, it is recommended to add the children via the dataSource callback (as in this example code: http://getfuelux.com/javascript.html#tree-usage-javascript).

The first argument to the dataSource is the "parent data" when you click on a tree node (with the second argument being the callback that you send the new array of child data).

This way you can use the selected event for getting your ID, because it gets the jQuery data passed to it.

futuremint
  • 724
  • 4
  • 5