I'm working on a form that includes multiple checkboxes populated with data from a JSON file using ng-repeat. After submitting the form, I need to retrieve the data from the checked checkboxes. How can I accomplish this in my controller after the form is submitted?
I've managed to display the checked data on the page itself by using ng-model="s.checked", but I'm now struggling to access this data in the controller.
For more information, check out this Plunk
After submitting, the structure of $scope.List remains unchanged as an array of objects. You can try this approach:
$scope.submit = function() {
var checkedItems = $scope.List.filter(function(item){
return item.checked;
});
console.log(checkedItems);
};
The values of the objects in List have indeed been altered.
(It's also advisable to utilize ngSubmit)
You have an array containing objects:
$scope.list = [
{"ID":5000,"Name":"ABC",checked:true},
{"ID":5001,"Name":"DEF",checked:false},
{"ID":5002,"Name":"XYZ",checked:false}];
To access the values of the checked properties, you can do it like this:
$scope.submit = function() {
var val1 = $scope.list[0].checked;
var val2 = $scope.list[1].checked;
var val3 = $scope.list[2].checked;
}
Another way to achieve the same result is by using a forEach statement:
$scope.submit = function() {
angular.forEach($scope.list, function (listValue) {
var val = listValue.checked;
});
}
I seem to be encountering various issues in Firefox that do not occur in Chrome. 1) I am facing a TypeError: response.body is null. 2) Another issue arises when uploading images, resulting in a TypeError: Argument 1 of FormData.constructor does not imple ...
I have been working on a web project and every time I try to publish it, I want to make sure it looks the same as it does on localhost. Recently, I added angularjs to handle currency display and when I deployed the project again, users are seeing {{currenc ...
While working on my website and trying to add a close menu button, I encountered an issue where all the menu buttons stopped functioning. Here is the HTML code snippet: <div id="openMenuButton"> <span style= "font-size:30px;cu ...
There seems to be an issue with displaying Google map markers based on objects in the markers array after looping through it. I noticed that when creating a second component and setting the position manually, the marker appears correctly. However, upon ins ...
In my application, I frequently make ajax requests using the Ext.Ajax.request method. Often, I find myself skipping error handling for failed requests due to time constraints or lack of interest in implementing fancy error handling. As a result, my code us ...
Exploring the world of nodejs and express, I have turned to the Parse API for my backend database needs. At the moment, I have an ajax post triggered on page load to one of my routers /getuser, which retrieves the current user if they are logged in. I am ...
Can someone help me understand what the rc in 2.2.0-rc.0 signifies? I'm curious if it indicates that this version is ready for production use. ...
Recently, I've been working with a directive in my code: app.directive('bhHugeHeader',[function(){ var link = function(scope, element, attrs, ctrl) { console.dir(ctrl); console.dir(ctrl.heroImgSrc); element.css ...
Whenever I hover over the main span, the animation works perfectly. However, once I move the cursor away from it, the animation continues to run. How can I make it stop, and why does it persist? $('#menu span:first').hover(function (){ functi ...
My material-ui table is resizing and scrolling horizontally without issue, but the table element and its contents are overflowing off the right side of the page. Check out this gif to see the behavior: https://i.stack.imgur.com/lXuHj.jpg Additionally, her ...
Although this issue has been addressed before in a discussion about the "You may have an infinite update loop in a component render function" warning in Vue component, the solution provided did not resolve my problem. I am seeking assistance to ...
As someone who is new to react, I am currently facing an issue with passing props from a parent function to a child. It seems that the parameters "square_state" and "setSquare_state" are not being recognized in the useSquare or handle_square_click functi ...
Currently facing an issue with handling ajax requests using ExpressJS. Whenever I click on an anchor tag, the entire page reloads instead of handling the ajax request on the client side. I am looking to ensure that clicking on any of these links triggers ...
I am utilizing MongoDB (mongoose) to establish a database for storing user notes in my Discord bot, which is being developed with Discord.JS. This is my "Guild.js" file: const { Schema, model } = require('mongoose'); const Guild = Schema({ i ...
I am encountering a compilation error while using "if" and "else-if". [Vue warn]: Failed to resolve directive: else-if Here is the code I am working with: var app = new Vue({ el:"#app", data:{ lab_status : 2 } }); <script src="https: ...
In my Sails project's homepage.ejs view, I utilize Ajax to dynamically load a portion of the page using the "food" controller's "show" action. This results in loading the show.ejs file located at /views/food/show.ejs. $('#outerDiv').lo ...
Having trouble getting any content to show up from the media object! The plate object seems to be malfunctioning. <!DOCTYPE html> <html lang="en" ng-app="confusionApp"> <head> <meta charset="utf-8"> <met ...
I am facing an issue where I want to access the same event in two different useEffect functions on the same page. Despite my attempts, it doesn't seem to work as expected. Below is what I have tried so far. I'm wondering if it's possible to ...
I'm facing a challenge when it comes to updating two datatables simultaneously on the same page. Here's how my HTML is structured: <table id="datatable1" ng-if="Ctrl.dtOptions1" datatable="" dt-options="Ctrl.dtOptions1" dt-column-defs="Ctrl. ...
I am having issues storing user-entered data from an HTML form into MongoDB. The error message I receive is "TypeError: cannot read property 'fullname' of undefined" TypeError: Cannot read property 'fullname' of undefined at C:&bso ...