Dynamic Form : Create and remove inputs

Asked

Viewed 1,241 times

0

I am trying to develop a form that creates and removes inputs according to the user’s choice.

I was able to create only one type of input at a time through javascript, but the project has 9 input per generated line. That is, each time the user clicks, it must generate 9 different inputs and then store tds the inputs in the Database.

I don’t know the most viable way to do this. If it would be the case to learn a new programming language, I would like to know which is the best p to do this command.

Thanks qq help I’ve looked and n to cn

php input dinâmico

1 answer

1


One of the ways to do this would be, as you yourself mentioned, to use javascript to create the form. To save, you can use PHP, for that, when creating the form, would be created an array of fields. When posting the form, PHP would loop this array and save a record for each row of the form.

Here is a simple example, using Jquery that adds a line with 3 fields. The link with step by step you can see at this address. http://talkerscode.com/webtricks/create-dynamic-form-using-php-jquery-and-mysql.php

Below follows the form:

<html>
<head>
<link href="form_style.css" type="text/css" rel="stylesheet"/>
<script src="https://code.jquery.com/jquery-3.4.1.min.js"
  integrity="sha256-CSXorXvZcTkaix6Yvo6HppcZGetbYMGWSFlBw8HfCJo="
  crossorigin="anonymous"></script>
<script type="text/javascript">
function add_row()
{
 $rowno=$("#employee_table tr").length;
 $rowno=$rowno+1;
 $("#employee_table tr:last").after("<tr id='row"+$rowno+"'><td><input type='text' name='name[]' placeholder='Enter Name'></td><td><input type='text' name='age[]' placeholder='Enter Age'></td><td><input type='text' name='job[]' placeholder='Enter Job'></td><td><input type='button' value='DELETE' onclick=delete_row('row"+$rowno+"')></td></tr>");
}
function delete_row(rowno)
{
 $('#'+rowno).remove();
}
</script>
</head>
<body>
<div id="wrapper">

<div id="form_div">
 <form method="post" action="store_detail.php">
  <table id="employee_table" align=center>
   <tr id="row1">
    <td><input type="text" name="name[]" placeholder="Enter Name"></td>
    <td><input type="text" name="age[]" placeholder="Enter Age"></td>
    <td><input type="text" name="job[]" placeholder="Enter Job"></td>
   </tr>
  </table>
  <input type="button" onclick="add_row();" value="ADD ROW">
  <input type="submit" name="submit_row" value="SUBMIT">
 </form>
</div>

</div>
</body>
</html>

And here is the PHP page that will record the data:

<?php
if(isset($_POST['submit_row']))
{
 $host="localhost";
 $username="root";
 $password="";
 $databasename="sample";
 $connect=mysql_connect($host,$username,$password);
 $db=mysql_select_db($databasename);	 
 
 $name=$_POST['name'];
 $age=$_POST['age'];
 $job=$_POST['job'];
 for($i=0;$i<count($name);$i++)
 {
  if($name[$i]!="" && $age[$i]!="" && $job[$i]!="")
  {
   mysql_query("insert into employee_table values('$name[$i]','$age[$i]','$job[$i]')");	 
  }
 }
}
?>

  • Thank you very much Bins.

  • Could you help me a little more? I’m trying to get the inputs to be created according to the range of days. I was able to do it with the fixed table, but I can’t do it with the stick. The first step would be a for with the variable that stores the number of days, but it simply accepts n. Have any suggestions?

Browser other questions tagged php input dinâmico

You are not signed in. Login or sign up in order to post.