loop through array react js - javascript

I need to go through an array and generate input of type checkbox, then I need to verify, through another array, which should be selected and which should not, how can I do it, my current code is the following
enter image description here
I tried to loop through an array inside the input but it didn't work

Related

Function doesn't output data taken from user input

I'm writing a small program that takes user input from form text fields and when the generate button is clicked, it displays the collected data unto another div.
Problem is once it collects the input (I know this because I used an alert test to know where the function breaks), it doesn't display. It stops exactly where the display commands start.
Any advice?
I'm not sure why you needed to put the output functions into the nested function, they should have worked directly.
But with the nested function, you need to call it. Put:
outputstuff();
after alert("working 8");
The generate button appears to submit the form on return from calling generate - the default type of a button is "submit" and it has the id "submitbutton".
If the page is reloaded from the server, the browser may fill in previously filled in input values but won't copy them into the SPAN elements.

JQuery - How to clone or repeat image based on user entered input

In plain javascript I can get an image to repeat based on user input. Pop is a variable holding the image, and totalTreats is a variable holding a user entered number:
document.getElementById('treats').innerHTML = pop.repeat(totalTreats);
I need to use jQuery, and can't get it to work using:
$('#treats').append($pop).clone($totalTreats);
Just use a for loop. I'm assuming $pop is some existing element.
for(let i=0;i<$totalRepeat);i++){
$('#treats').append($pop.clone());
}

Populate array in Jquery and pass to controller

I have a simple C# program where a user enters the ID of a item to be discarded then the individual who is to take it away signs and does so.
Upon entering the ID, you click the "search" button, the purpose of that button is to ensure that such an item exist in the database.
Issue
This method works however,, if there are 50 items to discard, my program requires the individual to sign 50 times. I am trying to have it so that, when I enter the ID number I can keep adding then ask for a signature once that will cover all 50 items.
My question is, I am having some issue with constantly adding the ID number to my textbox. In my jquery I have the line document.getElementById('test').value = document.getElementById('refno').value;
which takes the value from the refno textbox and adds it to the test texbox. Obviously that simple replaces the value and I am not sure of how to append it. So my next bet is an array. My question therefore is, how do I when I click the "Add" button, store those value in an array and then pass it to my controller and at the same time display it on the UI so that it can be edited ie if an id was entered in error.
This should add the value instead of replace it:
document.getElementById('test').value += document.getElementById('refno').value + ';';

Handling dynamic input groups

I am creating a form where a part of it would be cloned using javascript. The input name is of type input[ID][date], input[ID][type] etc. where the ID is the group of inputs. Those will be relationship IDs decided after the form submission.
I am currently having a placeholder for ID which gets replaced on cloning by the current element count.
Problem
When someone adds 3 elements ([0],[1],[2]) and removes the first one, the next ID of the element will be 2, same as the third element, overtwriting its inputs. I can't use input[][date] because it will create separate array for each input.
Question
What is the best way to approach dynamic input arrays? Should I keep the ID as a variable and increment it every time so it's unique even after removing an element? Would random temporary ID work? (I guess it could repeat that way)
I did something like this a while ago, here is how.
I stored each element name/id in an array ["inputname1", "inputname2"].
Then when ever a user would add a new element I would re iterate my array ["inputname1", "inputname2", "inputname3"] and replace each name id with the new id number based on how many inputs I have iterated over.
If an input got deleted the array would shift, no worries about same input id number.
More efficient than the original(you dont need to refresh each input remove button or their ids)
Example
Original Example
Sorry if I did not explain well enough.

What is best way to make a calculation with input values from a html form?

I have a product form with 3 inputs
Price (fixed number)
Quantity (an input with type="text" where the user can enter a number)
Optional extra (a checkbox that the user can tick to add a number)
So far I have been using Javascript to get the value of the html elements, and then adding them and outputting the result into a html element.
I need the form to update on the fly, so that a user can enter a number into quantity and tick the box and the result update live. Unfortuantely I have been unbale to find a way to set variables when there is an update in a field, please see the link below of what I have done so far.
http://jsbin.com/tapen/2/watch?html,css,js,output
With Jquery its very easy to acess the value of an input field, or to set events to will execute when the field value is changed / updated.
As a pratical example i would suggest that you take a look in the code of a sample calculator using only jquery and html: http://firstemission.blogspot.com.br/2012/10/jquery-and-watermark-example.html

Categories

Resources