Get loop data of angular 6 html table on seprate button click
1
I am working on new angular 6 application and i am new to angular 6.
I have to implement the new function like.i am having one html table with multiple column some of them have checkbox along with id in hiddenfield. Now i have one button which is outside html table.
Now on the hutton click i have to get selected rows of one checkbox column. I have tried to search same on google but not getting any good solution for this.
Can anyone help to achive these functionality.
Thanks in advance.
Omkar
checkbox html-table angular6
asked Nov 25 '18 at 7:58
omkar mhaiskaromkar mhaiskar
141
add a comment |
1
I am working on new angular 6 application and i am new to angular 6.
I have to implement the new function like.i am having one html table with multiple column some of them have checkbox along with id in hiddenfield. Now i have one button which is outside html table.
Now on the hutton click i have to get selected rows of one checkbox column. I have tried to search same on google but not getting any good solution for this.
Can anyone help to achive these functionality.
Thanks in advance.
Omkar
checkbox html-table angular6
asked Nov 25 '18 at 7:58
omkar mhaiskaromkar mhaiskar
141
what is the issue you are facing, which part you are getting issue ?
– Krishna ijjada
Nov 25 '18 at 8:11
Hello Krishna, As mention i am new to angular 6 i wabt know how can get rowid or hidden field value of the row where i have selected checkbox from specific colum. So basically when user click on button i want to fetch rows using each function fot furthur process.
– omkar mhaiskar
Nov 25 '18 at 14:01
<tbody> <tr *ngFor="let item of mf.data; let i = index;"> <td><input type="checkbox" value="" [checked]="item.checked"></td> <td>{{item.id}}</td> <td>{{item.name}}</td> <td>{{item.email}}</td> <td>{{item.age}}</td> <td>{{item.city | uppercase}}</td> <td> </tr> </tbody>
– omkar mhaiskar
Nov 26 '18 at 19:17
add a comment |
1
1
1
I am working on new angular 6 application and i am new to angular 6.
I have to implement the new function like.i am having one html table with multiple column some of them have checkbox along with id in hiddenfield. Now i have one button which is outside html table.
Now on the hutton click i have to get selected rows of one checkbox column. I have tried to search same on google but not getting any good solution for this.
Can anyone help to achive these functionality.
Thanks in advance.
Omkar
checkbox html-table angular6
asked Nov 25 '18 at 7:58
omkar mhaiskaromkar mhaiskar
141
I am working on new angular 6 application and i am new to angular 6.
I have to implement the new function like.i am having one html table with multiple column some of them have checkbox along with id in hiddenfield. Now i have one button which is outside html table.
Now on the hutton click i have to get selected rows of one checkbox column. I have tried to search same on google but not getting any good solution for this.
Can anyone help to achive these functionality.
Thanks in advance.
Omkar
checkbox html-table angular6
checkbox html-table angular6
asked Nov 25 '18 at 7:58
omkar mhaiskaromkar mhaiskar
141
asked Nov 25 '18 at 7:58
omkar mhaiskaromkar mhaiskar
141
asked Nov 25 '18 at 7:58
omkar mhaiskaromkar mhaiskar
141
asked Nov 25 '18 at 7:58
omkar mhaiskaromkar mhaiskar
141
asked Nov 25 '18 at 7:58
omkar mhaiskaromkar mhaiskar
141
141
what is the issue you are facing, which part you are getting issue ?
– Krishna ijjada
Nov 25 '18 at 8:11
Hello Krishna, As mention i am new to angular 6 i wabt know how can get rowid or hidden field value of the row where i have selected checkbox from specific colum. So basically when user click on button i want to fetch rows using each function fot furthur process.
– omkar mhaiskar
Nov 25 '18 at 14:01
<tbody> <tr *ngFor="let item of mf.data; let i = index;"> <td><input type="checkbox" value="" [checked]="item.checked"></td> <td>{{item.id}}</td> <td>{{item.name}}</td> <td>{{item.email}}</td> <td>{{item.age}}</td> <td>{{item.city | uppercase}}</td> <td> </tr> </tbody>
– omkar mhaiskar
Nov 26 '18 at 19:17
add a comment |
what is the issue you are facing, which part you are getting issue ?
– Krishna ijjada
Nov 25 '18 at 8:11
Hello Krishna, As mention i am new to angular 6 i wabt know how can get rowid or hidden field value of the row where i have selected checkbox from specific colum. So basically when user click on button i want to fetch rows using each function fot furthur process.
– omkar mhaiskar
Nov 25 '18 at 14:01
<tbody> <tr *ngFor="let item of mf.data; let i = index;"> <td><input type="checkbox" value="" [checked]="item.checked"></td> <td>{{item.id}}</td> <td>{{item.name}}</td> <td>{{item.email}}</td> <td>{{item.age}}</td> <td>{{item.city | uppercase}}</td> <td> </tr> </tbody>
– omkar mhaiskar
Nov 26 '18 at 19:17
what is the issue you are facing, which part you are getting issue ?
– Krishna ijjada
Nov 25 '18 at 8:11
what is the issue you are facing, which part you are getting issue ?
– Krishna ijjada
Nov 25 '18 at 8:11
Hello Krishna, As mention i am new to angular 6 i wabt know how can get rowid or hidden field value of the row where i have selected checkbox from specific colum. So basically when user click on button i want to fetch rows using each function fot furthur process.
– omkar mhaiskar
Nov 25 '18 at 14:01
Hello Krishna, As mention i am new to angular 6 i wabt know how can get rowid or hidden field value of the row where i have selected checkbox from specific colum. So basically when user click on button i want to fetch rows using each function fot furthur process.
– omkar mhaiskar
Nov 25 '18 at 14:01
<tbody> <tr *ngFor="let item of mf.data; let i = index;"> <td><input type="checkbox" value="" [checked]="item.checked"></td> <td>{{item.id}}</td> <td>{{item.name}}</td> <td>{{item.email}}</td> <td>{{item.age}}</td> <td>{{item.city | uppercase}}</td> <td> </tr> </tbody>
– omkar mhaiskar
Nov 26 '18 at 19:17
<tbody> <tr *ngFor="let item of mf.data; let i = index;"> <td><input type="checkbox" value="" [checked]="item.checked"></td> <td>{{item.id}}</td> <td>{{item.name}}</td> <td>{{item.email}}</td> <td>{{item.age}}</td> <td>{{item.city | uppercase}}</td> <td> </tr> </tbody>
– omkar mhaiskar
Nov 26 '18 at 19:17
add a comment |
1 Answer
1
active
oldest
votes
0
you can do this stuff without the need of button by following :
checkbox :
<input type='checkbox' ng-repeat="fruit in fruits"
ng-checked="checkedFruits.indexOf(fruit) != -1" ng-click="toggleCheck(fruit)">
the function get called :
function SomeCtrl ($scope) {
$scope.fruits = ["apple, orange, pear, naartjie"];
$scope.checkedFruits = ;
$scope.toggleCheck = function (fruit) {
if ($scope.checkedFruits.indexOf(fruit) === -1) {
$scope.checkedFruits.push(fruit);
} else {
$scope.checkedFruits.splice($scope.checkedFruits.indexOf(fruit), 1);
}
};
}
answered Nov 25 '18 at 8:27
yash shahyash shah
12
I am using angular 6 is scope used in angular 6? I am not sure. Can you please share code for each row.
– omkar mhaiskar
Nov 25 '18 at 14:03
add a comment |
Your Answer
StackExchange.ifUsing("editor", function () {
StackExchange.using("externalEditor", function () {
StackExchange.using("snippets", function () {
StackExchange.snippets.init();
});
});
}, "code-snippets");
StackExchange.ready(function() {
var channelOptions = {
tags: "".split(" "),
id: "1"
};
initTagRenderer("".split(" "), "".split(" "), channelOptions);
StackExchange.using("externalEditor", function() {
// Have to fire editor after snippets, if snippets enabled
if (StackExchange.settings.snippets.snippetsEnabled) {
StackExchange.using("snippets", function() {
createEditor();
});
}
else {
createEditor();
}
});
function createEditor() {
StackExchange.prepareEditor({
heartbeatType: 'answer',
autoActivateHeartbeat: false,
convertImagesToLinks: true,
noModals: true,
showLowRepImageUploadWarning: true,
reputationToPostImages: 10,
bindNavPrevention: true,
postfix: "",
imageUploader: {
brandingHtml: "Powered by u003ca class="icon-imgur-white" href="https://imgur.com/"u003eu003c/au003e",
contentPolicyHtml: "User contributions licensed under u003ca href="https://creativecommons.org/licenses/by-sa/3.0/"u003ecc by-sa 3.0 with attribution requiredu003c/au003e u003ca href="https://stackoverflow.com/legal/content-policy"u003e(content policy)u003c/au003e",
allowUrls: true
},
onDemand: true,
discardSelector: ".discard-answer"
,immediatelyShowMarkdownHelp:true
});
}
});
draft saved
draft discarded
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
StackExchange.ready(
function () {
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53465663%2fget-loop-data-of-angular-6-html-table-on-seprate-button-click%23new-answer', 'question_page');
}
);
Post as a guest
Required, but never shown
1 Answer
1
active
oldest
votes
1 Answer
1
active
oldest
votes
active
oldest
votes
active
oldest
votes
0
you can do this stuff without the need of button by following :
checkbox :
<input type='checkbox' ng-repeat="fruit in fruits"
ng-checked="checkedFruits.indexOf(fruit) != -1" ng-click="toggleCheck(fruit)">
the function get called :
function SomeCtrl ($scope) {
$scope.fruits = ["apple, orange, pear, naartjie"];
$scope.checkedFruits = ;
$scope.toggleCheck = function (fruit) {
if ($scope.checkedFruits.indexOf(fruit) === -1) {
$scope.checkedFruits.push(fruit);
} else {
$scope.checkedFruits.splice($scope.checkedFruits.indexOf(fruit), 1);
}
};
}
answered Nov 25 '18 at 8:27
yash shahyash shah
12
I am using angular 6 is scope used in angular 6? I am not sure. Can you please share code for each row.
– omkar mhaiskar
Nov 25 '18 at 14:03
add a comment |
0
you can do this stuff without the need of button by following :
checkbox :
<input type='checkbox' ng-repeat="fruit in fruits"
ng-checked="checkedFruits.indexOf(fruit) != -1" ng-click="toggleCheck(fruit)">
the function get called :
function SomeCtrl ($scope) {
$scope.fruits = ["apple, orange, pear, naartjie"];
$scope.checkedFruits = ;
$scope.toggleCheck = function (fruit) {
if ($scope.checkedFruits.indexOf(fruit) === -1) {
$scope.checkedFruits.push(fruit);
} else {
$scope.checkedFruits.splice($scope.checkedFruits.indexOf(fruit), 1);
}
};
}
answered Nov 25 '18 at 8:27
yash shahyash shah
12
I am using angular 6 is scope used in angular 6? I am not sure. Can you please share code for each row.
– omkar mhaiskar
Nov 25 '18 at 14:03
add a comment |
0
0
0
you can do this stuff without the need of button by following :
checkbox :
<input type='checkbox' ng-repeat="fruit in fruits"
ng-checked="checkedFruits.indexOf(fruit) != -1" ng-click="toggleCheck(fruit)">
the function get called :
function SomeCtrl ($scope) {
$scope.fruits = ["apple, orange, pear, naartjie"];
$scope.checkedFruits = ;
$scope.toggleCheck = function (fruit) {
if ($scope.checkedFruits.indexOf(fruit) === -1) {
$scope.checkedFruits.push(fruit);
} else {
$scope.checkedFruits.splice($scope.checkedFruits.indexOf(fruit), 1);
}
};
}
answered Nov 25 '18 at 8:27
yash shahyash shah
12
you can do this stuff without the need of button by following :
checkbox :
<input type='checkbox' ng-repeat="fruit in fruits"
ng-checked="checkedFruits.indexOf(fruit) != -1" ng-click="toggleCheck(fruit)">
the function get called :
function SomeCtrl ($scope) {
$scope.fruits = ["apple, orange, pear, naartjie"];
$scope.checkedFruits = ;
$scope.toggleCheck = function (fruit) {
if ($scope.checkedFruits.indexOf(fruit) === -1) {
$scope.checkedFruits.push(fruit);
} else {
$scope.checkedFruits.splice($scope.checkedFruits.indexOf(fruit), 1);
}
};
}
answered Nov 25 '18 at 8:27
yash shahyash shah
12
answered Nov 25 '18 at 8:27
yash shahyash shah
12
answered Nov 25 '18 at 8:27
yash shahyash shah
12
answered Nov 25 '18 at 8:27
yash shahyash shah
12
12
I am using angular 6 is scope used in angular 6? I am not sure. Can you please share code for each row.
– omkar mhaiskar
Nov 25 '18 at 14:03
add a comment |
I am using angular 6 is scope used in angular 6? I am not sure. Can you please share code for each row.
– omkar mhaiskar
Nov 25 '18 at 14:03
I am using angular 6 is scope used in angular 6? I am not sure. Can you please share code for each row.
– omkar mhaiskar
Nov 25 '18 at 14:03
I am using angular 6 is scope used in angular 6? I am not sure. Can you please share code for each row.
– omkar mhaiskar
Nov 25 '18 at 14:03
add a comment |
draft saved
draft discarded
Thanks for contributing an answer to Stack Overflow!
- Please be sure to answer the question. Provide details and share your research!
But avoid …
- Asking for help, clarification, or responding to other answers.
- Making statements based on opinion; back them up with references or personal experience.
To learn more, see our tips on writing great answers.
draft saved
draft discarded
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
StackExchange.ready(
function () {
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53465663%2fget-loop-data-of-angular-6-html-table-on-seprate-button-click%23new-answer', 'question_page');
}
);
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
what is the issue you are facing, which part you are getting issue ?
– Krishna ijjada
Nov 25 '18 at 8:11
Hello Krishna, As mention i am new to angular 6 i wabt know how can get rowid or hidden field value of the row where i have selected checkbox from specific colum. So basically when user click on button i want to fetch rows using each function fot furthur process.
– omkar mhaiskar
Nov 25 '18 at 14:01
<tbody> <tr *ngFor="let item of mf.data; let i = index;"> <td><input type="checkbox" value="" [checked]="item.checked"></td> <td>{{item.id}}</td> <td>{{item.name}}</td> <td>{{item.email}}</td> <td>{{item.age}}</td> <td>{{item.city | uppercase}}</td> <td> </tr> </tbody>
– omkar mhaiskar
Nov 26 '18 at 19:17