如何为动态生成的输入字段添加记录

时间:2012-06-22 10:03:58

标签: php javascript mysqli

我有一个表单,单击“添加更多按钮”时会出现新字段。我怎样才能将它们存储到php变量中然后放入mysql数据库。 我有php和mysql的工作知识。 我的HTML和javascript代码如下:                            

  <script type="text/javascript">
   function($) {

$.fn.relCopy = function(options) {
    var settings = jQuery.extend({
        excludeSelector: ".exclude",
        emptySelector: ".empty",
        copyClass: "copy",
        append: '',
        clearInputs: true,
        limit: 0 // 0 = unlimited
    }, options);

    settings.limit = parseInt(settings.limit);

    // loop each element
    this.each(function() {

        // set click action
        $(this).click(function(){
            var rel = $(this).attr('rel'); // rel in jquery selector format             
            var counter = $(rel).length;

            // stop limit
            if (settings.limit != 0 && counter >= settings.limit){
                return false;
            };

            var master = $(rel+":first");
            var parent = $(master).parent();                        
            var clone = $(master).clone(true).addClass(settings.copyClass+counter).append(settings.append);

            //Remove Elements with excludeSelector
            if (settings.excludeSelector){
                $(clone).find(settings.excludeSelector).remove();
            };

            //Empty Elements with emptySelector
            if (settings.emptySelector){
                $(clone).find(settings.emptySelector).empty();
            };                              

            // Increment Clone IDs
            if ( $(clone).attr('id') ){
                var newid = $(clone).attr('id') + (counter +1);
                $(clone).attr('id', newid);
            };

            // Increment Clone Children IDs
            $(clone).find('[id]').each(function(){
                var newid = $(this).attr('id') + (counter +1);
                $(this).attr('id', newid);
            });

            //Clear Inputs/Textarea
            if (settings.clearInputs){
                $(clone).find(':input').each(function(){
                    var type = $(this).attr('type');
                    switch(type)
                    {
                        case "button":
                            break;
                        case "reset":
                            break;
                        case "submit":
                            break;
                        case "checkbox":
                            $(this).attr('checked', '');
                            break;
                        default:
                          $(this).val("");
                    }                       
                });                 
            };

            $(parent).find(rel+':last').after(clone);

            return false;

        }); // end click action

    }); //end each loop

    return this; // return to jQuery
};

   })(jQuery);

    </script>

   <script type="text/javascript">
   $(function(){
   var removeLink = ' <a class="remove" href="#" onclick="$(this).parent().slideUp(function(){ $(this).remove() }); 
 return false">remove</a>';
 $('a.add').relCopy({ append: removeLink}); 
 });
  </script>
  <style type="text/css">
   body{ font-family:Arial, Helvetica, sans-serif; font-size:13px; }
   .remove {color:#cc0000}
   .input{ border: solid 1px #006699; padding:3px}

    </style>
    </head>

   <body>
  <form method="post" action="">
  <table width="580" border="1" class="clone" rules="groups" align="center">
  <tr>
  <td width="129" height="29" align="right"><strong>Child Name :</strong></td>
  <td width="435"><input name="petname[]" type="text" class="txt_box" id="petname" />
  </td>
  </tr>
  <tr>
  <td align="right" height="29"><strong>Pet Image :</strong></td>
  <td><input name="petimage[]" type="file" class="txt_box" id="petimage" /></td>
  </tr>

  </table>
  <p style=" margin-left:60px;"><a href="#" class="add" rel=".clone">Add More</a></p>
  </form>
  </body>
  </html>

1 个答案:

答案 0 :(得分:0)

发布表单后,您可以使用以下方式获取发布数据的值:

$_POST在一个数组中。

然后,您需要遍历要插入数据库的数组。

一个例子:

 <?php
    $con = mysql_connect("localhost","username","password");
    if (!$con)
      {
      die('Could not connect: ' . mysql_error());
      }

    mysql_select_db("my_db", $con);

    mysql_query("INSERT INTO tablename(FirstName, LastName, Age)
    VALUES ('test', 'name',25)");
    mysql_close($con);
?>