How to reinitialize dynamic Semantic UI Search Dropdown - semantic-ui

How can I reinitialize selectdd2 dropdown option on change of selectddl dropdown? Anyone can help me on this?
For example : If we select country the corresponding states will be loaded in second dropdown.
HTML Code
<select class="ui search selection dropdown dropdown-spinner" id="selectdd1">
<option value="">Select Country</option>
</select>
<select class="ui search selection dropdown dropdown-spinner" id="selectdd2">
<option value="">Select State</option>
</select>

There is no need reinitialize your dropdown input , all you need is to change options dynamically in select element (state) when the value of your first select element (country) is changed ,by listening to onchange event.
Here is a simple demo example , and here is an example with Semantic-UI countries flags

Related

Mat selection list how focus a specific item using a search bar

I would like to ask how I can focus on a specific item in the long list via a search bar.
example: when a user enters something on the search bar, the list is filtered to find the elements that contain that search key, I would like that if at least one result is found, the focus is placed on the first element found.
when user visit the page:
after the user search a something:
thanks!
i don't know if this solves your problem or not u can use datalist tag in html which work kind of similar it will filter everything except what u have typed in search box instead of focusing at that element.
<label for="browser">Choose your browser from the list:</label>
<input list="browsers" name="browser" id="browser">
<datalist id="browsers">
<option value="Edge">
<option value="Firefox">
<option value="Chrome">
<option value="Opera">
<option value="Safari">
</datalist>

Bootstrap 4 - Assign placeholder to <select> form input

I've searched a bit but the found solutions here on SO seems not working for me. I have a select input field and I want to assign it a placeholder. I'm using bootstrap 4 and to manage the front-end.
As I understand from the documentation I need to assign the selected hidden or selected disabled to the <option> tag I want to use as placeholder. I've tried but didn't worked.I don't know if this is because I'm using vue.js, is there a fix?
<label>Filter List</label>
<select
class="form-control"
v-model="listFilter"
v-on:change="filterList()"
>
<option value="" selected disabled class="text-hide">Select filter</option>
<option value="a">All</option>
<option value="f">Fe</option>
<option value="m">Mas</option>
<option value="s">Tru</option>
<option value="c">Cou</option>
</select>

Custom Dropdown or select box using CSS

<select>
<option value="1">One</option>
<option value="2">Two</option>
<option value="3">Three</option>
</select>
this is a normal select box in which when we select one, its value changes to One. But let me know is it possible to set value 1 when I select one
like the image shown down
I think here we set +297 as the value for the option Aruba
You can also suggest any other alternative way to do so

overriding ubercart's way of displaying attributes options selection (drupal)

I found a problem with ubercart for Drupal and I am trying to find a workaround. I would like to display the options of an attribute as radio buttons by default instead of a select box. The problem with ubercart is that there is a way to set the default by setting it at admin/store/attributes/ but it is always overriden at the product level. So the content uploader has to select radio buttons for every product.
The work around I would like to implement is with hook_form_alter or similar. But I am struggling at finding the right function to override. If it can be of any help, here is the source code of the select box:
<div class="attribute attribute-1 odd">
<div id="edit-attributes-1-wrapper" class="form-item">
<label for="edit-attributes-1">
Color:
<span class="form-required" title="This field is required.">*</span>
</label>
<select id="edit-attributes-1" class="form-select required" name="attributes[1]">
<option selected="selected" value="">Please select</option>
<option value="7">Black | 000000</option>
<option value="6">Blue | 5E79A4</option>
<option value="5">Red | C33438</option>
</select>
</div>
</div>
This was fixed in Drupal 7/Ubercart 3. Have you tried deifining product classes and the defaults for that class. Your default options may stick when adding a product under a class.

ASP .NET Reques.Form DropDownlist strange behavior

I have an issue getting the selected value of a dropdownlist.
My view source looks like this:
<div class="editor-field">
<select class="list" id="DivisionesLists" name="DivisionesLists">
<option value=""> -- Seleccione -- </option>
<option selected="selected" value="1">COORPORATIVO</option>
<option value="2">MANUFACTURA</option>
</select>
</div>
And my controller:
string s = Request.Form["DivisionesLists"];
The problem is that Request.Form["DivisionesLists"] returns "1,1" instead of just "1" (which is the actual selected value of the dropdownlist).
What may be happening?
Thank you!!!
It might also be posting some additional data, what happens if you select the first one, what does it post back? Does it post anything back with a comma?
It could be a duplicate control... though like Html.CheckBox action method: it renders the checkbox control and a hidden field that represents the value when the checkbox isn't there; accessing the value when its checked is true,false.
HTH.
If the select isn't a multiple select I think you have another control (input or select) that have the same name attribute on the page.

Resources