Django autocomplete light: Select2 not showing AJAX-updated selected option text - jquery-select2

I have a DAL field with data-html attribute and populated with Select2QuerySetView::get_queryset(). I have overridden get_result_label(). For the same queryset result, get_result_label() may return different labels depending on some condition. The result labels are fetched correctly. But after selecting an option, its text displayed in the select box remains fixed even after it has subsequently changed and is re-selected from the dropdown list.
To demonstrate, here are some sequential screenshots. I am returning current time from get_result_label().
Initial results, first option being selected.
First option selected (17:42:08). New results fetched.
Second option selected at 17:42:29. Shown correctly in box. New results fetched.
First option with updated text (17:42:56) selected again. But in the box it still shows the original text (17:42:08).
Am I missing something? Or is there any workaround in DAL or Select2?

Answering own question: After trial-and-error, found that clearing the HTML in select2:selecting event seems to be working.
$(('#my_select2_id').on('select2:selecting', function(e) {
$('#' + this.id).html('');
});
Not sure if this is the correct way, though.

Related

Vaadin gridpro - select all checkbox - not all checkbox are visually selected

We are using Vaadin gridpro v23.0.2 with Grid.SelectionMode.MULTI.
When I click on the select all check box all the record are selected (getAllSelectedItems), but the interface (view) is not updated, some rows of the list remain unselected. If i call refreshAll on the data provider than the rows are shown as selected. Is it a bug in the gridpro version ?
screenshot
Kind regards,
Raphaƫl
Make sure you have hashCode and equals properly implemented in your data bean; see https://vaadin.com/docs/latest/binding-data/data-provider/#data-binding.data-provider.item-identifiers . If you don't have them, the selection might not show up correctly.

tooltip for checkboxGroup or radioGroup in repeat control

I have a repeat control bound to a (multi column) viewScope array.
The idea is that the chekboxGroup value will come from the first column and that the tooltip will come from the second column from the array.
The first thing (checkbox value) is not the problem. (see code)
The second thing is:
How can I assign the correct tooltip to the correct checkbox ?
<xp:repeat id="repeat4" rows="100" value="#{viewScope.choices}"
indexVar="rownumber" var="row" first="0">
<xp:checkBoxGroup id="checkBoxGroup2" layout="lineDirection">
<xp:selectItems>
<xp:this.value><![CDATA[#{javascript:return viewScope.choices[rownumber].get(0)}]]></xp:this.value>
</xp:selectItems>
</xp:checkBoxGroup>
<xe:tooltip id="tooltip1" for="checkBoxGroup2">
<xe:this.label><![CDATA[#{javascript:return viewScope.choices[rownumber].get(1)}]]></xe:this.label>
</xe:tooltip>
</xp:repeat>
EDIT
It seems that the tooltips work but are displayed off screen.
How do I manage to display them at the correct spot ?
Add position="before" or position="above" or position="below" to your tooltip control.
<xe:tooltip id="tooltip1" for="checkBoxGroup2" position="before">
By default it is "after" and this is outside the visible area in your example.

SelectMenu Customized and Refresh

I try to develop a selectMenu with image? I take exemple on jquery ui site and modify to add possibility to keep picture visible when you selected item with picture.
Here My code
My problem is on reset. Sometimes I need to put it in initial state.
I try refresh, but there is an automatic add of With on Span result and my select change size. I correct it on create event
widget.css({ 'width': '' });
But don't Work in select event... and when I click on reset my select become smaller.
Then I try destroy event. Good for the size but not for the text display. If I select an item with picture.
Click on reset
When I put break Point :
$(this).children(":first")
return the good item (text=TOUS") But it keeps old selected value to display text and display nothing
I don't know do to refresh correctly my selectmenu and return in first state
If debugging is the art of removing bugs ... then program is the art of creating

Rails-Haml, Table display of checkbox selection

I have a table that displays data for the items selected in the checkbox above, like a[], b[], c[]. Initially, when the page is first loaded, the table display is empty. When checkbox selections are made, the tables displays the data for the selection. Then when I untick all checkboxs and press display, the table display should be empty.
In the controller the variable for checkbox selection is thus>
#selected_brands = params[:brands] || session[:brands] || {}
as you may realize, params[], and session[] are values submitted by form in the view. {} -> when no checkboxes are selected.
Again in controller, I have this
#products = Product.find_all_by_brand(#selected_brands.keys)
The problem I have is, when I have unchecked the boxes, following the previous selections I made, the table displays data from previous session, instead of an empty table. What am I not doing?
You run into a HTML issue bugging lots of people: when you uncheck all checkboxes, nothing is sent to the server, and thus no change is recorded, so the last situation is still recorded.
There are many solutions to this (events, javascript, serverside code), so my advise is to broaden your search to generic html how to handle this situation best.
If you don't like Javascript, and have no problem with too many db-actions, remove all selected brands for the product and reapply the chosen ones when you get this result.

Submitting all items in a select input, even non-selected items?

I have a form, and the user needs to enter a list of email addresses that will receive a periodic report. I thought a good way to do this would be to have a text input, and buttons to add/remove and clear emails in select box. I used javascript to facilitate the buttons adding/removing and clearing the select box and this works fine. One thing I overlooked is that the select box only returns the selected items, however, in this case I want to return all of them.
Is there a way to return all of the items? One idea I had was to add a hidden input and just add the items in there as well.

Resources