Harish
Harish

Reputation: 1273

How to bind $index inside a function in angular js

I have repeated a div by using angular js ng-repeat

<div ng-repeat="exampleData in example">
<input type="text" id="{{ $index }}percentage"/>
<button type="btn btn-success" ng-click="submitted('{{ $index }}fromHours')">Submit</button>
</div>

So, when I click on submit button submitted method will be called with input feilds id passed as parameter in it,

Please take a look at the js code below :

$scope.submitted = function(percentage){
console.log($('#'+percentage).val());
}

Now when I use the parameter and print its value I'm getting error, Saying

Syntax error, unrecognized expression: #{{ $index }}percentage

How should I get the exact value of the input type with {{ $index }}percentage as ID

I have written $index to have the unique id as the text box will be repeated many times.

Please help, thanks in advance :)

Upvotes: 0

Views: 383

Answers (3)

user8317956
user8317956

Reputation:

<input type="text" ng-id="$index + 'percentage'"/>

<button type="btn btn-success" ng-click="submitted('$index + 'fromHours')">Submit</button>

Do it this way.

Upvotes: 1

Shahzad
Shahzad

Reputation: 1693

Try this

<input type="text" ng-id="$index + 'percentage'"/>

verify in the HTML if this value is properly populated.

Same is applicable to button as well

<button type="btn btn-success" ng-click="submitted($index + 'fromHours')">

Upvotes: 1

Sachila Ranawaka
Sachila Ranawaka

Reputation: 41447

remove the expressions when you pass an index to a ng-click function.

ng-click="submitted($index + 'fromHours')">

Upvotes: 1

Related Questions