What is the best way to access the ng-model of a select element when going through each row of a table?

Consider this code snippet:

    var rows = [ '1', '2', '3', '4'];
    // HTML table
    <tr data-ng-repeat="record in rows()">
     <td>
        <select data-ng-model="dynamicInsurance[record]" 
                data-ng-options="dyn for dyn in onetwothreefour"
        </select>
     </td>
    </tr>

This code will generate 4 rows with a select element in each. Let's say I choose different values from each of these dropdowns. If the dropdown displays the values:

one
two
three
four

And, if I select:

one from the first dropdown,
two from the second dropdown,
three from the third dropdown,
and four from the fourth dropdown,

After selecting these values, when I run the command

$scope.dynamicInsurance[1]

I receive one

My assumption was that all selected values would be stored in

$scope.dynamicInsurance

However, $scope.dynamicInsurance only returns

Object : { 1 : "one" }

Any ideas on how to retrieve the entire set of values (i.e one, two, three, four) from all the dropdowns?

Answer №1

To start off, in your controller you'll want to declare a new variable $scope.dynamicInsurance as an empty array:

$scope.dynamicInsurance=[];

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

What is the best way to conceal text that is not enclosed in <p> or <span> tags?

I need to hide a specific portion of text in an HTML code snippet, however, the text is not wrapped in any specific element. Here is an example: <div class="content"> Give comfortable and durable place to work with a desk. Lock the center d ...

Tips for updating the content within an HTML tag with jQuery

I am looking to update the parameter value of an applet tag based on the selection from a dropdown menu. As I am new to jQuery, I would appreciate any guidance on how to achieve this using jQuery. This is my current applet code: <applet id="decisiontr ...

Utilizing multiple instances of fs.writeFile in Node.js

I am currently managing a hotel's check-in/out information on an http server in Node.js. I store all the JSON data in memory and write it to a file using "fs.writeFile". Typically, the data does not exceed 145kB, but when consecutive calls to fs.write ...

Talebook: Unable to modify UI theming color

As I embark on creating my own theme in Storybook, I am closely following the guidelines outlined here: Currently, I have copied the necessary files from the website and everything seems to be working fine. However, I am facing an issue when trying to cus ...

Getting form field values with JQuery

I am currently facing an issue with a form field in HTML. Here is the code snippet: <form id="tasklist"> <input type="text" id="name" ...></input> ... additional form elements go here ... </form> Although I am trying to retrie ...

Access the value of a variable passed from the view to the controller

Is there a way to retrieve a dynamically generated value from the view to the controller in AngularJS? <ng-option ng-repeat="w in details track by $index"> <div class="program-grid-row table-row" > <div> <a class= ...

How can I position a div to always display directly above another div?

I am currently working on centering a div and would like to utilize this jQuery function... jQuery.fn.center = function () { this.css("position","absolute"); this.css("top", (($(window).height() - this.outerHeight()) / 2) + ...

CSS: Implement pause functionality for animations with a timer

I'm working on a timer implementation that allows users to start the timer and pause or continue it whenever they want. I faced a challenge when trying to pause the SVG animation. I tried following this article, but it didn't work as expected. ...

Making a XMLHttpRequest/ajax request to set the Content-Type header

In my attempts, I have tested the following methods individually: Please note: The variable "url" contains an HTTPS URL and "jsonString" contains a valid JSON string. var request = new XMLHttpRequest(); try{ request.open("POST", url); request.set ...

Updating the ThreeJS scene when adjusting opacity levels is essential for smooth transitions

Below is the constructor for my object: <code>class Something { constructor(mesh = undefined, material = undefined) { this.mesh = undefined; material = material; this.gui = undefined; if (mesh) { this.m ...

`Is there a way to modify the zAxis of a Paper component in Material-UI?`

Hello, I am curious about how to change the z-axis of a paper from MUI. https://i.sstatic.net/iKXLG.jpg The issue I'm facing is that the carousel is overlapping my menu and I need the menu to be on top of everything. Here is how I have it structure ...

Moving Iframe Data to a div

Is there a way to easily copy content from a specific iframe on my index.aspx page, open a new window, and paste it into a div? I currently have this code (not mine) but I would like a cleaner solution: $('#ifContent').clone().appendTo(w.docume ...

Reactjs Rendering problem with retrieving data from the backend in a popover

Take a look at the test environment where this problem is occurring https://codesandbox.io/s/nice-cache-kl12v My website design is being done with antd. Right now, I'm facing an issue where I need to display notifications to the user, which are acces ...

Is it possible to duplicate a response before making changes to its contents?

Imagine we are developing a response interceptor for an Angular 4 application using the HttpClient: export class MyInterceptor implements HttpInterceptor { public intercept(req: HttpRequest<any>, next: HttpHandler): Observable<HttpEvent<an ...

Conversing about the user data modeling in MongoDB

Here's a question for you: Is it a better idea to separate the users' model into one for storing passwords for access, and another for profile information? Or is it more secure to have everything together in one model? What are your thoughts on t ...

What causes the issue of divs not stacking properly when using Bootstrap 4?

I'm currently working on integrating VueJs and bootstrap4 to create two basic components. However, I am facing an issue where I have assigned the class .col-md-4 to a div in order to add 3 elements per row, but only one element is being added per row ...

Generate dynamic arrays in JavaScript/jQuery

I am encountering a challenge in creating a specific array for a project. The array needs to have the following fields consistently: [id | Type | nbItems] Following that, we have: m_name : m_value : However, the number of m_name/m_value pairs can v ...

unable to navigate to next or previous page in react-bootstrap-table2-paginator

I successfully implemented a table with pagination using react-bootstrap-table2-paginator. On each page number click, it calls an API to fetch the table data. However, I encountered issues with the next page, previous page, and last page buttons not workin ...

Retrieving fresh data with Ajax from Django 1.9 upon button click

I'm currently working on a code to display the status of AWS instances (servers) in a browser when users want to check the status. In some cases, it may take some time for the servers to start up, so I would like the status value to be refreshed (run ...

Showing a div based on the selected value from a dropdown menu

I am currently working on a project where I have 3 separate div elements, each with a unique ID. Depending on the selected value from a dropdown menu, I want to display one of these divs. I have created a function to handle this logic, but for some reason, ...