Loop thru form fields and update values from arrayCreate ArrayList from arrayPHP: Delete an element from an arrayHow do I determine whether an array contains a particular value in Java?Sort array of objects by string property valueDetermine whether an array contains a valueCheck if a value exists in an array in RubyLoop through an array in JavaScriptHow do I remove a particular element from an array in JavaScript?Copy array by valueLoop through an array of strings in Bash?

ssTTsSTtRrriinInnnnNNNIiinngg

Can I hook these wires up to find the connection to a dead outlet?

Car headlights in a world without electricity

Where would I need my direct neural interface to be implanted?

Sums of two squares in arithmetic progressions

Machine learning testing data

OP Amp not amplifying audio signal

Should I tell management that I intend to leave due to bad software development practices?

How to prevent "they're falling in love" trope

How to show a landlord what we have in savings?

How does a dynamic QR code work?

How to compactly explain secondary and tertiary characters without resorting to stereotypes?

Rotate ASCII Art by 45 Degrees

My ex-girlfriend uses my Apple ID to log in to her iPad. Do I have to give her my Apple ID password to reset it?

Knowledge-based authentication using Domain-driven Design in C#

How exploitable/balanced is this homebrew spell: Spell Permanency?

What is the most common color to indicate the input-field is disabled?

What is the opposite of "eschatology"?

Are British MPs missing the point, with these 'Indicative Votes'?

How seriously should I take size and weight limits of hand luggage?

Why was Sir Cadogan fired?

Is there a hemisphere-neutral way of specifying a season?

Why was the shrink from 8″ made only to 5.25″ and not smaller (4″ or less)

Why is it a bad idea to hire a hitman to eliminate most corrupt politicians?



Loop thru form fields and update values from array


Create ArrayList from arrayPHP: Delete an element from an arrayHow do I determine whether an array contains a particular value in Java?Sort array of objects by string property valueDetermine whether an array contains a valueCheck if a value exists in an array in RubyLoop through an array in JavaScriptHow do I remove a particular element from an array in JavaScript?Copy array by valueLoop through an array of strings in Bash?













0















I have a from which looks like



 <div class="book-form">
<input type="text" id="book_qty" name="book_qty[0]" value="" >
<input type="text" id="book_unit" name="book_unit[0]" value="" >
<input type="text" id="book_name" name="book_name[0]" value="" >
<input type="text" id="book_notes" name="book_notes[0]" value="" >

<input type="text" id="book_qty" name="book_qty[1]" value="" >
<input type="text" id="book_unit" name="book_unit[1]" value="" >
<input type="text" id="book_name" name="book_name[1]" value="" >
<input type="text" id="book_notes" name="book_notes[1]" value="" >
</div>


then I have an array which consist same mapping values for above form



 0: Array(4)
0: "1 "
1: "boxes "
2: "Math"
3: "in Stock"
length: 4

1: Array(4)
0: "2 "
1: "boxes "
2: "science "
3: " "
length: 4


I am trying to loop thru the array and update the form field respectively.



this is my code I tried



 var all_inputs = $(".autofill input[type=text]");
$(all_inputs).each(function()
$.each(myTableArray, function (n, elem)
console.log(elem);
all_inputs.val(elem);
);
);


but this fills the form with same last values.



Please assist.










share|improve this question

















  • 1





    IDs should be unique, you shouldn't have multiple id="book_qty".

    – Barmar
    Mar 8 at 21:17















0















I have a from which looks like



 <div class="book-form">
<input type="text" id="book_qty" name="book_qty[0]" value="" >
<input type="text" id="book_unit" name="book_unit[0]" value="" >
<input type="text" id="book_name" name="book_name[0]" value="" >
<input type="text" id="book_notes" name="book_notes[0]" value="" >

<input type="text" id="book_qty" name="book_qty[1]" value="" >
<input type="text" id="book_unit" name="book_unit[1]" value="" >
<input type="text" id="book_name" name="book_name[1]" value="" >
<input type="text" id="book_notes" name="book_notes[1]" value="" >
</div>


then I have an array which consist same mapping values for above form



 0: Array(4)
0: "1 "
1: "boxes "
2: "Math"
3: "in Stock"
length: 4

1: Array(4)
0: "2 "
1: "boxes "
2: "science "
3: " "
length: 4


I am trying to loop thru the array and update the form field respectively.



this is my code I tried



 var all_inputs = $(".autofill input[type=text]");
$(all_inputs).each(function()
$.each(myTableArray, function (n, elem)
console.log(elem);
all_inputs.val(elem);
);
);


but this fills the form with same last values.



Please assist.










share|improve this question

















  • 1





    IDs should be unique, you shouldn't have multiple id="book_qty".

    – Barmar
    Mar 8 at 21:17













0












0








0








I have a from which looks like



 <div class="book-form">
<input type="text" id="book_qty" name="book_qty[0]" value="" >
<input type="text" id="book_unit" name="book_unit[0]" value="" >
<input type="text" id="book_name" name="book_name[0]" value="" >
<input type="text" id="book_notes" name="book_notes[0]" value="" >

<input type="text" id="book_qty" name="book_qty[1]" value="" >
<input type="text" id="book_unit" name="book_unit[1]" value="" >
<input type="text" id="book_name" name="book_name[1]" value="" >
<input type="text" id="book_notes" name="book_notes[1]" value="" >
</div>


then I have an array which consist same mapping values for above form



 0: Array(4)
0: "1 "
1: "boxes "
2: "Math"
3: "in Stock"
length: 4

1: Array(4)
0: "2 "
1: "boxes "
2: "science "
3: " "
length: 4


I am trying to loop thru the array and update the form field respectively.



this is my code I tried



 var all_inputs = $(".autofill input[type=text]");
$(all_inputs).each(function()
$.each(myTableArray, function (n, elem)
console.log(elem);
all_inputs.val(elem);
);
);


but this fills the form with same last values.



Please assist.










share|improve this question














I have a from which looks like



 <div class="book-form">
<input type="text" id="book_qty" name="book_qty[0]" value="" >
<input type="text" id="book_unit" name="book_unit[0]" value="" >
<input type="text" id="book_name" name="book_name[0]" value="" >
<input type="text" id="book_notes" name="book_notes[0]" value="" >

<input type="text" id="book_qty" name="book_qty[1]" value="" >
<input type="text" id="book_unit" name="book_unit[1]" value="" >
<input type="text" id="book_name" name="book_name[1]" value="" >
<input type="text" id="book_notes" name="book_notes[1]" value="" >
</div>


then I have an array which consist same mapping values for above form



 0: Array(4)
0: "1 "
1: "boxes "
2: "Math"
3: "in Stock"
length: 4

1: Array(4)
0: "2 "
1: "boxes "
2: "science "
3: " "
length: 4


I am trying to loop thru the array and update the form field respectively.



this is my code I tried



 var all_inputs = $(".autofill input[type=text]");
$(all_inputs).each(function()
$.each(myTableArray, function (n, elem)
console.log(elem);
all_inputs.val(elem);
);
);


but this fills the form with same last values.



Please assist.







jquery arrays forms loops






share|improve this question













share|improve this question











share|improve this question




share|improve this question










asked Mar 8 at 20:47









saqsaq

356




356







  • 1





    IDs should be unique, you shouldn't have multiple id="book_qty".

    – Barmar
    Mar 8 at 21:17












  • 1





    IDs should be unique, you shouldn't have multiple id="book_qty".

    – Barmar
    Mar 8 at 21:17







1




1





IDs should be unique, you shouldn't have multiple id="book_qty".

– Barmar
Mar 8 at 21:17





IDs should be unique, you shouldn't have multiple id="book_qty".

– Barmar
Mar 8 at 21:17












2 Answers
2






active

oldest

votes


















0














No need to loop through the inputs. It is the array you want to loop through and use the current index to access the input to fill it's value:



var myTableArray = [
["1 ", "boxes ", "Math", "in Stock"],
["2 ", "boxes ", "science ", " "]
];

var all_inputs = $("input[type=text]");
var cnt = 0;

$.each(myTableArray, function(n, e)
$.each(e, function(n, elem)
console.log(elem);
$(all_inputs.get(cnt)).val(elem);
cnt++;
);
);


Here is the working fiddle.






share|improve this answer






























    0

















    const array = [
    ["1 ", "boxes ", "Math", "in Stock"],
    ["2 ", "boxes ", "science ", " "]
    ];
    array.forEach(([qty, unit, name, notes], i) =>
    $(`input[name="book_qty[$i]"]`).val(qty.trim());
    $(`input[name="book_unit[$i]"]`).val(unit.trim());
    $(`input[name="book_name[$i]"]`).val(name.trim());
    $(`input[name="book_notes[$i]"]`).val(notes.trim());
    );

    <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
    <div class="book-form">
    <input type="text" id="book_qty" name="book_qty[0]" value="">
    <input type="text" id="book_unit" name="book_unit[0]" value="">
    <input type="text" id="book_name" name="book_name[0]" value="">
    <input type="text" id="book_notes" name="book_notes[0]" value="">

    <input type="text" id="book_qty" name="book_qty[1]" value="">
    <input type="text" id="book_unit" name="book_unit[1]" value="">
    <input type="text" id="book_name" name="book_name[1]" value="">
    <input type="text" id="book_notes" name="book_notes[1]" value="">
    </div>





    Loop over the array rather than the inputs.






    share|improve this answer























      Your Answer






      StackExchange.ifUsing("editor", function ()
      StackExchange.using("externalEditor", function ()
      StackExchange.using("snippets", function ()
      StackExchange.snippets.init();
      );
      );
      , "code-snippets");

      StackExchange.ready(function()
      var channelOptions =
      tags: "".split(" "),
      id: "1"
      ;
      initTagRenderer("".split(" "), "".split(" "), channelOptions);

      StackExchange.using("externalEditor", function()
      // Have to fire editor after snippets, if snippets enabled
      if (StackExchange.settings.snippets.snippetsEnabled)
      StackExchange.using("snippets", function()
      createEditor();
      );

      else
      createEditor();

      );

      function createEditor()
      StackExchange.prepareEditor(
      heartbeatType: 'answer',
      autoActivateHeartbeat: false,
      convertImagesToLinks: true,
      noModals: true,
      showLowRepImageUploadWarning: true,
      reputationToPostImages: 10,
      bindNavPrevention: true,
      postfix: "",
      imageUploader:
      brandingHtml: "Powered by u003ca class="icon-imgur-white" href="https://imgur.com/"u003eu003c/au003e",
      contentPolicyHtml: "User contributions licensed under u003ca href="https://creativecommons.org/licenses/by-sa/3.0/"u003ecc by-sa 3.0 with attribution requiredu003c/au003e u003ca href="https://stackoverflow.com/legal/content-policy"u003e(content policy)u003c/au003e",
      allowUrls: true
      ,
      onDemand: true,
      discardSelector: ".discard-answer"
      ,immediatelyShowMarkdownHelp:true
      );



      );













      draft saved

      draft discarded


















      StackExchange.ready(
      function ()
      StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f55070764%2floop-thru-form-fields-and-update-values-from-array%23new-answer', 'question_page');

      );

      Post as a guest















      Required, but never shown

























      2 Answers
      2






      active

      oldest

      votes








      2 Answers
      2






      active

      oldest

      votes









      active

      oldest

      votes






      active

      oldest

      votes









      0














      No need to loop through the inputs. It is the array you want to loop through and use the current index to access the input to fill it's value:



      var myTableArray = [
      ["1 ", "boxes ", "Math", "in Stock"],
      ["2 ", "boxes ", "science ", " "]
      ];

      var all_inputs = $("input[type=text]");
      var cnt = 0;

      $.each(myTableArray, function(n, e)
      $.each(e, function(n, elem)
      console.log(elem);
      $(all_inputs.get(cnt)).val(elem);
      cnt++;
      );
      );


      Here is the working fiddle.






      share|improve this answer



























        0














        No need to loop through the inputs. It is the array you want to loop through and use the current index to access the input to fill it's value:



        var myTableArray = [
        ["1 ", "boxes ", "Math", "in Stock"],
        ["2 ", "boxes ", "science ", " "]
        ];

        var all_inputs = $("input[type=text]");
        var cnt = 0;

        $.each(myTableArray, function(n, e)
        $.each(e, function(n, elem)
        console.log(elem);
        $(all_inputs.get(cnt)).val(elem);
        cnt++;
        );
        );


        Here is the working fiddle.






        share|improve this answer

























          0












          0








          0







          No need to loop through the inputs. It is the array you want to loop through and use the current index to access the input to fill it's value:



          var myTableArray = [
          ["1 ", "boxes ", "Math", "in Stock"],
          ["2 ", "boxes ", "science ", " "]
          ];

          var all_inputs = $("input[type=text]");
          var cnt = 0;

          $.each(myTableArray, function(n, e)
          $.each(e, function(n, elem)
          console.log(elem);
          $(all_inputs.get(cnt)).val(elem);
          cnt++;
          );
          );


          Here is the working fiddle.






          share|improve this answer













          No need to loop through the inputs. It is the array you want to loop through and use the current index to access the input to fill it's value:



          var myTableArray = [
          ["1 ", "boxes ", "Math", "in Stock"],
          ["2 ", "boxes ", "science ", " "]
          ];

          var all_inputs = $("input[type=text]");
          var cnt = 0;

          $.each(myTableArray, function(n, e)
          $.each(e, function(n, elem)
          console.log(elem);
          $(all_inputs.get(cnt)).val(elem);
          cnt++;
          );
          );


          Here is the working fiddle.







          share|improve this answer












          share|improve this answer



          share|improve this answer










          answered Mar 8 at 21:26









          Nawed KhanNawed Khan

          3,0271618




          3,0271618























              0

















              const array = [
              ["1 ", "boxes ", "Math", "in Stock"],
              ["2 ", "boxes ", "science ", " "]
              ];
              array.forEach(([qty, unit, name, notes], i) =>
              $(`input[name="book_qty[$i]"]`).val(qty.trim());
              $(`input[name="book_unit[$i]"]`).val(unit.trim());
              $(`input[name="book_name[$i]"]`).val(name.trim());
              $(`input[name="book_notes[$i]"]`).val(notes.trim());
              );

              <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
              <div class="book-form">
              <input type="text" id="book_qty" name="book_qty[0]" value="">
              <input type="text" id="book_unit" name="book_unit[0]" value="">
              <input type="text" id="book_name" name="book_name[0]" value="">
              <input type="text" id="book_notes" name="book_notes[0]" value="">

              <input type="text" id="book_qty" name="book_qty[1]" value="">
              <input type="text" id="book_unit" name="book_unit[1]" value="">
              <input type="text" id="book_name" name="book_name[1]" value="">
              <input type="text" id="book_notes" name="book_notes[1]" value="">
              </div>





              Loop over the array rather than the inputs.






              share|improve this answer



























                0

















                const array = [
                ["1 ", "boxes ", "Math", "in Stock"],
                ["2 ", "boxes ", "science ", " "]
                ];
                array.forEach(([qty, unit, name, notes], i) =>
                $(`input[name="book_qty[$i]"]`).val(qty.trim());
                $(`input[name="book_unit[$i]"]`).val(unit.trim());
                $(`input[name="book_name[$i]"]`).val(name.trim());
                $(`input[name="book_notes[$i]"]`).val(notes.trim());
                );

                <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
                <div class="book-form">
                <input type="text" id="book_qty" name="book_qty[0]" value="">
                <input type="text" id="book_unit" name="book_unit[0]" value="">
                <input type="text" id="book_name" name="book_name[0]" value="">
                <input type="text" id="book_notes" name="book_notes[0]" value="">

                <input type="text" id="book_qty" name="book_qty[1]" value="">
                <input type="text" id="book_unit" name="book_unit[1]" value="">
                <input type="text" id="book_name" name="book_name[1]" value="">
                <input type="text" id="book_notes" name="book_notes[1]" value="">
                </div>





                Loop over the array rather than the inputs.






                share|improve this answer

























                  0












                  0








                  0










                  const array = [
                  ["1 ", "boxes ", "Math", "in Stock"],
                  ["2 ", "boxes ", "science ", " "]
                  ];
                  array.forEach(([qty, unit, name, notes], i) =>
                  $(`input[name="book_qty[$i]"]`).val(qty.trim());
                  $(`input[name="book_unit[$i]"]`).val(unit.trim());
                  $(`input[name="book_name[$i]"]`).val(name.trim());
                  $(`input[name="book_notes[$i]"]`).val(notes.trim());
                  );

                  <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
                  <div class="book-form">
                  <input type="text" id="book_qty" name="book_qty[0]" value="">
                  <input type="text" id="book_unit" name="book_unit[0]" value="">
                  <input type="text" id="book_name" name="book_name[0]" value="">
                  <input type="text" id="book_notes" name="book_notes[0]" value="">

                  <input type="text" id="book_qty" name="book_qty[1]" value="">
                  <input type="text" id="book_unit" name="book_unit[1]" value="">
                  <input type="text" id="book_name" name="book_name[1]" value="">
                  <input type="text" id="book_notes" name="book_notes[1]" value="">
                  </div>





                  Loop over the array rather than the inputs.






                  share|improve this answer
















                  const array = [
                  ["1 ", "boxes ", "Math", "in Stock"],
                  ["2 ", "boxes ", "science ", " "]
                  ];
                  array.forEach(([qty, unit, name, notes], i) =>
                  $(`input[name="book_qty[$i]"]`).val(qty.trim());
                  $(`input[name="book_unit[$i]"]`).val(unit.trim());
                  $(`input[name="book_name[$i]"]`).val(name.trim());
                  $(`input[name="book_notes[$i]"]`).val(notes.trim());
                  );

                  <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
                  <div class="book-form">
                  <input type="text" id="book_qty" name="book_qty[0]" value="">
                  <input type="text" id="book_unit" name="book_unit[0]" value="">
                  <input type="text" id="book_name" name="book_name[0]" value="">
                  <input type="text" id="book_notes" name="book_notes[0]" value="">

                  <input type="text" id="book_qty" name="book_qty[1]" value="">
                  <input type="text" id="book_unit" name="book_unit[1]" value="">
                  <input type="text" id="book_name" name="book_name[1]" value="">
                  <input type="text" id="book_notes" name="book_notes[1]" value="">
                  </div>





                  Loop over the array rather than the inputs.






                  const array = [
                  ["1 ", "boxes ", "Math", "in Stock"],
                  ["2 ", "boxes ", "science ", " "]
                  ];
                  array.forEach(([qty, unit, name, notes], i) =>
                  $(`input[name="book_qty[$i]"]`).val(qty.trim());
                  $(`input[name="book_unit[$i]"]`).val(unit.trim());
                  $(`input[name="book_name[$i]"]`).val(name.trim());
                  $(`input[name="book_notes[$i]"]`).val(notes.trim());
                  );

                  <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
                  <div class="book-form">
                  <input type="text" id="book_qty" name="book_qty[0]" value="">
                  <input type="text" id="book_unit" name="book_unit[0]" value="">
                  <input type="text" id="book_name" name="book_name[0]" value="">
                  <input type="text" id="book_notes" name="book_notes[0]" value="">

                  <input type="text" id="book_qty" name="book_qty[1]" value="">
                  <input type="text" id="book_unit" name="book_unit[1]" value="">
                  <input type="text" id="book_name" name="book_name[1]" value="">
                  <input type="text" id="book_notes" name="book_notes[1]" value="">
                  </div>





                  const array = [
                  ["1 ", "boxes ", "Math", "in Stock"],
                  ["2 ", "boxes ", "science ", " "]
                  ];
                  array.forEach(([qty, unit, name, notes], i) =>
                  $(`input[name="book_qty[$i]"]`).val(qty.trim());
                  $(`input[name="book_unit[$i]"]`).val(unit.trim());
                  $(`input[name="book_name[$i]"]`).val(name.trim());
                  $(`input[name="book_notes[$i]"]`).val(notes.trim());
                  );

                  <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
                  <div class="book-form">
                  <input type="text" id="book_qty" name="book_qty[0]" value="">
                  <input type="text" id="book_unit" name="book_unit[0]" value="">
                  <input type="text" id="book_name" name="book_name[0]" value="">
                  <input type="text" id="book_notes" name="book_notes[0]" value="">

                  <input type="text" id="book_qty" name="book_qty[1]" value="">
                  <input type="text" id="book_unit" name="book_unit[1]" value="">
                  <input type="text" id="book_name" name="book_name[1]" value="">
                  <input type="text" id="book_notes" name="book_notes[1]" value="">
                  </div>






                  share|improve this answer












                  share|improve this answer



                  share|improve this answer










                  answered Mar 8 at 21:23









                  BarmarBarmar

                  434k36259362




                  434k36259362



























                      draft saved

                      draft discarded
















































                      Thanks for contributing an answer to Stack Overflow!


                      • Please be sure to answer the question. Provide details and share your research!

                      But avoid


                      • Asking for help, clarification, or responding to other answers.

                      • Making statements based on opinion; back them up with references or personal experience.

                      To learn more, see our tips on writing great answers.




                      draft saved


                      draft discarded














                      StackExchange.ready(
                      function ()
                      StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f55070764%2floop-thru-form-fields-and-update-values-from-array%23new-answer', 'question_page');

                      );

                      Post as a guest















                      Required, but never shown





















































                      Required, but never shown














                      Required, but never shown












                      Required, but never shown







                      Required, but never shown

































                      Required, but never shown














                      Required, but never shown












                      Required, but never shown







                      Required, but never shown







                      Popular posts from this blog

                      Thal And Out Agency railway station See also References External links Navigation menuOfficial Web Site of Pakistan RailwaysArchivedOfficial Web Site of Pakistan Railwayseeexpanding ite

                      Understanding generators in Python2019 Community Moderator ElectionGenerator function not working pythonFor loop not executing two timesGenerators - Printing generated valuesWhy can a python generator only be used once?What exactly do generators do?What does the “yield” keyword do?What does “list comprehension” mean? How does it work and how can I use it?sklearn Kfold acces single fold instead of for loopIs a generator the callable? Which is the generator?Apply Border To Range Of Cells Using OpenpyxlCalling an external command in PythonWhat are metaclasses in Python?What is the difference between @staticmethod and @classmethod?Finding the index of an item given a list containing it in PythonDifference between append vs. extend list methods in PythonHow can I safely create a nested directory in Python?Does Python have a ternary conditional operator?Understanding slice notationUnderstanding Python super() with __init__() methodsDoes Python have a string 'contains' substring method?

                      How can I change the color of pagination dots of UIPageControl?How to change UIPageControl dotsIs there a way to change page indicator dots colorCustomize dot with image of UIPageControl at index 0 of UIPageControlNo visible @interface for 'NSObject<PageControlDelegate>' declares the selector 'pageControlPageDidChange:'How to change the color of pagination dots in UIPageControl with a different color per pagepagecontrol indicator custom image instead of DefaultChanging the colour of UIPageControl dots in MonoTouchpagecontrol selectable page visibility color?Alternative way to load ViewControllers on a UIPageControlHow to set only layer.border-color for UIpage control dots in swiftHow can I develop for iPhone using a Windows development machine?How to change the name of an iOS app?UITableView - change section header coloruipagecontrol indicator(dot)issueCustom UIPageControl dots color not changingchange the interspace between UIPageControl dotsHow to change Status Bar text color in iOSHow can I change image tintColor in iOS and WatchKitUIPageControl dots with larger space in between each dotsHow to change the color of pagination dots in UIPageControl with a different color per page