My app is on an older version of Kendo UI ~V2014.
I need to create a drowdown list with a tree view which this version of kendo does not support.
I'm trying to determine what kendo css classes to apply to get my select element to look similar to the other drop downs on my site.
```
<select class="k-widget k-dropdown-wrap k-header">
<option value="" selected disabled hidden>- Select -</option>
<optgroup label="Swedish Cars">
<option value="volvo">Volvo</option>
<option value="saab">Saab</option>
</optgroup>
<optgroup label="German Cars">
<option value="mercedes">Mercedes</option>
<option value="audi">Audi</option>
</optgroup>
</select>
```
After further investigation I've determined this is not practical to do.
The Kendo drop-down module is built using spans not a select element, therefor the styles and behaviors do not exactly translate.
An alternative is to use two cascading drop-downs.
Related
i have a laravel project. i am using vuejs on that project.i have used select tag on my project.and inside select tag i have used two optgroup tags.but inside vuejs template if i use two optgroup tags it only showing the first optgroup tag label.it's not showing the second optgroup tag label or the option tag output.
how should i do it or any alternative way to get the same result?
<select>
<optgroup label="1st labael">
<optgroup label="2nd label">
<option> some option </option>
</optgroup>
</optgroup>
</select>
optgroup has only one level in selects
That means you can insert it only like
<select>
<optgroup label="1st label">
<option> some option </option>
</optgroup>
<optgroup label="2st label">
<option> some option </option>
</optgroup>
</select>
In alternative ways, you can use the custom select's packages like Vue Select
The application under text includes these option tags:
<option value="0" selected>Page 1</option>
<option value="1">Page 2</option>
<option value="2">Page 3</option>
etc.
Using Robot Framework, I would like to create a locator to find the option tag that contains or ends with "selected"
So far I've not been able to get one to work.
XPath for the selected option above is:
//*[#id="sfpagingation-dropdown"]/option[1]
CSS for same selcted option is:
#sfpagingation-dropdown > option:nth-child(1)
Maybe it's not possible?
Thanks for any assistance.
Figured it out, or at least, I have something that seems to be working:
${SELECTED}= xpath=//option[#selected=""]
"Wait until page contains element" is also necessary
How to implement multi checkbox drop down without any third party libraries.
We want a dropdown having checkboxes not in jquery and javascript. we want pure server side control
.
Pure server side control means you will only rely on the HTML standards.
The HTML Select element has a multiple attribute which lets the user choose multiple values.
The HTML specification doesn't require a specific rendering layout which lets the browser free from any constraints. Most of the time, selected options are simply hightlighted, plus the multiple attribute makes the select element to loose its dropdown looking style (you can reduce its height using the size attribute).
<!-- The second value will be selected initially -->
<p>Maintain <kbd>Ctrl</kbd> key down to select multiple elements</p>
<select name="multi" multiple size="2">
<option value="value1">Value 1</option>
<option value="value2" selected>Value 2</option>
<option value="value3">Value 3</option>
<option value="value4">Value 4</option>
<option value="value5">Value 5</option>
<option value="value6">Value 6</option>
<option value="value7">Value 7</option>
<option value="value8">Value 8</option>
<option value="value9">Value 9</option>
<option value="value10">Value 10</option>
</select>
If you change your mind about using Javascript, you could implement what this well detailed answer suggests as it requires just very few additional Javascript and css and but no library.
HI i need something unusual , i want like
if my product has more than one option value
than it should show in dropdown
otherwise if it has only one option value
than i need to show without dropdown or as a text only.
Please suggest me how can i do this.
like like if
<select name="select_box" id="select_box">
<option value="one">1</option>
<option value="tow">2</option>
<option value="three">3</option>
<option value="three">4</option>
<option value="three">5</option>
<option value="three">6</option>
</select>
the dropdown has more than one opton than i need to show the above dropdown and if the
<select name="select_box" id="select_box">
<option value="one">optionname only</option>
</select>
dropdown has one option than i need to show optionname only as a text.This will not be a require field.
3-4 files are included in this process.
You can see that by enabling "Template path hints" from admin->settings->advanced->developer.
anyway check these files
if its a dropdown the you can change in this file (Remember do changes in your theme not in base)
frontend/base/default/template/catalog/product/view/options/type/select.phtml
Another files in this process(check xml)
frontend/base/default/template/catalog/product/view/options/wrapper.phtml
frontend/base/default/template/catalog/product/view/options/js.phtml
frontend/base/default/template/catalog/product/view/options.phtml
Another way:
Goto
App/code/core/Mage/Catalog/Block/Product/View/Options/Type/Select.php
here find getValuesHtml() and check the code and edit as per your need
(DO NOT EDIT CORE FILES ALWAYS OVERRIDE FOR EDITING PURPOSE)
I'm using Magento version 1.5.1.0. I added an attribute with the following options selected in the Properties tab:
Catalog input type for store owner: dropdown
Unique value: no
Values required: no
I then went to the Manage Label/Options tab and added 3 different options, selecting the first option as a default. I added it to an attribute set, and when I go to enter a product, I see the dropdown, but with an empty option value prepended to it:
<select>
<option selected="selected"></option>
<option>Option 1</option>
<option>Option 2</option>
<option>Option 3</option>
</select>
When I save the product, the empty option still remains selected. How do I remove that empty option and make Option 1 the default for all of my existing products without resorting to using JS or editing any files whatsoever?
I think this can help.
When you call getAllOptions you need to pass false.
->getAllOptions(false)
Magento attribute dropdown with first empty value
<select name="history[status]" class="select" id="history_status">
<option value="pending" selected="selected">Pending</option>
<option value="canceled">Canceled</option>
<option value="processing">Processing</option>
</select>
Try using the SELECT tag rather than option for this block. Here above I have an example taken from a Magento store. Your:
<option selected="selected></option>
Is exactly that. An option, rather than defining a select box.