how do i pass array input box values from javascript ? i am populating only 1st value

Question

Here I added getvalue code for array of input boxes with name ItemName[]. It is populating only 1st input box value

function getselectedvalue()
{
    var selectedvalue = document.getElementById("ItemName[]").value;
    console.log(selectedvalue);
    $.ajax({
          url: 'fetch.php',
          type: 'post',
          data: { value : selectedvalue },
          dataType: 'JSON',
          success: function(response){
          var len = response.length;
          for(var i=0; i<len; i++){
          var item_desc = response[i].item_desc;
          var selling_price = response[i].selling_price;
          var tax =response[i].tax;
          console.log(item_desc);
          console.log(selling_price);
          console.log(tax);
          document.getElementById("ItemDesc[]").value= item_desc;
          document.getElementById("UnitPrice[]").value= selling_price;

          }
          }
    });
}

You cannot have duplicate IDs. Use ItemDesc[] for name and unique IDs for each. — mplungjan
– mplungjan, Commented Oct 10, 2018 at 6:12

mplungjan · Accepted Answer · 2018-10-10 06:16:34Z

1

You cannot use the array name as ID if there is more than one - which I assume there is - otherwise why have an array.

I suggest you use it only for name. Then you can do this to populate all, assuming you many to one ItemName[]

success: function(response) {
  var len = response.length;
  var descs = document.querySelectorAll("name=ItemDesc[]");
  var prices = document.querySelectorAll("name=UnitPrice[]");
  for (var i = 0; i < len; i++) {
    var item_desc = response[i].item_desc;
    var selling_price = response[i].selling_price;
    var tax = response[i].tax;
    descs[i].value = item_desc;
    prices[i].value = selling_price;
  }
}

answered Oct 10, 2018 at 6:16

mplungjan

180k29 gold badges183 silver badges246 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

PHP Geek · Accepted Answer · 2018-10-10 06:16:43Z

0

You can use the map or .each method to get array input data. Please find the example below:

var selectedvalue = $("input[name='ItemName[]']").map(function(){
return $(this).val();
}).get();

answered Oct 10, 2018 at 6:16

PHP Geek

4,0632 gold badges19 silver badges32 bronze badges

Comments

Linoy · Accepted Answer · 2018-10-10 06:23:04Z

The below code will fetch all the text box values and pass the data as array to your Ajax function

function getselectedvalue()
{
    var arrayOfValues = $(":input[type='text']").map(function() {
        return $(this).val();
    })
    .get();  
    console.log(arrayOfValues );
    $.ajax({
          url: 'fetch.php',
          type: 'post',
          data: { value : arrayOfValues },
          dataType: 'JSON',
          success: function(response){
          var len = response.length;
          for(var i=0; i<len; i++){
          var item_desc = response[i].item_desc;
          var selling_price = response[i].selling_price;
          var tax =response[i].tax;
          console.log(item_desc);
          console.log(selling_price);
          console.log(tax);
          document.getElementById("ItemDesc[]").value= item_desc;
          document.getElementById("UnitPrice[]").value= selling_price;

          }
          }
    });
}

Collectives™ on Stack Overflow

how do i pass array input box values from javascript ? i am populating only 1st value

3 Answers 3

Comments

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related