Structured Root Selector

Hi,


I've created a structured root selector so people can choose items from a drop down menu.



The items in the menu relate to Folders in the asset map.



The problem is that the items in the drop down menu are in descending order as I added them, even though I've manually moved the Folders so they are in alphabetical order in the asset map, the drop down is still in the wrong order.



How do I reorder items listed in the drop down?

Thanks :slight_smile:

Hannah

To my knowledge, there is no way of controlling the order that these appear in the structured root node selector. As with most things in Matrix, however, there are other ways of achieving the same thing using some other tools. In this case I would consider the possibility of using another asset listing to generate the root node select field and nesting that in the content of the main asset listing.

You could change them to a-z order using some jQuery:

    var root_arr = $('#parent option');
    var opts = jQuery.makeArray(root_arr).
    	sort(function(a,B) {
    		return (a.innerHTML > b.innerHTML) ? 1 : -1;
    	});
    	$('#parent').html(opts);


The forum is changing the second param of the sort function to B, it should be b.

[quote]
I’ve created a structured root selector so people can choose items from a drop down menu.



The items in the menu relate to Folders in the asset map.



The problem is that the items in the drop down menu are in descending order as I added them, even though I’ve manually moved the Folders so they are in alphabetical order in the asset map, the drop down is still in the wrong order.



How do I reorder items listed in the drop down?

[/quote]

A discrepency between Asset Map order and the Strucutred Root Node selector was discovered recently.

It turns out that these were added by asset tree order (an ID given on the database) rather than the Asset Map order. This is based on the order in which the asset was added, and is only evident once assets have been moved around.



This has been resolved as somewhat of an enhancement as Bug 3760 “Structured Root Selector listing order problem”. Matrix releases of 3.20.7, 3.22.3 and 3.24.0 contain this modification.



So this might be a longer term solution for you. Nic’s jQuery skillz should do nicely in the meantime B)

[quote]
You could change them to a-z order using some jQuery:


    var root_arr = $('#parent option');
    var opts = jQuery.makeArray(root_arr).
    	sort(function(a,B) {
    		return (a.innerHTML > b.innerHTML) ? 1 : -1;
    	});
    	$('#parent').html(opts);


The forum is changing the second param of the sort function to B, it should be b.
[/quote]
thanks :-)
So do I paste this straight into the HTML part of the Edit Contents screen for the Page Contents bodycopy? Where does it go in relation to the keywords already on that screen?

[quote]
thanks :slight_smile:

So do I paste this straight into the HTML part of the Edit Contents screen for the Page Contents bodycopy? Where does it go in relation to the keywords already on that screen?

[/quote]



Yes, you just add it to the Page Contents. Make sure also to include jQuery.

[quote]
Yes, you just add it to the Page Contents. Make sure also to include jQuery.

[/quote]

Ok, I've uploaded a jQuery file into matrix. But don't I need to do something in the <head> tags of the page to get it to get it to reference the file? How do I do that?

[quote]
Ok, I've uploaded a jQuery file into matrix. But don't I need to do something in the <head> tags of the page to get it to get it to reference the file? How do I do that?

[/quote]



No, you don't HAVE do add jQuery or the script to the head. Just try adding them to your body and get the script working. Then if you want to move them around you can.

[quote]
No, you don't HAVE do add jQuery or the script to the head. Just try adding them to your body and get the script working. Then if you want to move them around you can.

[/quote]

I put the jQuery file into Matrix using the New Child > File > JS File route.

Then I pasted the code into the Page Contents Bodycopy.

But the code is just appearing as text on my page rather than actually doing anything…

[quote]
I put the jQuery file into Matrix using the New Child > File > JS File route.

Then I pasted the code into the Page Contents Bodycopy.

But the code is just appearing as text on my page rather than actually doing anything…

[/quote]



You are adding a script so you need to enclose it with <script type="text/javascript"> tags.



Do you know anyone around there that knows javascript? The example I provided is NOT a plug and play solution, you will need to change some of the selectors in order to get it working. Are you able to read up a little on JS and jQuery so you navigate your way through this?



Any html examples would be good, as I could show you what needs to be changed in the js.

[quote]
You are adding a script so you need to enclose it with <script type="text/javascript"> tags.



Do you know anyone around there that knows javascript? The example I provided is NOT a plug and play solution, you will need to change some of the selectors in order to get it working. Are you able to read up a little on JS and jQuery so you navigate your way through this?



Any html examples would be good, as I could show you what needs to be changed in the js.

[/quote]

Thanks, yeah. I guess I'll have to find someone!



The HTML code for the page is:

    

External examiners directory

Find an examiner by degree subject:

%structured_root_node% %submit_button%

Examiners

%asset_listing%

[quote]
Thanks, yeah. I guess I'll have to find someone!

[/quote]



If you give the <p> an id that surrounds your structured root node keyword, you can then do the following:



[html]<h1>External examiners directory</h1>

<p><strong>Find an examiner by degree subject:</strong></p>

<p id="root">%structured_root_node% %submit_button%</p>

<h2>Examiners</h2>

<p>%asset_listing%</p>

[/html]


    var root_arr = $('#root select option');
    var opts = jQuery.makeArray(root_arr).
        sort(function(a,B) {
                return (a.innerHTML > b.innerHTML) ? 1 : -1;
        });
        $('#root select').html(opts);

[quote]
If you give the <p> an id that surrounds your structured root node keyword, you can then do the following:



[html]<h1>External examiners directory</h1>

<p><strong>Find an examiner by degree subject:</strong></p>

<p id="root">%structured_root_node% %submit_button%</p>

<h2>Examiners</h2>

<p>%asset_listing%</p>

[/html]


    var root_arr = $('#root select option');
    var opts = jQuery.makeArray(root_arr).
        sort(function(a,B) {
                return (a.innerHTML > b.innerHTML) ? 1 : -1;
        });
        $('#root select').html(opts);

[/quote]

Ok, so I put all that in and it did two things: made the asset list disappear and made the commit button disappear!!! Seriously nuts. I couldn't even use Alt+s! So I rebuilt an asset listing page and put all the children into it - that's when i noticed that the drop down was ordered by the order in which you put the children into the asset map - ie not by their asset id. So now they are in alphabetical order and I didn't have to use javascript. thanks for all your help :slight_smile: