When I try to click edit on a page view, it displays the values as editable. One property, device.exists is a boolean, but when the original value is false and when I click edit, the first option true still displays. How would I make the selection option reflect the original value of the model?
<select ng-model="device.exists">
<option value="true">true</option>
<option value="false">false</option>
</select>
P.S. I didn't use ng-value because it is not available to Hawtio's AngularJS version 1.1.5 which I am using.
Related
I Have used below line of code for multi selection. I am trying to multiselect on one entity but as soon as the scope is passed on to the next entity, the elements that I have selected in first entity gets unselected-
enter image description here
This is working fine on previous versions of chrome but not in 95.0
This is breaking because you're setting ng-model to the same property that ng-options is using. So the moment you select something, abcDTO.SelectionTypes gets reset to whatever you selected. ng-options and ng-model should never be set to the same property. Has nothing to do with the Chrome version.
Here's an example of it working once you change ng-model to something else.
<select
multiple="multiple" ng-multiple="true" rows="10" size="4"
ng-model="abcDTO.Selection"
ng-options="x.SelectionID as x.SelectionDesc for x in abcDTO.SelectionTypes">
</select>
<select ng-model="model.typeId" ng-show="AllowToChangeType(model)"
ng-options="item.value as item.text for item in model.types">
</select>
The issue is that when the user clicks Save button, the form is regenerated to non-editable mode, AllowToChangeType() returns false, and as this <select> becomes hidden, model.typeId gets set to null. Then, if the user clicks on Edit again, this <select> is regenerated, but nothing is selected in it, although the data has been saved correctly. Ideally, the <select> should show the saved value. How to solve this issue?
I think you are making some incorrect assumptions. ng-show does not remove the model value when the element is hidden, as this plunker proves: https://plnkr.co/edit/knnLRZcHdQukGawU8iyJ?p=preview
ng-show/ng-hide do not regenerate DOM elements, they simply change visibility property
I want to add mouseover event to every option and make an ajax call and dynamically add few more options as a sub options to that option.
How can I achieve this ?
<select>
<option ng-mouseover="someFunction()"></option>
</select>
This isn't working for me. that 'someFunction' on scope is not getting called. Is the ng-mouseover not wokring or you can't add events to option tag ?
I was trying to use checkbox and bind the checked attribute using ng-checked attribute but its not working where as its working fine with ng-model attribute with checkbox type inputs.
<!-- not working -->
<input type="checkbox" name="checkedBox"
id="checkedBox11"
ng-checked="isChecked">
<!--working-->
<input type="checkbox" name="checkedBox"
id="checkedBox21"
ng-model="isChecked">
I have created a jsbin to demonstrate the same:
here
Since you are not connecting the checkbox with a model in the first case, it is not getting changed in angular and hence the value is not changing in the view also.
However,in the second case, you have attached the isChecked to the checkbox, the changes are reflecting.
Update: If you change the default value of isChecked to true, it shows true and the checkbox is also checked on load.
Changing the first input to have model, changes it. You could also use ng-click to change the value. (addming ng-model="isChecked")
<input ng-model="isChecked" type="checkbox" name="checkedBox" id="checkedBox11" ng-checked="isChecked">
Or you could add ng-click="isChecked=!isChecked"
to the checkbox
how to get value of checkbox when checked? My problem is I alrdy had a ng-model for other stuff in my <input>
http://plnkr.co/edit/wyTRa8FVkGaEPX6BgYXb?p=preview
I want to collect the data so that when user clicked submit, I can get the value of checked checkbox.
You need to use ng-model and ng-true-value to track what you have selected.
Declare an array to track values
$scope.selectedValues=[];
Then use the following bindings
<input ng-show="showC || checked" type="checkbox" id="{{$index}}" ng-model='selectedValues[$index]' ng-true-value='{{item.name}}'>
See my updated plunkr http://plnkr.co/edit/KWh5CzZa3OcqKjjhocDz?p=preview