在表单上添加更多字段并插入到mysql数据库中

时间:2011-03-28 23:33:59

标签: php javascript mysql

我有一个表单,我想添加更多项目链接以添加三个文本框。用户可以添加最多7次。这意味着用户可以一次输入7个项目。

第二个是我想将这7个项目插入到单独行的mysql表中。我怎么能这样做。

<form name="frmaddservice" action="" method="post" class="jNice" onsubmit="return checkaddservice();">

    <p><label>Customer Name:</label><input name="txtcustname" type="text" class="text-long" /></p>
    <p><label>Customer Phone:</label><input name="txtcustphone" type="text" class="text-long" /></p>        
    <p><label>Customer Email:</label><input name="txtcustemail" type="text" class="text-long" /></p>
    <div id="fieldset">
    <p><label>Item Type:</label>
        <select name="seltype">
        <option>Select Type</option>
        <?php
            while($rowitem = mysql_fetch_assoc($seltype))
            {
        ?>
            <option><?php echo $rowitem['item_name']; ?></option>
        <?php
            }
        ?>
        </select>
    </p>
    <p><label>Item Brand</label><input name="txtitembrand" type="text" class="text-long"></textarea></p>        
    <p><label>Item Quantity:</label><input name="txtqty" type="text" class="text-long" /></p>        
    <p><label>Item Description</label><textarea name="txtdesc"></textarea></p>
    <p><label>Item Warranty Date:</label><input name="txtdate" type="text" class="text-long" /> 
    <script language="JavaScript">
        new tcal ({
        // form name
        'formname': 'frmaddservice',
        // input name   
        'controlname': 'txtdate'
        });
    </script>
    </p>

    <input type="submit" value="Add Service"/>
    </div>

</form>

我上传了the file here,请看一下。

验证码

<SCRIPT TYPE="TEXT/JAVASCRIPT">function IsNumeric(strString)
{
    var strValidChars = "0123456789";
    var strChar;
    var blnResult = true;
    if (strString.length == 0) return false;
    for (i = 0; i < strString.length && blnResult == true; i++)
    {
        strChar = strString.charAt(i);
        if (strValidChars.indexOf(strChar) == -1)
        {
            blnResult = false;
        }
    }
        return blnResult;
}function checkaddservice(){
with (window.document)
{
    if(frmaddservice.txtcustname.value == "")
    {
        alert("Please enter Customer's Name.");
        frmaddservice.txtcustname.focus();
        return false;
    }
    if(frmaddservice.txtcustphone.value == "")
    {
        alert("Please enter Customer's phone.");
        frmaddservice.txtcustphone.focus();
        return false;
    }
    if(IsNumeric(frmaddservice.txtcustphone.value) == "false")
    {
        alert("Please enter Valid phone.");
        frmaddservice.txtcustphone.focus();
        return false;
    }
    for(var i=0; i<7; i++)
    {
        if(frmaddservice.elements["seltype" + i].value == "Select Type")
        {
            alert("Please Select Item Type!");
            return false;
        }
        if(frmaddservice.elements["txtqty" + i].value == "")
        {
            alert("Please Enter Item Quantity!");
            return false;
        }
        var qty = frmaddservice.elements["txtqty" + i].value;
        if(IsNumeric(qty) == "false")
        {
            alert("Please Enter Valid Quantity!");
            frmaddservice.elements["txtqty" + i].focus();
            return false;
        }
    }
}}</SCRIPT>

3 个答案:

答案 0 :(得分:0)

  • []添加到name属性的末尾。
  • 在按钮的click上克隆它们。
  • 检查以确保继续操作时少于7个。

答案 1 :(得分:0)

你必须使用php吗?如果你使用javascript,你可以添加字段而不刷新页面。

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
<link href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/themes/base/jquery-ui.css" rel="stylesheet" type="text/css"/>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.5.1/jquery.min.js"></script>
<script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.11/jquery-ui.min.js"></script>
<script type="text/javascript" charset="utf-8">
    $(function(){

    $(".datepicker").live('click', function() {
        $(this).datepicker({showOn:'focus'}).focus();
    });
    });
    </script>
<script type="text/javascript">
var num=0;
function addField(){
    num++;
    if(num>7){num--;}
    makefields();
}
function rmField(){
    num--;
    if(num<0){num++;}
    makefields();
}

function makefields(){
var fields="";
for(var o=0;o<=num;o++){
fields+="<p><label>Item Type:</label><select name=\"seltype"+o+"\"><option>Select Type</option>";
<?php $seltype = mysql_query("select * from tblitemtype"); while($rowitem = mysql_fetch_assoc($seltype)){ echo "fields+=\"<option>".$rowitem['item_name']."</option>\";"; } ?>
fields+="</select></p>";
fields+="<p><label>Item Brand</label><input name=\"txtitembrand"+o+"\" type=\"text\" class=\"text-long\"></textarea></p>";
fields+="<p><label>Item Quantity:</label><input name=\"txtqty"+o+"\" type=\"text\" class=\"text-long\" /></p>";
fields+="<p><label>Item Description</label><textarea name=\"txtdesc"+o+"\"></textarea></p>";
fields+="<p><label>Item Warranty Date:</label><input name=\"txtdate"+o+"\" type=\"text\" class=\"datepicker\">";
}
fields+="<br/><input type=\"hidden\" name=\"num\" value=\""+o+"\"/>";
if(num!=6){fields+="<button type=\"button\" onclick=\"addField()\">Add</button>";}
if(num>0){fields+="<button type=\"button\" onclick=\"rmField()\">Remove</button>";}
fields+="<input type=\"submit\" value=\"Add Service\"/></form>";
    document.getElementById("fields").innerHTML=fields;
}
</script>
<script language="JavaScript" src="calendar_us.js"></script>

</head>

<body>
<form name="frmaddservice" action="" method="post" class="jNice" onsubmit="return checkaddservice();">
<fieldset>
    <p><label>Customer Name:</label><input name="txtcustname" type="text" class="text-long" /></p>
    <p><label>Customer Phone:</label><input name="txtcustphone" type="text" class="text-long" /></p>        
    <p><label>Customer Email:</label><input name="txtcustemail" type="text" class="text-long" /></p>
    <div id="fields">
    <p><label>Item Type:</label>
        <select name="seltype0">
        <option>Select Type</option>
        <?php $seltype = mysql_query("select * from tblitemtype");
            while($rowitem = mysql_fetch_assoc($seltype))
            {
        ?>
            <option><?php echo $rowitem['item_name']; ?></option>
        <?php
            }
        ?>
        </select>
    </p>
    <p><label>Item Brand</label><input name="txtitembrand0" type="text" class="text-long"></textarea></p>       
    <p><label>Item Quantity:</label><input name="txtqty0" type="text" class="text-long" /></p>        
    <p><label>Item Description</label><textarea name="txtdesc0"></textarea></p>
    <p><label>Item Warranty Date:</label><input name="txtdate0" type="text" class="datepicker"/> 
    </p>
    <input type="hidden" name="num" value="1"/><a href="#" onclick="addField()">Add</a>
    <input type="submit" value="Add Service"/>
    </div>
</fieldset>
</form>


</body>
</html>

然后您需要修改此脚本以容纳所有字段并将数据发送到您拥有的不同表:

<?php
//your connection data
$sets=mysql_real_escape_string($_REQUEST["num"]);
for($loop=0;$loop<$sets;$loop++){
    $b="txtitembrand".$loop;
    $q="txtqty".$loop;
    $d="txtdesc".$loop;
        $brand=mysql_real_escape_string($_REQUEST[$b]);
        $quantity=mysql_real_escape_string($_REQUEST[$q]);
        $description=mysql_real_escape_string($_REQUEST[$d]);
    $store="INSERT INTO tablename (itembrand,quantity,desc) VALUES ('$brand',$quantity,'$description')";
    $go=mysql_query($store);
    }
?> 

答案 2 :(得分:0)

首先,您的HTML看起来有点滑稽...... 我只想稍微修改一下:

<fieldset>
  <label for='brand'>Item Brand</label><br>
  <input id='brand' name="txtitembrand" type="text" class="text-long"><br>   
  <label for='quantity'>Item Quantity</label><br>
  <input id='quantity' name="txtqty" type="text" class="text-long"><br>      
  <label for='desc'>Item Description</label><br>
  <textarea id='desc' name="txtdesc"></textarea><br>
  <input type="submit" value="Add Service"/>
</fieldset>

然后,对于链接,你可以有类似的东西,

<a href='/mypage.php?action=addrows&numrows=7'>Add more rows!</a>

将由php代码生成,如:

echo '<a href="/mypage.php?action=addrows&numrows=' . $_SESSION['numrows'] . '>Add more rows!</a>';

您可以跟踪会话变量中的numrows。 然后添加行将如下所示:

if (isset($_GET['action']) && $_GET['action'] == 'addrows') {
  if (isset($_GET['numrows'])) {
    $numrows = 0 + $_GET['numrows'] // add zero to cast to int
    if ($numrows > 0 && $numrows <= 7) {
      $_SESSION['numrows'] = $numrows;
    }
  }
}

之后您可以使用$ _SESSION ['numrows']来呈现您的HTML:

for ($i = 0; $i < $_SESSION['numrows']; $i++): ?>
 <fieldset>
  ...
   <input ... name='txtqty<?php echo $i ?>'
  ...
 </fieldset>
 <?php endfor; ?>

导致字段名称txtqty1,txtqty2,txtqty3等达到7。 然后,当您处理表单时,只需检查每个字段是否存在。

或者,您可以在JavaScript中实现此行为,正如Robot Woods上面所建议的那样。

对于您的SQL,您可以插入多行,如下所示:

INSERT INTO tablename (col1, col2, col3...)
VALUES (row1col1, row1col2, row1col3...) (row2col1...)