Does anyone knows how to create a button that fill all text boxes within a table?

Joe,

You could do something like this with a couple lines of JavaScript.

1) You need to gain access to each input that you want to be able to interact with. The best/easiest way to do this would be to create an array that holds each input as a value, using JavaScript's .getElementsByClassName() function. Just add a class name to each of your input elements (make sure it's the same class name) and you'll be good to go to use this.

2) You need to create your button element in your HTML.

3) Just like the inputs, you'll need to gain access to that button element in order to bind an event to it that will trigger your inputs to fill. For this, you could use JavaScript's .getElementById() function.

4) Attach an event listener to the button to call the function that you'll write that will populate the inputs, using JavaScript's .addEventListener() function.

5) Create the function that will iterate over each element in the array that you created to hold all of your inputs (using a FOR or WHILE loop, for example), and for each one, set the current input's .value property (scroll down on that link to find the value property) equal to whatever you are wanting to fill them with.

For a quick, crude example, see this codepen that I created.

Erik

Hi Erik, Here is what I have:

     $(".autofill").click(function() {        
         getTableRowValue();     
      });




function getTableRowValue(){
    var $row =  $('tr').find('td > input');
      $row.each(function() {
               if( $(this).val() ) {
                  var textval = $(this).val(); // this will be the text of each <td>
                  alert(textval);
               } 
           });
    }

What I did here is to managed to grab the value of "tr" elements. but what I really need it to be doing is allow the user to fill in whatever data in a first row. Then click on "Fill All" button to apply the same answer the row below within that table. If that making any sense?

basically just grabbing value from the first row and apply it to row below.