I'm using Angular $resource and having a simple form with some inputs and a multiple select, for example:
<select ng-model="item.selectedItems" multiple>
<option value="bla">Bla</option>
<option value="bla2">Bla2</option>
</select>
Now when I selected all the items in the multiple select and do item.$save in my code on submit, the url called is
http://domain.com/api/items?field1=text&selectedItems=bla&selectedItems=bla2
However, I want this url to be
http://domain.com/api/items?field1=text&selectedItems[]=bla&selectedItems[]=bla2
just like I was having with a regular
<select name="selectedItems[]">
Does anyone know how to do this? Using ng-model="item.selectedItems[]" didn't work.
I'm using Slim Framework as backend and it just replaces the selectedItems parameter with the last in the url.
Related
Im creating angularJS app with a list of items. I've implemented filtering of the list successfully, but I can't find out the way how to apply it by default. What I mean is that I want to display filtered list by default and users to be able to see the full list if they want.
I've tried selecting option by default but this doesn't trigger filtering at all despite it is selected.
my filter looks like this:
<select ng-model="query.status" ng-click="setItems()" class="form-control">
<option value="">All tasks</option>
<option value="0" ng-selected="true" selected="selected">Todo</option>
<option value="1">Done</option>
</select>
setItems() Function is used for pagination only so it doesn't have any affect on filtering itself
is query.status responsible of filtering your list ?
In that case init it to the value you want the list to be filtered by.
I am trying to ensure a user selects a value from a select box before submitting the form.
This works correctly with static options; it however fails when populating the options via a model using ng-options
Examplehttp://plnkr.co/edit/wRqSCNskLo5c48jy4nQf
I am using AngularJS 1.2.9
Thank you in advance.
In your example changing the data bound select to the following fixes the required directive. I'm not sure why exactly.
<select ng-model="selectedValue1" ng-options="opt for opt in ['Mazda2','Maxda3']" required>
<option></option>
</select>
You can also try ng-required="true" (it works on the latest AngularJS, not sure for 1.2.x).
<select ng-model="selectedValue1" ng-options="opt for opt in ['','Mazda2','Maxda3']" ng-required="true"></select>
I'm trying to display different server's id in a custom selectpicker. The selectpicker works fine if the options tag are "hard coded" but not when I try to retrieve them from a json file (the json is good since the same works with a table in the same page).
Working:
<select id="bs3Select" class="selectpicker show-tick form-control" multiple data-live-search="true">
<option>cow</option>
<option>bull</option>
<option class="get-class" disabled>ox</option>
</select>
Not working:
<select ...ng-model="selected" ng-options="project.idproject as project.idserver for project in projects">
<option value="">-- YON --</option>
</select>
The weird thing is that for each hard-coded option in the second case (like "--YON--" here), when I click it, the server's id corresponding (meaning, if I have two options, the second server id in my json is corresponding to the second option) is displayed in the select!
I tried quite every syntax I have seen on the web but still not working...
Someone has an idea?
I've made a simple plnkr for you http://plnkr.co/edit/2SbSwL05nx5Ta8KevEDC?p=preview
that is working, can you maybe post a sample of that JSON is it object of objects or array of objects?
I need to use angular-chosen to customize a drop-down of groups for a project. I use resource to share the data between the controllers. I am able to extract the group list to
$scope.allgroups of my controller. The console.log shows me this image :
In my html, I do call the select in the following way but It always shows "No Group Found.." even with matching characters.
<select
chosen multiple style="width:150px;" id="newusergroups"
class="groupselect" title="Groups"
allow-single-deselect="true"
data-placeholder="Select Group.."
no-result-text="No Such Group.."
ng-model="selectedgroup"
ng-options="pergroup.name for pergroup in allgroups">
<option value=""></option>
</select>
Anywhere I am wrong? Please help.
If the screenshot shows the console.log of allgroups, then your ng-options should be ng-options="pergroup.name for pergroup in allgroups.result", OR allgroups = $myResource.result.
I am using Select2 with its angular interface for a select form like
<select ui-select2 ng-model='thing' data-placeholder='Options' id='form1>
<option value=''></Option>
<option value='1'>Option 1</Option>
<option value='2'>Option 2</Option>
In my controller, I have the line
$('#form1').select2();
to enable Select2. However, when I run this, I get the error
query function not defined for Select2 s2id_form1
and nothing shows up in the input box. I've tried to put in a query function in the initializer, but nothing is working. When I do define a query function, like
$('#form1').select2({query: function (query) {return 0;}});
It says that I can't put a query option in a select form. How can I fix this error?
Well you're bypassing the AngularUI Select2 code by invoking $('#form1').select2() - that's just the regular jQuery select2 method.
You want to setup your select2 options within an object scoped to your controller
$scope.select2setup = {...}
Then in your html
<select ui-select2="select2setup"....>
It's all pretty well documented # https://github.com/angular-ui/ui-select2