How can i set auto selected value in angularjs - javascript

i am getting a value in json andand want to put that value in selectbox html auto sleceted that in angularjs how can i do this?
Here is my html code
<select class="form-control" name="comregtype" ng-init="users.comregtype" id="comregtype" ng-options="c.name for c in colors" >
<option ng-selected="users.comregtype" ></option>
<option>Company Registration Type</option>
<option>Proprietor</option>
<option>Partnership Firm</option>
<option>LLP</option>
<option>Pvt. Ltd. Co.</option>
<option>Ltd. Co.</option>
</select>
JS: $scope.users = {comregtype:response.comregtype}
i am gettting value in response.comregtype = "LLP"
How can i set this as seleceted value in selecetbox.
if anyone can help .
Thanks

You can do this,
<select ng-model="value" ng-init="value='LLP'" ng-options="mode.value as mode.value for mode in types.RegistrationType">
</select>
DEMO

Related

How to set value in multiple select option in FORM in AngularJS?

Hmtl:
<div class="form-group">
<label for="loaisanpham">Loại Sản Phẩm</label>
<select class="form-control" name="idLoaisp" id="idLoaisp" ng-model="idLoaisp" ng-required=true>
<option ng-repeat="loaisanpham in loaisanphams | orderBy: 'tenLoaisp'" value="{{loaisanpham.idLoaisp}}">{{loaisanpham.tenLoaisp}}</option>
</select><br>
</div>
<div class="form-group">
<label for="phuong">Phường</label>
<select class="form-control" name="idVungxa" id="idVungxa" ng-model="idVungxa" ng-required=true>
<option ng-repeat="vungxa in vungxas | orderBy: 'tenVungxa'" value="{{vungxa.idVungxa}}">{{vungxa.tenVungxa}}</option>
</select><br>
</div>
JavaScript:
document.getElementById("idLoaisp").value = track.loaisanpham.idLoaisp;
document.getElementsById("idVungxa").value = track.vungxa.idVungxa;
Just idLoaisp show value in html and idVungxa not show.
I do not understand why it is not displayed. Help me. Tks all
Assign your value to the $scope in your controller.
$scope.idVungxa = track.loaisanpham.idLoaisp;
In plain HTML5 you would set the option as "selected":
like this:
<select multiple>
<option value="a">a</option>
<option value="b" selected>b</option>
<option value="c" selected>c</option>
</select>
There might be a different way to do it in Angular, but if this helps, you can use
<option [attr.selected]="boolean" ...
Remove the attribute "value" in the html options and set the value to the model, you have ng-model="idLoaisp" and ng-model="idVungxa" in the view so I guess in your controller you have that variables to store the values of the item selected, models are double binding that means you can also set the value to that model.
$ctrl.idLoaisp = track.loaisanpham.idLoaisp
$ctrl.idVungxa = track.vungxa.idVungxa

Angularjs dropdown select value

I have this dropdown
<select class="form-control" ng-model="LoanDetailsVM.PaymentPeriodMonths">
<option value="1">Monthly</option>
<option value="3">Quarterly</option>
</select>
The LoanDetailsVM.PaymentPeriodMonths can be either 1 or 3, but the proper option is not selected when I'm opening the page.
Is there anything else I need to add in order for the correct option to be selected?
You should use [(ngModel)] instead of ng-model and [ngValue] instead of value:
<select class="form-control" [(ngModel)]="LoanDetailsVM.PaymentPeriodMonths">
<option [ngValue]="1">Monthly</option>
<option [ngValue]="3">Quarterly</option>
</select>

How to save name of select option instead of value

I have this code:
$("#subscription").on('change', function(){
$('#plan').val($(this).val());
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<select name="bank_name" class="form-control input-md chosen-select" id="subscription">
<option value="">Choose Bank</option>
<option value="swiftbank1">bank 1</option>
<option value="swiftbank2">bank 2</option>
</select>
<input type="text" id="plan" class="form-control input-md" name="swift">
What it does is add swift code in to the input field, that works fine!
Problem is that when I add data on database then both values is what I choose example I choose bank 1 then both will be saved as swiftbank1 .
I need it to save bank name (bank 1) and swift (swiftbank1) in database.
I understand that value is what it is but is it possible to add name in database instead of value? In this case this value works to be passed from selection to input.
Thanks
You can use .text for getting selected text.
$("#subscription").on('change', function(){
var text = $("#subscription :selected").text();
var value = $("#subscription").val();
console.log(text); // this will print text
console.log(value); // this will print value
//var plan = $('#plan').val(text); // this will change the value of plan
$("#plan").attr("value",text); // this will add the value attribute
$('#plan').val(text); // this will change the value of plan
$('#subscription :selected').val(value);
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
<select name="bank_name" class="form-control input-md chosen-select" id="subscription">
<option value="">Choose Bank</option>
<option value="swiftbank1">bank 1</option>
<option value="swiftbank2">bank 2</option>
</select>
<input type="text" id="plan" class="form-control input-md" name="swift">
try this to get text of selected option
$("#subscription").on('change', function(){
$('#plan').val(this.options[this.selectedIndex].text);
});
Since you will need to pass the value to store in database so a quick way is to keep the value as swiftbank1###bank1
Split the string with ### on server end and store them separately like this:
$selectValue = $_POST['select_name'];
$valueArray = explode("####",$selectValue);
$valueArray[0] will have swiftbank1 and $valueArray[1] will have bank1
use this $('#plan').val($('#subscription option:selected').text());

Get value from select angularJs and Firebase

I am currently working on a CRM in angularJs and Firebase, but I need to get the variable from an ng-repeat such follows
<select class="form-control" id="sel1">
<option value="">--Choose an Account--</option>
<option class="dropdown" value="{{contact.account}}" ng-repeat="account in accounts">{{account.name}}</option>
</select><br />
Controller
$scope.addConct = function () {
var account = $scope.contact.account;
The accounts.name is working fine, it shows all the accounts. How can I get that account string and assign that String to my contact.account?
Thanks in advance.
Just add the ngModel directive to the select field to bind the value to a scope variable:
HTML
<select class="form-control" id="sel1" ng-model="someVariable">
<option value="">--Choose an Account--</option>
<option class="dropdown" value="{{contact.account}}" ng-repeat="account in accounts">{{account.name}}</option>
</select><br />
Controller
$scope.someVariable = '';
$scope.addConct = function () {
var account = $scope.contact.account;
};
Now you can access the value at any time with $scope.someVariable
More information on ngModel

Angular: Conditional field doesn't work with server side

i have a conditional field like this :
<form ng-app="myApp" name="frm">
<select ng-model="NewBranchRequest.BranchTypeCode">
<option selected="selected" value="0">third</option>
<option value="1">first</option>
<option value="2">second</option>
</select>
<input class="ng-pristine ng-valid" type="text" name="power" ng-model="NewBranchRequest.PwrCnt" placeholder="sad" ng-required="NewBranchRequest.BranchTypeCode==0">
<span style="color:red" ng-show="frm.power.$invalid">
*
</span>
<button>Submit</button>
</form>
Demo
it works, but option fill from server and it doesn't work.
UPDATE
Check This Demo which is not working .
All i want is after select Bug in select list, input get rquired .
Any idea ?
In http://jsfiddle.net/sadeghbayan/MTfRD/1452/
change
ng-required="form.type==0"
to
ng-required="form.type=='bug'"
I made the changes here: http://jsfiddle.net/MTfRD/1453/
In addition, if you want to get the json object in form.type you can change this
ng-options='option.value as option.name for option in typeOptions'
to
ng-options='option.value for option in typeOptions'

Categories