i want to use ons-select in my app. and i have added it into my code, then debug the app, but the emulate show nothing. by the way, webstom alert me that 'can not find the ons-select tag'.
so how to use ons-select in onse-ui-1.3.1?
Any help is really appreciated.
The code:
<ons-select ng-model="mediaTypes.type" ng-change="search()">
<option value="all" selected>All Media</option>
<option value="musicVideo">Video</option>
<option value="movie">Movie</option>
<option value="music">Music</option>
<option value="podcast">Podcast</option>
<option value="tvShow">TV Show</option>
</ons-select>
I think what you are looking for is ons.platform.select() method. However it is a new feature added in Onsen 1.3.2 that is currently under development. If you cannot wait until it is released you can use the version in Onsen UI's master branch. Hope it helps!
Edit:
After you updated your code I realised you are looking for something different, not ons.platform.select(). Looks like the tag <ons-select> was removed from Onsen UI. Normal HTML <select> should be enough.
Related
I want to implement searchable select or input autosuggest in my ionic application using react. I searching too many way but did not find any solution. Here is an example what I want.
if you don't have a lot of content, this approach might work?
<input type="text" id="programming_language" list="languages"/>
<datalist id="languages">
<option value="JavaScript"></option>
<option value="Python"></option>
<option value="Java"></option>
<option value="HTML">Stop being a troll</option>
</datalist>
see blog post here: https://dev.to/nialljoemaher/easy-autocomplete-suggestions-for-inputs-with-just-html5-datalist-tag-32j1
guys i am beginner React js.
i want get as it is rest API drop-down list box have to create in react. so how to do it ?
could you guy please give way method
here in react you just working with the front-end so you don't have to worry about the back-end just design you front normally
<select>
<option value="grapefruit">Grapefruit</option>
<option value="lime">Lime</option>
<option selected value="coconut">Coconut</option>
<option value="mango">Mango</option>
</select>
if you want to extract this one as a component and use it somewhere else you need to define a list of value to replace it with your current values anyhow it will be static at the end
plnkr.co/edit/66oHtYqc66BBZQWua5el?p=preview
you can see in the link that its aint working and mark icon is not
showing too
I think you are trying to create a bootstrap multiple select box.
If so, the reason you may be running into issues is because the current class you are using (selectPicker) would be incorrect. Your code should look like this:
<select multiple id="selectpicker" class="form-control">
<option>1</option>
<option>2</option>
<option>3</option>
<option>4</option>
<option>5</option>
</select>
So instead of using the class to target with jQuery, as I believe you are trying to do, use the id value instead. $('#selectpicker')
UPDATE:
I tried using the files you were linking to, but couldn't get them to work (not sure what the issue there was). So instead, I used the cdn links and it seems to be working great now.
Here's a link to the working version: http://plnkr.co/edit/IIvTMLACZHXvhsbRXrkD?p=preview
Ever since I upgraded from AngularJS 1.3.15 to 1.4.8 I'm getting an empty option added to all my select2 uses.
I've tried what is suggested here: Why does AngularJS include an empty option in select?
and in other questions, but couldn't make it work for me.
Here is a plunkr of my issue: http://plnkr.co/edit/zrYCDbtSVHNt3tRZsQza?p=preview
As you can see, an empty option is added, after selecting any of the 2 values there, the empty option disappears.
The relevant HTML:
<select ui-select2 ng-model="cqData.dataObjects.Mode.Value">
<option value="structured" localize>Structured Query</option>
<option value="advanced" localize>Advanced Query</option>
</select>
P.S. I know ui-select2 is deprecated, but its an existing project and I'm unable at the moment to upgrade it.
Try to set default value in controller like this:
$scope.cqData.dataObjects.Mode.Value = $scope.cqData.dataObjects.Mode[0].Value;
Its working fine.
I have a web application to write and in the majority of cases I have a 1 to 1 relationship between objects of Class A and objects of Class B, so I hop from one to the other. Sometimes it is 1 to many, in this case I need to display a popup menu and let the user take a selection from the menu and then I will navigate as if it was 1 to 1.
All this is brand new code so no legacy JavaScript/J Query exists.
I seldom write web code but from I have learnt recently Angular appears to be an architectural correct way to do things instead of writing my own JavaScript I want to use the correct Angular method.
But I need a start point. I was looking for a Angular directive and I can see things like input[email] and input[month] but I cannot see input[dropdown] or input[popup].
Can someone please steer me in the right direction? Thanks.
For dropdowns you want to use html-select. To dynamically add values to the dropdown use ng-options with the html select.
<select>
<option value="volvo">Volvo</option>
<option value="saab">Saab</option>
<option value="mercedes">Mercedes</option>
<option value="audi">Audi</option>
</select>