How can I get value of input array

Question

**I want to get value of input **

 <input class="text-left" readonly id = "editable_text" name = "editable_text[<?php echo $order['id']; ?>]" style="vertical-align: middle" value="<?PHP echo $order['issued_to']; ?>">
 <input  type="checkbox" class="checkbox" name="orders[]" id ="orders"  value="<?php echo $order['id']; ?>" onclick="uncheckMain_arayish()">

    var x = document.getElementsByName("orders[]");
    var text = document.getElementsByName("editable_text[]");
     for (var i = 0; i < x.length; i++) {
                    if (x[i].checked) {
                        var order = x[i].value;
                        text[order].readOnly = false;
                    }
                    else{
                        text[i].readOnly = true;
                    }
                }

"text" is not working properly.

I am not getting what is the issue here. What is your main question? — palaѕн
– palaѕн, Commented Apr 14, 2020 at 12:49
I want to get input data like "x = document.getElementsByName("editable_text[]"); " which array ID can be different for example alert (x[67].value) but it is not working and I do not understand this. — Kamran Teymurov
– Kamran Teymurov, Commented Apr 14, 2020 at 13:05

WolverinDEV · Accepted Answer · 2020-04-14 12:44:17Z

1

document.getElementById("editable_text").value

https://www.w3schools.com/jsref/prop_text_value.asp

answered Apr 14, 2020 at 12:44

WolverinDEV

1,55411 silver badges20 bronze badges

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

3 Comments

Kamran Teymurov Over a year ago

var text = document.getElementsByName("editable_text[]"); I use ByName not ID

WolverinDEV Over a year ago

Yes but since every ID within your DOM should be unique you could just get this text-input by his id.

Kamran Teymurov Over a year ago

I have lots of input I only can decide it because of array id which is in my code this (name = "editable_text[<?php echo $order['id']; ?>]")

Radu Diță · Accepted Answer · 2020-04-14 13:00:41Z

0

You are getting an array from var text = document.getElementsByName("editable_text[]"); and then you try to access an object based on order.id

This will only work in a very specific case.

You should generate unique id's for text based on order ids

<input class="text-left" readonly id = "editable_text[<?php echo $order['id']; ?>]" name = "editable_text[<?php echo $order['id']; ?>]" style="vertical-align: middle" value="<?PHP echo $order['issued_to']; ?>">

And then you can use document.getElementById inside your for to get the associated text element.

answered Apr 14, 2020 at 13:00

Radu Diță

14.3k2 gold badges33 silver badges37 bronze badges

1 Comment

Kamran Teymurov Over a year ago

I checked it before it does not work in ID we cannot use " [ ] " this

palaѕн · Accepted Answer · 2020-04-14 13:45:43Z

0

The issue here is you are trying to get all text elements like:

var text = document.getElementsByName("editable_text[]");

But the name of the attribute is not exactly like editable_text[] but more like editable_text[12] or editable_text[67] and so on. So, you can get all these text elements like:

var text = document.querySelectorAll("input[name^='editable_text']");

Demo:

var text = document.querySelectorAll("input[name^='editable_text']");
text.forEach(function(el) {
  console.log(el.name, el.value) // use this for debugging purpose
})

<input class="text-left" readonly name="editable_text[10]" value="1">
<input class="text-left" readonly name="editable_text[12]" value="2">
<input class="text-left" readonly name="editable_text[14]" value="3">
<input class="text-left" readonly name="editable_text[16]" value="4">

Also, using text[order].readOnly = false; will not work, as text is a DOM element we cannot simply call it like that. You can instead use:

document.querySelector("[name='editable_text[" + order + "]']").readOnly = false;

Demo:

var text = document.querySelectorAll("input[name^='editable_text']");
var order = 12;

text.forEach(function(el) {
  // Disable only the name="editable_text[12]" input like
  document.querySelector("[name='editable_text[" + order + "]']").disabled = true;
})

<input class="text-left" readonly name="editable_text[10]" value="1">
<input class="text-left" readonly name="editable_text[12]" value="2">
<input class="text-left" readonly name="editable_text[14]" value="3">
<input class="text-left" readonly name="editable_text[16]" value="4">

edited Apr 14, 2020 at 13:45

answered Apr 14, 2020 at 13:23

palaѕн

74.2k17 gold badges123 silver badges140 bronze badges

4 Comments

Kamran Teymurov Over a year ago

Thank you very much it worked, now I want to write "document.getElementsByName("editable_text[67]").readonly = false;" , but it is not working. what is problem here whet do you think?

palaѕн Over a year ago

I have already mentioned about it and added a solution also in the 2nd demo.

palaѕн Over a year ago

btw, document.getElementsByName("editable_text[67]")[0].readonly = false; should work fine, this happens because getElementsByName returns an array of dom nodes, not a single node.

palaѕн Over a year ago

Please consider marking the answer as accepted to help future users too. Thanks!

Collectives™ on Stack Overflow

How can I get value of input array

3 Answers 3

3 Comments

1 Comment

4 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

3 Comments

1 Comment

4 Comments

Your Answer

Sign up or log in

Post as a guest

Related