Unable to pull a php input array into JQuery

[ajoo]

Hi all, 

This bit of code creates an array of input fields using php:-

.
.
.
$count = 10;
echo "<tr>";
  for($j=0; $j<$count; $j++)
  {
     echo "<td class=userinp> <input type='text' id='reply[]' value='' ></td>";
  }	
echo "</tr>";
.
.                       
                    

I wish to process the values entered in the input fields using JQuery. How can I fetch these user inputs into JQuery correctly ?

My JQuery code is :

		$("#checkbutton").click(function(){
			var test_arr = $("input#reply");
			$.each(test_arr, function(i, item) {
				val = $(item).val();
				alert(i+" : "+ val);
			});
		});

which displays only the first value of the user input box. It is thus not fetching the array . Please point out the mistake or the correct method to achieve this.

Thanks !

 

 

 

[ajoo]

ok Guys, I got it !

While this

var test_arr = $("input#reply");

works for dynamically created input boxes using JS, it does not work for boxes created using php.

This works though

test_arr = $("input[id='reply[]']");

 I thought the first one looked more elegant !

Thanks !

 

[kicken]

First off, for form fields you use the name attribute to define the name they are submitted as, not the id attribute.  Secondly you can't have multiple elements with the same id attribute in html. ID's have to be unique. 

Once you fix that, then you can either query for them by the name or by giving them all a common class and using a class selector.

<input type='text' name='reply[]' value=''>

var test_arr = $('[name="reply[]"]');

 

Edited May 17, 2019 by kicken

[ajoo]

Hi Kicken !

Thanks for the reply and for introducing me to the correct usage ! Even though  I am getting the correct answer by using an array for both names and id's and then targeting the id to get the values of the array in JS, getting to know the correct form is so essential. 

Thanks loads for the correction !

 

 

[ajoo]

Hi, 

I have another but related question, so I will continue it here rather than in a new thread. I hope that is ok.

SO if I modify my code as shown by Kicken like below:-

<?php 

$count = 10;
echo "<tr>";
  for($j=0; $j<$count; $j++)
  {
     echo "<td> <input type='text' name='reply[]'class="ansbox" value=''></td>";
  }	
echo "</tr>";
?>

and once the form has submitted the 10 post values, how can I print those back into their respective places using PHP not JS. I know it will have to echo them inside their value ' ' fields, having checked first if they have been set using isset( .. ), but I don't know the correct syntax to achieve that. 

Thanks all !

 

Edited May 17, 2019 by ajoo

[Barand]

echo "<td> <input type='text' name='reply[]'class="ansbox" value='$value'></td>";

Have you tried this?

[ajoo]

Hi Guru Barand, 

For an HTML form that is not echoed out in php, the $value variable is checked that it exists, before it is echoed out.

value="<?php if(isset($value)) echo html_escape($value);?>"

 

How Is it possible to do the same here ?

echo "<td> <input type='text' name='reply[]'class="ansbox" value='$value'></td>";

 I have tried without success. 

Thanks.

Edited May 18, 2019 by ajoo

[kicken]

The values would be coming into PHP as part of the $_POST array so you'd check if they exist there and if so echo the value back out.

<?php 
$count = 10;
echo "<tr>";
for($j=0; $j<$count; $j++)
{
    $value = $_POST['reply'][$j] ?? '';
    echo "<td> <input type='text' name='reply[]' class='ansbox' value='" . htmlspecialchars($value) . "'></td>";
}	
echo "</tr>";