FAQ Database Discussion Community


Binding Select Option to Model Angualr

c#,angularjs,ng-options
After debugging it seems that the status object is getting bound to my model. But I need to bind the string to my model. $scope.Statuses = [ {name:'Not Started', value: 'Not Started'}, {name:'In Progress', value: 'In Progress'}, {name:'Completed', value: 'Completed'} ]; <select class="form-control" ng-model="counterMeasure.Status" ng-options="status.name for status in Statuses"></select> ...

How do I use ngOptions with a string that contains HTML entities?

javascript,html,angularjs,angularjs-directive,ng-options
I'm using ngOptions to built a selection menu but one of my labels has an HTML entity in it &amp;. The label shows up as Books &amp; Stuff not Books & Stuff. My jade is this: select(ng-show="isType === 'select'", id="{{id}}", ng-model="model", ng-options="o.id as o.label for o in options") How can...

AngularJS ng-options

angularjs,angularjs-scope,ng-options,angularjs-ng-options
I have this select in AngularJS: <select id="objectId" name="seccionId" class="form-control" ng-model="arguments.seccion" data-ng-options="item.id as item.valor for item in arguments.objects" required></select> I like to save both values in scope, but I only save one value. Any form to save both values? Thanks!!!...

How to add HTML entities in Angular select with ng-option

javascript,angularjs,select,html-entities,ng-options
My question is somehow related to this answer, although slightly different. What I would like to achieve is to get HTML entities parsed from a string passed to a select with ng-options. So given these data: $scope.myOptions = [{ text: '10.00 &euro;', val: 10 },{ text: '25.00 &euro;', val: 25...

Cannot bind ngResource to ngOptions

angularjs,ng-options,ngresource
I have a select element, and I want it populated with the result of a call to a resource via ngResource. <select chosen="" required data-ng-model="coolStuffSelected" data-ng-options="stuff for stuff in coolStuff" class="chosen-select input-md"></select> In my Controller I have CoolStuffResource.query(function(result){ $scope.coolStuff = result; console.log(JSON.stringify($scope.coolStuff)); // prints ["foo","bar","gaz","waka"] }); I see the result...

what is best practice for Angular drop down menu & ng-option

javascript,angularjs,drop-down-menu,ng-options
good day, i created a drop dow menu on AngularJS. but it return to me an object not an item {"deptName":"IT","id":"1"}. i need to return the id only to my table. is there any thing i need to change on ng-options="item.deptName for item in department.departments" see the sample: JS angular.module('firstApp',...

ng-options filter by value in another dropdown

angularjs,angular-ngmodel,ng-options
This seems to be a really straight forward code, but I cannot figure out why it is not working. I want to filter the 'model' dropdown by selected 'make', Make: <select ng-model="makeng" ng-options="option.display for option in makes"> <option ng-disabled="true" ng-selected="true" value="">Select a make</option> </select> Model: <select ng-model="modelng" ng-options="option.display for option...

AngularJS doesn't update selected option

angularjs-scope,ng-options,angularjs-ng-options
I have the following problem. In my controller I have this variables: $scope.types = [ {id: 0, name: $translate.instant("FIRST")}, {id: 1, name: $translate.instant("SECOND")}, {id: 2, name: $translate.instant("THIRD")}, {id: 3, name: $translate.instant("FOURTH")} ]; $scope.itemtype = {}; $scope.itemtype = $scope.types[0]; In my view I have this select <select class="form-control" required ng-model="itemtype" ng-options="item...

How do I set ng-option model to the value of an object?

javascript,angularjs,ng-options
I'm pulling in an array of objects as $scope.templates. I'd like to be able to set $scope.item.steps (my select model name) to the value of template.steps for the selected option in my ng-options array. Is there an easy way to do this without having add extra controller logic? <select class="form-control"...

Select not selecting when binding with ng-model and ng-options

javascript,angularjs,select,angular-ngmodel,ng-options
Here's my select: <select class="form-control" ng-options="assistanceType as assistanceType.name for assistanceType in assistanceTypes" ng-model="selectedRecord.assistanceType"></select> Here's what I'm using to load the Assistance Types: $scope.getAssistanceTypes = function () { $http.get('/api/assistanceType/getAll'). success(function (data, status, headers, config) { $scope.assistanceTypes = data; }). error(function (data, status, headers, config) { alert(data.ExceptionMessage); }); } Here's the result:...

Bind ng-options to nested array within JSON object, within ng-repeat

json,angularjs,angularjs-ng-repeat,ng-repeat,ng-options
This is my first question, so please be gentle on me! I hope you can help. I am trying to define a select box (dropdown) within my HTML view using ng-repeat, so that I can create a select for each item in an array. I have successfully achieved this, but...

Angular ngRepeat multiple select fields without displaying already selected data through ng-options

javascript,angularjs,angularjs-ng-repeat,ng-options
So the overview of the problem; I am retrieving data from an api and creating a CRUD page for it. The data has a set of labels that the user can select. Below is a code sample representing my problem. The labels selected by the user are represented by the...

AngularJS: ng-options “non-choice” is not the top

javascript,angularjs,ng-options
I made my select tag directive of the private use template html <div> <select ng-model="model" ng-options="item as item[labelName] for item in array"> <option ng-if="!!hasTop" value="">non choice</option> </select> </div> "array" is return value of $recource.query With "non choice" in the top, I want to have. ex Select +-"non choice" +-option a...

How to assign selected option's text to another model while using ng-options?

javascript,angularjs,select,model,ng-options
I can create a select tag and place data inside it. I can assign that select's selected option to a model but can't assign its text to another model. Here is example below and jsFiddle link html: <div ng-app> <div ng-controller="DemoCtrl"> <select ng-model="customerId" ng-options="item.id as item.name for item in content"...

Angular multiple ng-options parent / child

javascript,angularjs,ionic-framework,ng-options
I have a number of select input children thats data changes depending on the parents selection. Please see this Codepen for the type of data that will form my parent child relationship. My starting piece of code is here: Controller $scope.params = ['Sets', 'Reps', 'Colour', 'Time', 'Weight']; $scope.children = [{...

Hide selected option in other list using ngOptions in AngularJS

javascript,arrays,angularjs,ng-options,angularjs-ng-options
Hoping someone can help with this challenge. I have 1 array of airports being used in two build separate dropdowns. <select data-ng-model="flightData.origin" data-ng-options="airport.code as airport.label for airport in flightData.airports" name="origin"></select> and <select data-ng-model="flightData.destination" data-ng-options="airport.code as airport.label for airport in flightData.airports" name="destination"></select> Both of these lists obviously have the same options....

ng-options default value from external json file

angularjs,ng-options
I have a select data-ng-model="layout" ng-options="layout.url as layout.name for layout in layouts" populated from an external json file: { "metaDescription": "My website description", "metaKeywords": "keyword1, keyword2", "siteTitle": "My Company", "pageTitle": "Welcome ", "layout": [ { "name": "Cerulean", "url": "cerulean" }, { "name": "Cosmo", "url": "cosmo" }, { "name": "Cyborg", "url":...

Angularjs select value is undefined

angularjs,select,ng-options
Now I am trying to get the value from select dropdown, but it return undefined. The thing is in html level it works as expect, Here is my code: <div class='subcontent'> <input id="me" type="radio" class='choosemethod' ng-model="paymentmethod" value="Y"><label for="me" class='choosemethod'>Me</label> <input id="company" type="radio" ng-model="paymentmethod" value="N" class='choosemethod'><label for="company" class='choosemethod'>My Company</label><br/> <span class='helptext'>Who...

Filter results in angularjs based on select value

angularjs,angularjs-ng-repeat,ng-options,angular-filters
This seems like it should be easy but I am new to angular and not grasping this concept very well. I am hoping to run an ng-repeat over a dataset and then be able to filter the results based on a selected option in a select box, using the exact...

AngularJS adding incremental numbers to a select list

javascript,angularjs,angular-ngmodel,ng-options
I want a select box where I can choose from a list with a min/max number. Currently my number is just 1 to 10 so I have the below. <body ng-app="demoApp"> <div ng-controller="DemoController"> <select ng-model="selectedItem" ng-options="opt as opt for opt in options"> </select> The value selected is {{ selectedItem }}....

Object comparison in ng-options

angularjs,ng-options
I have a select that I populate using ng-options and ng-model. The problem I have is that initially, the model is a copy of the data within the ng-options so my initial state is a blank option rather than the correct state of ng-model. How can I make it so...

AngularJS ng-options from an object with objects

angularjs,object,ng-options,angularjs-ng-options
I am attempting to have my data show up in the list as follows: <option value="4351">Atlanta</option> Here is my object. $scope.cityList = { 4351:{name:"Atlanta", short="atlanta"}, 7355:{name:"Baltimore", short="baltimore"}, 1212:{name:"Chicago", short="chicago"}, 4398:{name:"Dallas", short="dallas"} }; HTML This worked with just key-value pairs, but now the "value" is an object <select class="select-city" ng-model="myCity" ng-options="name...

Angular.js ng-option select using keypress

javascript,angularjs,google-chrome,ng-options,angularjs-ng-options
I have a <select> populated via ng-options. In a specific case, when two values are adjacent in the ordered model list and the values have the same first letter, the updating of the model value in angular breaks. This may be a browser event issue but I'm not certain. This...

Sorting inside ng-options

angularjs,ng-options
How can i sort the output of my ng-options alphabetical? ng-options="obj.name for obj in objList track by obj.key" I thought this would be the solution: ng-options="obj.name for obj in objList track by obj.key | orderBy: 'name'" But nothing changed....

Showing manually added value as the last option with ngOptions of Angularjs

angularjs,ng-options
I am creating a select input using ngOption. <select ng-model="foo" ng-options="foo.bar for foo in foos"> <option value="">Add New</option> </select> Now It is showing the option as the first option in my select input but I want to show the option as the last option in my input. How can I...

AngularJS remove ng-options blank value

html,angularjs,ng-options
<select ng-model="form.priority" ng-options="priority.id as priority.value for priority in leadPriority"></select> It is showing blank option by default. How can remove it ?...

ng-options not selecting last item in option array

angularjs,ng-options,angularjs-ng-options
I have a weird problem that I'm not able to reproduce on Plunker. When the first option 'user' is set in the model, the select displays it properly and it is set to 'user'. When I load another user with role:'admin', the select is set to blank option. In my...

AngularJS ng-option get index

javascript,angularjs,ng-options,angularjs-ng-options
I'm making a playlist option in the project I'm working on and I'm trying to get a dropdown for all the videos in the list. which is easy <select ng-options="vid.Id for vid in playList.Videos track by video.Id" ng-model="selected" class="browser-default"></select> but this shows a drop down of the Id's, but now...

How to define ng-options selected value and assign this to model?

javascript,angularjs,model,ng-options
I have a data like this which i compile to select options and inside it selected value defined as defaultValue: 1 content: [ { value: "Bireysel", key: "1", defaultValue: 0 }, { value: "Kurumsal", key: "2", defaultValue: 1 }, { value: "Bireysel & Kurumsal", key: "3", defaultValue: 0 } ]...

Bootstrap3 + Angular with Select causes the drop down to cut off

angularjs,html5,twitter-bootstrap-3,html-select,ng-options
I am trying to use the HTML Select tag along with AngularJs using the ng-options directive to create a drop down options menu. On top of this I am using Bootstrap 3. I also have ui-bootstrap imported into the project. Everything works functionally but I have an odd issue where...

Pre-select option form ng-options list

javascript,angularjs,drop-down-menu,ng-options
I'm trying to preselect a item in the list which is generated by ng-options directive. Could someone please tell me whats happening in the plunker? http://plnkr.co/edit/GTnR76HEnB5NxQRe484m?p=preview <head> <script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.0.6/angular.min.js"></script> <script> function MyCntrl($scope) { $scope.prop = { "type": "select", "name": "Service", "values": [{ 'name': "Service 1" }, { 'name': "Service 2"...

using unicode symbols in ngOption to pass to function without needing to change the select?

angularjs,angularjs-ng-repeat,ionic-framework,ng-options
Sorry if this is already answered but I have looked through a lot of questions and just can't get this right. Using angulaJS with the following declaration to create my select from a JSON object. The select creates perfectly and the item is correctly set using the ng-selected option. <select...

send the option object when using angularjs ng-options and ng-change

angularjs,ng-options,angularjs-ng-change
I having an array of objects which I am passing to the ng-options,the array contains objects of currencies in the next pattern: [{ "cur_iso": "ILS", "cur_symbol": "\u20aa", "cur_name_he": "\u05e9\u05e7\u05dc", "cur_rate_in_nis": "1.0000", }, { "cur_iso": "USD", "cur_symbol": "$", "cur_name_he": "\u05d3\u05d5\u05dc\u05e8", "cur_rate_in_nis": "3.8580" }] I am using ng-options to make a select...

orderBy not working properly on ng-options

angularjs,ng-options
everything is working fine, but with an anomaly of 1 month. I want to show months in descending order, ng-options="i as payrollRule.prd_date_display for (i,payrollRule) in payrollRules | orderBy:'-time'" with JSON http://jsoneditoronline.org/?id=5180c8005b1072418925a0f01968bdffenter link description here but as you see in img, only 01 Apr 2014 is coming at 2nd position instead...

Hardcoded values in NG-OPTIONS with dynamic values from NG-REPEAT

angularjs,angularjs-ng-repeat,ng-options
Let's say we have this data and it's being returned by an API $scope.arrayOfStudentObjects = [ { name : 'Ashley', gender : 'female' }, { name : 'Tom', gender : 'male' }, { name : 'Scott', gender : 'male' } ]; Then the values that we put in < select...

Angular ng-options remove blank option and select the first option only

javascript,angularjs,html5,ng-options
I am using AngularJS to populate my select options content dynamically from an array of objects in my controller. My objects has a property named userProfileName. How would it be possible to remove the blank option that I am getting at the top? Also, I would want to select the...

Binding select with ng-options using an array of labels and values

angularjs,ng-options
I for the life of me cannot figure out how to set both the labal and the value of a select using an array I have an array of countries $scope.countries = [ {abbr:"US", name:"United States"}, {abbr:"CA", name:"Canada"},...... ] I want the select to generate as such <select> <option value="US">United...