in my controller, is set the two scope variables "otherscope" and "options".
otherscope: {"ID":"1", "VAL1":"X", "VAL2":"Y", ...}
othersope.ID is the value, which should be the selected one. it contains 1 object
options: [{"ID":"1", "TEXT":"Sometext"}, {"ID":"2":"Sometext2"}, ...]
options.ID are the available options to compare with otherscope.ID. it contains about 50 objects.
it works, but it take about 10 seconds to render. is this the correct way to set the selected value?
<label class="item item-input item-select">
<div class="input-label">
Options
</div>
<select ng-model="otherscope.ID">
<option ng-repeat="option in options track by option.ID" value="{{option.ID}}">{{option.TEXT}}</option>
</select>
</label>
change options to option in ng-repeat
<option ng-repeat="options in options track by option.ID" value="{{option.ID}}">{{option.TEXT}}</option>
should be:
<option ng-repeat="option in options track by option.ID" value="{{option.ID}}">{{option.TEXT}}</option>
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>
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 ???
So here is the deal, im getting different objects from ajax request ($scope.productos - $scope.ofertas) and then using ng-foreach for both to show them so user can select multiple items (stored in $pedidoForm.productos and
pedidoForm.ofertas) and this selected items dinamically show up below with another ng-repeat showing the 'nombre' property and adding another new property and value with input but the atribute VALUE is automatically converting any object into a string, resulting in a "{property: value}" so i cant read the property correctly
<div class="row">
<span>Productos</span>
<select class="selectpicker" ng-model="pedidoForm.productos" ng-change=parse(pedidoForm.productos) multiple>
<option ng-repeat="producto in productos" value="{{producto}}"> {{producto.nombre}}
</option>
</select>
</div>
<div class="row">
<span>Ofertas</span>
<select class="selectpicker" ng-model="pedidoForm.ofertas" ng-change="test(pedidoForm)" multiple>
<option ng-repeat="oferta in ofertas" value="{{oferta}}"> {{oferta.nombre}} </option>
</select>
</div>
as I understand you need to select an object, but HTML5 select tag supports only string values. So, try to use ng-options directive:
<div class="row">
<span>Productos</span>
<select class="selectpicker"
multiple
ng-model="pedidoForm.productos"
ng-change="parse(pedidoForm.productos)"
ng-options="producto as producto.nombre for producto in productos track by producto.nombre">
</select>
</div>
<div class="row">
<span>Ofertas</span>
<select class="selectpicker"
multiple
ng-model="pedidoForm.ofertas"
ng-change="test(pedidoForm)"
ng-options="oferta as oferta.nombre for oferta in ofertas track by oferta.nombre">
</select>
</div>
plunker: http://plnkr.co/edit/jl1cayWXif7fukQRviTw?p=preview
The ng-options get asynchronous . How can I set the default value?
<select class="form-control"
ng-options="item.id as item.value for item in mInsu.INS_MAX_AMOUNT track by item.id"
ng-model="custInfo.mInsu.selAmount" required>
</select>
I tried to do like this:
<select class="form-control" ng-model="custInfo.mInsu.selAmount" required>
<option ng-repeat="item in mInsu.INS_MAX_AMOUNT" value="{{item.id}}">{{item.value}}</option>
</select>
Luckly, it can meet my requirement.
So, why can't set default value in asynchronous ng-options?
Add the below lines in your controller:
$scome.custInfo.mInsu.selAmount = mInsu.INS_MAX_AMOUNT[0].id;
which assigns the first value as default.
I have a select element with ng-options to populate options and <option value="">Select</option> as a static default option. I want to show another item in options list - Other, if selected, renders a textbox for user to enter other value. I tried adding another static option with value="-1" but it didn't work.
I would try following:
<div ng-init="arr = [{name:'A', val:1},{name:'B', val:2},{name:'C', val:2}]">
<select ng-model="v">
<option ng-repeat="o in arr" value="o.val">{{ o.name }}</option>
<option>Other</option>
</select>
<input type="number" ng-model="otherval" ng-show="v == 'other'"/>
</div>
or,
<div ng-init="arr = [{name:'A', val:1},{name:'B', val:2},{name:'C', val:2}]">
<select ng-model="v" ng-options="o.val as o.name for o in arr.concat([{name:'Other',val:'other'}])">
</select>
<input type="number" ng-model="otherval" ng-show="v == 'other'"/>
</div>