search

snapappointments / bootstrap-select

:rocket: The jQuery plugin that brings select elements into the 21st century with intuitive multiselection, searching, and much more.
https://developer.snapappointments.com/bootstrap-select/
MIT License
9.85k stars 2.72k forks source link

Is there a way to set data-content dynamically ? #948

Closed pravin-d closed 9 years ago

pravin-d commented 9 years ago

I'm using bootstrap and knockoutJS with selectpicker. I want to add a label to the select options, which would change color according to some condition. So I want to know if I can dynamically set the data-content through selectpicker function.

pravin-d commented 9 years ago

After updating the data-content attr in

caseyjhol commented 9 years ago

Can you provide me with a jsfiddle?

Both of these are working for me:

    $('#city').find('option').eq(0).data('content', 'Test content.').parent().selectpicker('refresh');

\\ or

    $('#city').find('option').eq(0).attr('data-content', 'Test content.').parent().selectpicker('refresh');
pravin-d commented 9 years ago

Yes I have use the first one. I have not tested the second. Let me explain the problem I was facing(as a novice knockout js developer) .

and create the option again. However selectpicker uses data from JS and does not re-read the data-content attr when refresh or render is called. Hope this helps someone.
caseyjhol commented 9 years ago

refresh() does re-read the data-content attribute. reloadLi() is called within refresh(). reloadLi() calls createLi() which runs through all of the options and recreates them, including any data attributes set on the options. If you can provide me with an example where this isn't happening as it should be, please link me to it. What version of bootstrap-select are you using?

kriit24 commented 4 years ago

try to replace with a html

<input type='text' class='bss-input' id='bss-input-175a15d7376' onKeyDown='event.stopPropagation();' onKeyPress='selectPicker.addSelectInpKeyPress(this,event)' onClick='event.stopPropagation()' onkeyup='selectPicker.editSelectItem(this,\'175a15d7376\')' value='adad'/>

full option

version: 1.13.14

martin-braun commented 1 year ago

Can you provide me with a jsfiddle?

Both of these are working for me:

    $('#city').find('option').eq(0).data('content', 'Test content.').parent().selectpicker('refresh');

\\ or

    $('#city').find('option').eq(0).attr('data-content', 'Test content.').parent().selectpicker('refresh');

This sample was very helpful. It seems editing the data-content without jQuery will make it fail. I could confirm this, because data('content', 'Test') will not change the data-content on the element itself, but only internal JS as it seems.