two values by using checkboxes - angularjs

I have a question:
if I use the checkboxes, I can choose only one value
plunk example
<input type="checkbox" ng-true-value="Korman Juriy" ng-false-value="" ng:model="query.name"/>
or
<input type="checkbox" ng-true-value="Ananchenko Juriy" ng-false-value="" ng:model="query.name"/>
how to get the two values together?

In this case, the best way is to create 2 diferent variables, like "name1" and "name2", instead "name" in both of the checkboxes.
So, in the first line
<input type="checkbox" ng-true-value="Korman Juriy" ng-false-value="" ng:model="query.name1"/>
<input type="checkbox" ng-true-value="Ananchenko Juriy" ng-false-value="" ng:model="query.name2"/>
Hope it helps your propose.

the best of the solutions that I have found:
jsfiddle.net/mattdwen/u5eBH/2/

Related

How to make conditional logic form using AngularJS only?

I have tried using HTML-DOM...but the problem is that they don't seem to be working with radio buttons.
Is there somthing which would help me in this using purely angular?
I have tried many methods but the problem with radio button continues.
please help me find a solution soon..
Toy material:
<input type="radio" name="Ttyp" ng-model="1" value="plastic" required>plastic
<input type="radio" name="Ttyp" ng-model="2" value="wood" required>wood<br><br>
<div ng-show="2">
toy name: <input type="radio" name="Tname" ng-required="2" value="Our Venue">Our Venue
<input type="radio" name="Tname" ng-required="2" value="Your Venue">Your Venue
</div>
<br><br>
edit
https://docs.angularjs.org/api/ng/directive/ngSwitch {may be this could help}

angular 2 - checkbox "checked" depend on function not on property biind

I have a checkbox that needs to be shown as selected depending on a function result instead of binding it to an object property.
This would be easy, but is not possible:
<input type="checkbox" ([ngModel])="category.selected">
And this does not work, as even checked="false" results in a checkbox being displshownayed as selected:
<input type="checkbox" [attr.checked]="isCategorySelected(category.id)"/>
I need an outcome like this
<input type="checkbox">
<input type="checkbox" checked>
depending on the result isCategorySelected(id).
Any help is appreciated.
You cannot use [(ngModel)] in this scenario because it defines a 2-way databind, and you are passing a function.
Instead, you could simple use [ngModel], like the snippet below. This syntax defines a one-way databind.
<input type="checkbox" [ngModel]="yourBooleanFunction()"/>
You can read more about ngModel here.
Let me know if you have any other problem with it.

Validate two number fields by comparing values using ng-form angularjs

<input type="text" ng-model="num1">
<input type="text" ng-model="num2">
I want to compare numbers entered in above fields and generate error message if num1 < num2 using ng-form. We can do with JS but i want to keep validation simple. Can we implement in HTML tag using ng-form
Try something like this:
<div ng-form="regForm">
<span ng-show="num1>=num2">Num1 cannot be greater than num2</span>
<input name="num1" type="text" ng-model="num1">
<input name="num2" type="text" ng-model="num2">
</div>
JsFiddle: https://jsfiddle.net/sktajbir/6fmvsaf0/25/
Hope this will help you. Thanks.

How to add checked class to a radio button in AngularJS

In AngularJS, I'm trying to add/remove a checked class on a parent element, when its child radio button is checked/unchecked.
<label ng-class="{checked: menuType.isChecked0}">
<input type="radio" name="menuType" ng-model="menuType.isChecked0" />Text 1
</label>
<label ng-class="{checked: menuType.isChecked1}">
<input type="radio" name="menuType" ng-model="menuType.isChecked1" />Text 2
</label>
Here is a fiddle: http://jsfiddle.net/fAA2w/
There is no controller or any other relative code. If there is a better way to approach this, please share. This seems simple enough, but I cannot find an answer to this question. What am I doing wrong here?
You need to give the radio input a value.
For more examples see http://docs.angularjs.org/api/ng/input/input%5Bradio%5D.
<div ng-app>
<label ng-class="{checked: isChecked == 1}">
<input type="radio" name="menuType" ng-model="isChecked" value="1" />Text 1
</label>
<label ng-class="{checked: isChecked == 2}">
<input type="radio" name="menuType" ng-model="isChecked" value= "2" />Text
</label>
</div>
This is the correct way to be doing it. Reason being, when your ng-model changes, your ng-class will pick up on that and update the view, the Angular way!

AngularJS: directive(template) does not work in tags?

My task is: group of checkboxes must be checked(all), if checkbox-parent has been checked. Sure, using Angular. OK, what am I doing:
My parent checkbox is gettring the ng-model directive:
<input type="checkbox" ng-model="checked" ng-true-value="checked" ng-false-value="" id=""/> {{filterValue.title}}
Sub-checkboxes are getting the next:
<input type="checkbox" {{checked}} id=""/> {{subNodeValue}}
Trying: no check in the last case, however {{checked}} calculates successfully out of the <checkbox>.
What am I doing wrong ?
UPD:
Sub-checkboxes are created by this:
<ul id="id" class="groupList">
<li ng-repeat="subNodeValue in filterValue.subNodesValues">
<input type="checkbox" {{checked}} id=""/> {{subNodeValue}} {{checked}}
</li>
</ul>
Use the ngChecked directive instead of doing it that way (http://docs.angularjs.org/api/ng.directive:ngChecked). They have a master/slave checkbox example on there too
You can't use {{}} alone inside an element. Use ng-checked=checked instead.
Here is a working plunker: http://plnkr.co/edit/vBftwH4MwkeSiC90AltU?p=preview

Resources