I have a html table which is binding using Angularjs.Now i want to select checkbox during ng-repeat with a condition.
<tbody>
<tr class="gradeX" ng-repeat="itm in usersList">
<td>
<input type="checkbox"/></td>
<td> {{itm.FirstName}}</td>
<td>{{itm.Email}}</td>
</tr>
</tbody>
I have another field itm.checkstatus.i want to check the checkbox during ng-repeat when itm.checkstatus=1 then checkbox will check else checkbox will not check.how to do this?
You can use ng-checked for this:
https://docs.angularjs.org/api/ng/directive/ngChecked
<tbody>
<tr class="gradeX" ng-repeat="itm in usersList">
<td><input type="checkbox" ng-checked="itm.checkstatus == 1" /></td>
<td>{{itm.FirstName}}</td>
<td>{{itm.Email}}</td>
</tr>
</tbody>
Related
I want to disabled the button Dissolve if the field in the status column is close or vise versa.
I tried applying ng-module n ng- disabled but something went wrong.
If anybody knows how to do it in Angularjs then plz help me out
<table>
<tr>
<th>Ticketid</th>
<th>status</th>
<th>Dissolve</th>
</tr>
<tr>
<td>12345</td>
<td>Close</td>
<td><button>Dissolve</button></td>
</tr>
<tr>
<td>4321</td>
<td>open</td>
<td><button>Dissolve</button></td>
</tr>
</table>
You need to use ng-if and ng-disabled together,
<tr>
<td>4321</td>
<td>open</td>
<td ng-if="status ==='close'"><button ng-disabled="true">Dissolve</button></td>
</tr>
Attached is my code, tried showing td data when the condtion of ng-if is true
<tbody>
<tr ng-repeat="fellow in fellowships">
<td>{{$index}}</td>
<td>{{fellow.Fellowship_Name}}</td>
<div ng-repeat="value in data_report"
ng-if="(fellow.F_Id==value.fellowship_id)? (show_row = true) : (show_row=false)">
<td ng-show="show_row">{{value.Completed}}</td>
<td ng-hide="show_row">0</td>
<td ng-show="show_row">{{value.Not_Updated}}</td>
<td ng-hide="show_row">0</td>
<td ng-show="show_row">{{value.Total_schedule}}</td>
<td ng-hide="show_row">0</td>
</div>
</tr>
</tbody>
Its just giving 0 as result. Though data_report is having values
Tried adding span in td with conditions in td and result in span.
still the result is zero
May I know where the logic is going wrong and how it can be achieved?
Changed the code to
<tbody>
<tr ng-repeat="fellow in fellowships">
<td>{{$index}}</td>
<td>{{fellow.Fellowship_Name}}</td>
<td>
<span ng-repeat="value in data_report" ng-show ="fellow.F_Id==value.fellowship_id">{{value.Completed}}</span>
</td>
<td>
<span ng-repeat="value in data_report" ng-show="fellow.F_Id==value.fellowship_id">{{value.Not_Updated}}</span>
</td>
<td>
<span ng-repeat="value in data_report" ng-show="fellow.F_Id==value.fellowship_id">{{value.Total_schedule}}</span>
</td>
</tr>
</tbody>
Here i am getting values but how can i set default value to zero if there are no values present?
In your case ng-if returns no boolean
The usage is (DOCs):
<ANY
ng-if="expression">
...
</ANY>
I think you dont need ng-if at all. You can write something like:
<tbody>
<tr ng-repeat="fellow in fellowships">
<td>{{$index}}</td>
<td>{{fellow.Fellowship_Name}}</td>
<div ng-repeat="value in data_report">
<td>{{(fellow.F_Id==value.fellowship_id) ? value.Completed: 0}}</td>
<td>{{(fellow.F_Id==value.fellowship_id) ? value.Not_Updated: 0}}</td>
<td>{{(fellow.F_Id==value.fellowship_id) ? value.Total_schedule: 0}}</td>
</div>
</tr>
</tbody>
Its not best solution, in Javascript you can set for example value.Completed to be by default 0. It will help you to simplify your HTML
I'm using ngTable directive as my grid.So I need to capture the row's text box value change without using any button (Please see the image below).How can I use $watch or other method to do that ? Any help would be highly appreciated.
html
<table class="table" ng-table="UnitsParams" template-pagination="custom/pager">
<tr ng-repeat="item in Event.UnitsDetails">
<td data-title="'Name'" sortable="'FirstName'">{{item.FirstName}} {{item.LastName}}</td>
<td data-title="'Email'">{{item.Email}}</td>
<td data-title="'Units'"><input type="number" ng-model="item.Units" />
</td>
</tr>
</table>
Try ng-blur in your textbox
Something like
<td data-title="'Units'"><input type="number" ng-blur="getValue(item)" ng-model="item.Units" /></td>
javascript code looks like in your controller
$scope.getValue=function(item)
{
alert(item.Units)
}
<form id="form">
<table id="VIPs" width="400">
<tbody>
<tr id="heading">
<tr>
<td>
<input id="VIP" type="radio" name="VIP" value="1" checked="true"/>
</td>
<td>Sylvester</td>
<td>Stallone</td>
<td>Male</td>
<td>Movie</td>
</tr>
<tr>
<td>
<td>Elvis</td>
<td>Presley</td>
<td>Male</td>
<td>Music</td>
</tr>
<tr>
<td>
<td>Marie</td>
<td>Curie</td>
<td>Female</td>
<td>Science</td>
From the above code snippet how can I click a radio button corresponding to a specific name using selenium java ?
You can do this:
driver.findElement(By.cssSelector("input[name='VIP']")).click()
which will eventually clicks the radio button.
I need to skip the ng-repeat for particular column.
My Code:
<tr ng-repeat="(lunches,price) in lunchTwo">
<td>
<label class="label_wraptext">{{lunches}}</label>
</td>
<td class="td_width">
</td>
<td>
<label>{{price}}</label>
</td>
<td style="padding-left:190px">
</td>
<td>
<select ng-controller="Quantity">
<option ng-repeat="key in notSorted(data)" ng-init="value = data[key]">
{{key}}
</option>
</select>
</td>
</tr>
I need to avoid binding the 'Select' control for all the rows.
Thanks in Advance,
Stephen.L
Suppose if you want to show the select control only for the first row, you can give a check using the index if it is equals ZERO, then show the select box, else not.
Please find the updated code below, check if it works for you.
<tr ng-repeat="(lunches,price) in lunchTwo">
<td>
<label class="label_wraptext">{{lunches}}</label>
</td>
<td class="td_width">
</td>
<td>
<label>{{price}}</label>
</td>
<td style="padding-left:190px">
</td>
<td>
<select ng-controller="Quantity" ng-show="$index==0">
<option ng-repeat="key in notSorted(data)" ng-init="value = data[key]">
{{key}}
</option>
</select>
</td>
</tr>