如何将动态添加的文本框（JavaScript）中的多个数据保存到MySQL数据库中？ [英] How to save multiple data from dynamically added text-boxes (JavaScript) into MySQL database?

问题描述

我一直在为此尝试，但没有成功。我正在使用PHP，HTML，JavaScript和MySQL。这是我的HTML代码：

 < div id =Author> 
< LI>作者< / LI> 
< input type =textname =Author []value =1./> 
< input type =buttonvalue =+id =Authorbuttononclick =addAuthor（）/> 
< / div> 
  

如果点击添加按钮，另一个文本框将会出现，并且用户将被输入另一个名称。这是我的JavaScript：

  var counter3 = 0; 
函数addAuthor（）{
 //获取所有其他div将被添加的主Div 
 var mainContainer = document.getElementById（'Author'）; 
 
 //创建一个用于保存文本和按钮输入元素的新div 
 var newDiv = document.createElement（'div'）; 
 
 //创建一个新的文本输入
 var newText = document.createElement（'input'）; 
 newText.type =text; 
 // var i = 1; 
 newText.name =Author []; 
 newText.value = counter3 + 2 +。; 
 
 //计数器从2开始，因为我们已经有一个项目
 //newText.class =input.text; 
 //创建一个新的按钮输入
 var newDelButton = document.createElement（'input'）; 
 newDelButton.type =button; 
 newDelButton.value = - ; 
 
 //将新文本输入追加到newDiv 
 newDiv.appendChild（newText）; 
 //将新的按钮输入添加到newDiv 
 newDiv.appendChild（newDelButton）; 
 //将newDiv输入附加到mainContainer div 
 mainContainer.appendChild（newDiv）; 
 counter3 ++; 
 // i ++; 
 
 //添加一个处理程序到按钮从mainContainer中删除newDiv 
 newDelButton.onclick = function（）{
 mainContainer.removeChild（newDiv）; 
 counter3--; 
 
 
 $ / code $ / pre 
 
 
这是我的PHP代码：
  if（！$ con）
 {
 die（'Could not connect：'。mysql_error（））; 
} 
 
 mysql_select_db（$ database，$ con）; 
 
 
 $ b $ sql =插入savetest（类型，数字）
 VALUES 
（'$ _POST [type]'，'$ _ POST [作者]'）; $！
 $ b if（！mysql_query（$ sql，$ con））
 {
 die（'Error：'。mysql_error（））; 
} 
回声添加1条记录; 
 
 mysql_close（$ con）; 
回声感谢您提交您的详细资料！; 
  
我听到很多人可以通过使用数组来获得这个工作，但是我存储的数据数据库是 Array 。无论我创建多少个文本框，只需 Array 。
 
 
 
我使用正确的方法吗？我应该在一个数据库字段中保存这个数据数组吗？
解决方案 
  if（！$ con）{
 die（'Could not connect：'。mysql_error（））; 
} 
 
 mysql_select_db（$ database，$ con）; 
 
 $ authors = $ _POST ['Author']; 
 foreach（$ authors as $ author）：
 $ sql =INSERT INTO savetest（type，number）VALUES（'{$ _POST ['type']}'，'{$ author}'） ; 
 
 if（！mysql_query（$ sql，$ con））{
 die（'Error：'。mysql_error（））; 
} 
 endforeach; 
  
 
I have been trying for this but no success. I am using PHP, HTML, JavaScript, and MySQL. Here is my HTML code:
<div id="Author">
    <LI>Author</LI> 
    <input type = "text" name="Author[]" value = "1. "/>
    <input type="button" value="+" id="Authorbutton" onclick="addAuthor()" />
</div>
If add button is clicked, another textbox will appear and user and put in another name. Here is my JavaScript:
var counter3 = 0;
function addAuthor() {
    // Get the main Div in which all the other divs will be added
    var mainContainer = document.getElementById('Author');

    // Create a new div for holding text and button input elements
    var newDiv = document.createElement('div');

    // Create a new text input
    var newText = document.createElement('input');
    newText.type = "text";
    //var i = 1;
    newText.name = "Author[]";
    newText.value = counter3 + 2 + ". ";

    //Counter starts from 2 since we already have one item
    //newText.class = "input.text";
    // Create a new button input
    var newDelButton = document.createElement('input');
    newDelButton.type = "button";
    newDelButton.value = "-";

    // Append new text input to the newDiv
    newDiv.appendChild(newText);
    // Append new button input to the newDiv
    newDiv.appendChild(newDelButton);
    // Append newDiv input to the mainContainer div
    mainContainer.appendChild(newDiv);
    counter3++;
    //i++;

    // Add a handler to button for deleting the newDiv from the mainContainer
    newDelButton.onclick = function() {
        mainContainer.removeChild(newDiv);
        counter3--;
    }
}
Here is my PHP code:
if (!$con)
  {
  die('Could not connect: ' . mysql_error());
  }

mysql_select_db($database, $con);



$sql="INSERT INTO savetest (type, number)
VALUES
('$_POST[type]','$_POST[Author]')";

if (!mysql_query($sql,$con))
  {
  die('Error: ' . mysql_error());
  }
echo "1 record added";

mysql_close($con);
echo "Thank you for submitting your details!";
I heard a lot of people can get this to work by using arrays, but the data I stored in the database is Array. It does not matter how many textboxes I've created, just Array.

Am I using the correct approach? Should I save this array of data in one database fields?
解决方案
if (!$con){
   die('Could not connect: ' . mysql_error());
}

mysql_select_db($database, $con);

$authors = $_POST['Author'];
foreach($authors as $author) :
    $sql="INSERT INTO savetest (type, number) VALUES ('{$_POST['type']}','{$author}')";

    if (!mysql_query($sql,$con)){
       die('Error: ' . mysql_error());
    }
endforeach;


                        
这篇关于如何将动态添加的文本框（JavaScript）中的多个数据保存到MySQL数据库中？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！