Can anyone help me with this? I am trying to retrieve all checked data from a table row using Angular.js. Below is my code:
<tr ng-repeat="gl in galleryDatas">
<td><input type="checkbox" name=""> {{$index+1}}</td>
<td><img ng-src="upload/{{gl.image}}" border="0" name="image" style="width:100px; height:100px;" /></td>
<td>{{gl.description}}</td>
</tr>
I want to populate an array with the data from the row when the checkbox is clicked. Can someone assist me with this?
To trigger an action with ng-change on a checkbox:
<td><input type="checkbox" ng-change="toggleSelection(gl.selected)" name="" ng-model="gl.selected"></td>
Inside the controller:
$scope.toggleSelection = function(selected) {
if (selected) {
// add the item to the selection list
} else {
// remove the item from the selection list
}
}
By following this method, you can accomplish the following:
Implemented in your controller:
$scope.galleryDatas = [
{
name: 'something',
description: "name 1"
},
{
name: 'another',
description: "name 2"
}
];
$scope.checkedValue = [];
$scope.saveInArray = function(index) {
if($scope.galleryDatas[index].checked) {
$scope.checkedValue.push($scope.galleryDatas[index]);
} else {
var newIndex = $scope.checkedValue.map(function(e) { return e.name; }).indexOf($scope.galleryDatas[index].name);
// for compare instead of "name" you should use that field is unique. ie: e.uniqueField
// and $scope.galleryDatas[index].uniqueField
if(newIndex !== -1)
$scope.checkedValue.splice(newIndex,1);
}
};
Important: The data of the checked rows are stored in the $scope.checkedValue array. When a row is unchecked, it is removed from the $scope.checkedValue array
And in the HTML:
<td><input type="checkbox" ng-model="gl.checked" ng-click="saveInArray($index)"> {{$index+1}}</td>
I am looking to convert my JSON file into an arraylist that can be utilized to showcase the information on a webpage. Here is my HTML file snippet: var xmlhttp = new XMLHttpRequest(); xmlhttp.onreadystatechange = function() { if(this.readyState == 4 &a ...
When using angular UI buttons, users can select search criteria by choosing between Patient, ID, or Date. If Patient or ID is selected, the searchByText div will be shown. If Date is selected, the searchByText will be hidden and the SearchBydateRange wil ...
I am facing an issue with a table and row highlighting in my code. Even after clicking on a row, it remains highlighted. I attempted to use the <TableRow disableTouchRipple={true}> but it didn't work as expected. What can I do to remove the high ...
Within my Vuex store, there is an action designed to retrieve a list of uids for followed users from the current user's Firestore UserDataCollection document. The action then processes each uid to extract data that will be displayed on the UI. While t ...
<a href="tel:<?php echo $b2b_mec_num; ?>"><button type="button" class="btn" id="CallBtn"> CALL</button></a> I am looking to dynamically add phone numbers from a database to the anchor tag provided in the code snippet ...
I'm currently facing an issue with a dialog box that I have implemented successfully. However, I can't seem to get it centered on the page: <Button variant="danger" onClick={() => { if (window.confirm('Delete character?')) handle ...
Looking for advice on how to refactor my function and eliminate the if statement inside the loop. Any suggestions would be helpful as I suspect the else condition is unnecessary. function quantitySum(array) { let sum = 0; for (let i = 0; i < array ...
I am encountering an issue where no JavaScript events are triggering inside an ng-show div in my code. You can access my code through the following link on Plnkr: http://plnkr.co/edit/kGqk8x?p=preview Upon loading data from JSON, I set ng-show to true. Ho ...
When attempting to make a request using XMLHttpRequest(), I encounter the Access-Control-Allow-Origin error. However, when I use a form like the one below, no issues arise. Is there something about forms that allows access? What could be the reason for t ...
I've been working on setting up an authentication service in my single-page application using React in the routes file. The goal is to check if a user is trying to access a private path, and verify that the token stored locally is valid. However, I&ap ...
I am facing a challenge with passing multiple parameters during Ajax calls. The code works perfectly when I only pass one parameter. Here is the code snippet for the Ajax call: $.ajax({ type: "POST", url: "dataCartas.php", ...
After receiving an ajax response in JSON format, my JavaScript code (within the ajax response success function) stringifies two arrays. Now, I need to assign the data from one curly bracket to two variables, and the data from the other curly bracket to ano ...
I am dealing with a JSON API response that has the following structure: [ { title: "top1", sections: [ { section_title: "section1", content: [ { content_title: "title1", content_id: "id1" ...
Is there a method to compute and cache new data during build time that is essential for both the front-end and back-end API routes? I'm looking for a way to access the static properties generated by API routes at build time since the routes are access ...
I've been working with object-oriented programming in PHP, and I'm trying to figure out how to send data using AngularJS to a specific method. Despite searching through numerous links and websites, I haven't been able to find a solution yet. ...
As part of my project, I am incorporating a 3D object using three.js within an Angular UI Modal. The initial loading of the 3D image works perfectly fine. However, I am facing an issue where updating the texture wrapping around the 3D object does not refle ...
Hey everyone, I've been working on making an AJAX API call to Giphy but I keep receiving 'undefined' as a response. Can anyone offer some advice on how to troubleshoot and fix this issue? Thanks in advance for your help! var topics = ["Drak ...
I'm not sure if my approach to solving this problem is correct: function capitalizeFirstLetter (string) { let stringArray = string.split(' '); for (let i = 0; i < stringArray.length; i++) { let firstLetter = stringArray[i ...
Is there a more efficient way to achieve this code with fewer lines of code? I'm looking for a solution that avoids repetition and makes it easier to manage, especially since I plan on creating multiple instances of this. Performance is a key consider ...
Hey there, I could really use your assistance. I am currently working on a project that involves styling the startDate and endDate using the react-datepicker library. The image below shows what I aim to achieve: Dear Developers, your help is much apprecia ...