vicb/bsmSelect

missing default order

Opened this issue · 15 comments

you can reorder items by bsmselect but there is probably no way how to force item order when building list without changing select options orders

example

  • add few items
  • reorder
  • submit
  • save with order

but there is missing way how to tell bsmselect that you want items with custom/saved order

vicb commented

The way to use a custom order is to generate the original select with your desired order:

  • generate the select with a default order (server side),
  • re-order and submit,
  • generate the select with the customized order (server side)

I'd like to add that, for me, server side sorting is undesirable.
For example: I may prefer to have the select list sorted alphabetically at all times.

For grouped options it's even impossible, because I can select an option from group 'b', then one from 'a', and another from 'b' again.

I've made some changes that are a bit hacky, but serve my purposes for now:
http://pastebin.com/0e4HPs8k
It adds an array to the options that take ID values in the right order. buildSelect() then iterates over them to reorder the $list.

It will probably fail with certain option values, and the initial sorting should probably be moved from buildSelect() to addListItem().

vicb commented

There's an open issue waiting for feedback about this (#24)
Please comment there & use PRs rather than pastebin.
Thanks.

vicb commented

Oops not the same problem !

Can't you solve your issue by sorting the select options before calling bsmSelect (sorting is not bsmSelect specific)

Maybe I'm missing something because I haven't tried server side sorting. But I assumed it leaves the selectbox with the same sorting, so I didn't bother.

This is an example of my changes:
http://www.artform.nl/bsmSelect/

note the selectbox still has the alphabetic sorting of both options and groups, and the list of selected options is sorted as specified in the sortOptions array (as stored in a database or something).

vicb commented

@Phennim I was still not there. It seems you want the list to be built with a defined order.

Would setting addItemTarget to orginal solve your issue (the ordering can still be overriden, look at the doc).

vicb commented

Hum... looking at your example it seems more like what I said before. You want the select to be sorted, so this as nothing to do with bsmSelect, use JS to sort before calling bsmSelect.

No, I want the .bsmList to be sorted as it is stored in the database.
And I want the select to remain as it was (alphabetically).

If I sort the select before calling bsmSelect it is no longer alphabetically.
And with optgroups it's even impossible (unless you want different optgroups with the same label).

vicb commented

I don't understand your use case. Could you describe it using an example may be ?

Ok, the actual use case for a client, and the reason I worked on it today.

In the CMS the client can upload categorized documents.
Those can be attached to a page and sorted using the bsmSelect which is saved to the database for display in the frontend.

So if the client edit's the page it needs to display the select box in alphabetical order and the list items in the order as it is en the database... Seems like a very common use-case in combination with sortable to me.

changed my example to match the case: http://www.artform.nl/bsmSelect/

vicb commented

Well I don't understand your example:

  • the list is sortable (probably an error),
  • items are not re-added where they were removed (using an unmodified version of bsm ?).

But from you desciption, what you should do: Generate the events list markup in the desired (alpha) order & include a data-bsm-order reflecting the list order (db).

Well, nothing I haven't said before, may be I still don't get your use case ?

Perhaps a simpler use case to understand:

I'm building what is essentially a query-builder for report generation. There's a long list of fields across a handful of tables that the user might want to output -- these are put in the select in a natural order (option group for each table, option for each field, alphabetized by their display name).

I'd like people to be able to save a report setup, so they can run it whenever they want to without re-setting all the various field inputs. Order is important because it dictates order of the values in the generated spreadsheet.

So, I want to be able to (a) "seed" the list-of-fields-to-return with (b) fields in the order the user originally set them up with, but (c) not move those fields out of their natural order in the optiongroups.

My hacky solution is to actually loop through the items I want and write javascript to (a) set 'selected' on the option, and then (b) trigger "change" on the bsmSelect object itself.

I can see where this might be an edge case you don't want to put cycles into, but thought I'd let you know there are real use cases.

I needed something similar. I worked on a solution for asmselect. See updated asmselect code: http://jsfiddle.net/4ELdY/13/

The way to do that is as follows.

The original select:

<select id="myselect" name="test" multiple="multiple">
    <option value="40">A</option>
    <option value="75">B</option>
    <option value="41">C</option>
    <option selected="selected" data-bsm-order="1" value="29">D</option>
    <option value="39">E</option>
    <option value="23">F</option>
    <option selected="selected" data-bsm-order="0" value="44">G</option>
    <option value="62">H</option>
    <option value="38">I</option>
    <option value="61">J</option>
</select>

And the Javascript:

jQuery("#myselect").bsmSelect({
    addItemTarget: 'original',
    plugins: [jQuery.bsmSelect.plugins.sortable(), jQuery.bsmSelect.plugins.compatibility()]
});

@vicb I really don't understand why you are struggling to understand this. Let me try.

I have a list of customer titles, alphabetical:

Dr
Mr
Mrs
Sir

I want to allow some or all of these to be assigned and the order to be customised.
For example the user may want Mr and Mrs first because they are more common.

However for finding the option you desire I wish to keep the alphabetical order.

Another way of looking at it is the original select is the SOURCE and the BSMSelect is the ASSIGNED.

So with that in mind I have the exact same quirk where if I reload the page fresh, the data-bsm-order attribute is not honoured on my hidden select list. The bsm renders perfectly but it ignores my field that I want to save...UNLESS, I move one item. If I move an item the whole order of the original select is fixed!

So how can I tell bsm to do this during the call of $(".customer-titles").bsmSelect({...}) ??

I guess there are two ways of approaching it, either allow option to sort bsmSelect so we can build the select server side in correct order OR the way I think works better, honour the data-bsm-order on the hidden select in the bsm init.