I have a requirement where I need to show the text of angularjs dropdown (Not value) in the title tag of the dropdown box. My angular code is like this :
<select id="inputID" name="inputName"
ng-options="item.value as item.display for item in genders"
ng-model="model.Base.currentRecord.value.Code.value" class="form-control input-sm">
<option value="">Select...</option> </select>
As the dropdown is being generated dynamical, the value of the options and the text in the options are different. in the title tag I am able to get the value with title={{model.Base.currentRecord.value.Code.value}} but I need text not the value.
anyone has any idea ?
Would this work? demo
<select id="inputID" title={{model.Base.currentRecord.value.Code.display}} name="inputName" ng-options=" item.display for item in genders"
ng-model="model.Base.currentRecord.value.Code" class="form-control input-sm">
<option value="">Select...</option>
</select>
<strong>Selected value:</strong> {{model.Base.currentRecord.value.Code.value}}
Related
I'm working on angularjs and I have a field that has two options YES/NO.
When someone will fill this field I need to show the two options but non of them is selected. So it will look like an empty value, but this empty value should not be an option. I tried to add <option value="?"></option> in the following code, but then the empty value is an option.
Any ideas?
<div class="col-md-3" ng-if="obj.options.length > 0">
<select class="form-control" ng-model="patientReportedSymptomsUI[key]" ng-disabled="$root.newVisit">
<option value="?"></option>
<option ng-repeat="option in obj.options">{{option}}</option>
</select>
</div>
Is it possible to add an icon to an option in a dropdown based on if it matches a certain setting from the data returned in an ng-repeat?
I have the following select and the options within that select are created via an ng-repeat that is going off of the data records pulled back from the database.
<select id="playListOpt" class="form-control"
ng-model="playlistItem.selectedObjectId"
ng-change="resetModal()" ng-required="true">
<option role="option" value="0" selected>
#Resources.L_LMS_ActDetails.CreateNewPlaylist
</option>
<option role="option" ng-repeat="playlistItem in playlistDataForActivity"
value="{{playlistItem.Id}}">
{{playlistItem.Name}}
</option>
</select>
As it loops over the playlistDataForActivity is it possible to find the item that has IsDefault = 1 and add an icon next to that option?
This works by changing the color of the option that is set to 'Default' by using the ng-style attribute. What's the best way to add a FontAwesome icon?
<select id="playListOpt" class="form-control"
ng-model="playlistItem.selectedObjectId" ng-change="resetModal()"
ng-required="true">
<option role="option" value="0">
#Resources.L_LMS_ActDetails.CreateNewPlaylist
</option>
<option role="option" ng-repeat="playlistItem in playlistDataForActivity"
ng-style="playlistItem.IsDefault && {'color' : 'red'}"
value="{{playlistItem.Id}}">
{{playlistItem.Name}}
</option>
</select>
i ust use ng-options in a select element in angular js. and in select select i just wants to add a extra options at the beginning of options.my code ===>
<div class="form-group">
<select class="form-control select2" ng-options="(o.fullName+' ('+o.email+')') for o in SubTeamUserList track by o.id" name="SelectedUserList" ng-model="SelectedUserList" multiple data-placeholder="Search By User" style="width: 100%;">
<option value="" disabled>Select A User</option>
</select>
</div>
that is not working for me ? i dont know why.then i search on net and found some solution like =>
angularJS - add a Static option with ng-options
Add two extra options to a select list with ngOptions on it
Angular ng-options - Is there a way to add an option when the model contains a value not present in the options list?
after see above solutions i tried =>
<div class="form-group">
<select class="form-control select2" ng-options="" name="SelectedUserList" ng-model="SelectedUserList" multiple data-placeholder="Search By User" style="width: 100%;">
<option value="" disabled>Select A User</option>
<option ng-repeat="(o.fullName+' ('+o.email+')') for o in SubTeamUserList track by o.id">{{(o.fullName+' ('+o.email+')')}}</option>
</select>
</div>
after doing this this is also showing something like =>
but that is also not working for me i dont know why? can anybody help me ???
This Is my select tag. i want to make this As editable.
if possible change this as Input text.
here my ng-model is object showing as list.productcode.
<select class="default form-control" ng-options="list.productcode for list in getproductList" ng-model="list"></select>
please help how to change this.
This may help you
datalist
is the html5 tag
<input type="search" ng-model="txtModel" list="list" />
<datalist id="list" ng-model="list">
<option data-ng-repeat="data in list" value="{{data.ColumnName}}">
</option>
</datalist>
Note ColumnName is the Name of Column you can use
I'm trying to do something like this
but instead of having alert boxes just having comma separated values in the input feild.
Ok I'm trying ui-select2 but I'm not very clear about how to use it. I will provide samples of what I have as a working typeahead and what I have done to try to get the select2 to work.
ui-bootstrap typeahead:
<input type="text" ng-model="selectedItem.value" typeahead="item.value for item in items |filter:$viewValue| limitTo:8" typeahead-on-select="updateItem()" placeholder="select Item"/>
ui-select2 (can't load data.)
<select ui-select2 ng-model="selectedItem.value" data-placeholder="Select Item">
<option value=""></option>
<option ng-repeat="item.value for item in items" value:"{{item.value}}>{{item.label}}</option>
</select>