0

我已经重建我的表格以更好地适应我需要它做的事情。现在我只需要知道如何将值输入到我的数据库中。

我的表单字段根据需要复制并命名为 form[0][name] 以便它们可以被视为单独的字段。jsFiddle 在这里http://jsfiddle.net/2fDYs。

功能;

$(document).ready(function() {
    var newNum = 2;
    cloneMe = function(el) {
        var newElem = el.clone().attr('id', 'container' + newNum);
        newElem.children().each(function(index, elem) {
            //$(elem).attr('id', $(elem).attr('id') + newNum).attr('name', $(elem).attr('name')+ newNum);
            var $elem = $(elem);
            $elem.attr('id', $elem.attr('id') + newNum);
            var ename = $elem.attr('name');
            if (ename) {
                $elem.attr('name',ename.replace('form[0]','form['+newNum+']'));
            }
        });
        $('#cloneb').before(newElem);
        $('#delete_name'+ newNum).html('<p id="rem_field"><a href="#"><span>Delete Line</span></a></p>');
        newNum++;
    };

    $('p#rem_field').live('click', function() {
    $(this).parents('div').remove();
    return false;
});    

});

形式;

<form action='' method='post' enctype='multipart/form-data' name='form' id='form'>
    <div id="container1">
        <label>Style:</label>
            <select name='form[0][style]' id='style' class='style' onchange="showDim(this)">
                <option value='0' class='red'>Select a style...</option>            
                    <?php
                    include ('connect.php');
                    $getsty = $db->prepare("SELECT Style_ID, Style_Type FROM style ORDER BY Style_Type ASC LIMIT 1, 18446744073709551615;"); 
                    $getsty->execute();
                        while($row = $getsty->fetch(PDO::FETCH_ASSOC)) {    
                            $Style_ID = $row['Style_ID'];
                            $Style_Type = $row['Style_Type'];                   
                        echo "      <option value='$Style_ID'>$Style_Type</option>";
                        }                                       
                    ?>   
            </select>                                   
        <br />
        <div class='dimdiv'>                    
            <label>Dimensions:</label>
                <select name='form[0][Dim]' id='Dim'>
                    <option value='0' class='red'>Select the dimensions...</option> 
                </select>                       
        </div>
        <br />
        <label>Colour:</label> 
            <select name='form[0][Colour]' id='Colour'>
                <option value='0' class='red'>Select a colour...</option>
                <option value='Colour1'>Colour #1</option>
                <option value='Colour2'>Colour #2</option>
                <option value='Colour3'>Colour #3</option>
                <option value='Colour4'>Colour #4</option>
            </select>
        <br />  
        <label>Quantity:</label> <input type='text' name='form[0][Quantity]' id='Quantity'>
        <br />          
        <div id="delete_name" style="margin:15px 0px 0px 0px; width:120px; height:30px;"></div> 
        <hr />
    </div>
    <input type="button" id="cloneb" value="Clone" onclick="cloneMe($('#container1'));" />
    <input type='submit' name='post' value='Place Order' class='buttons' />
</form>

我将如何将每个单独的“克隆”表单作为自己的行插入到数据库中？

这是我有限的知识所能得到的。

<?php               
    if(isset($_POST['submit'])) { 
        $i = 0;
        foreach ($_POST as $val){   
            $style = $_POST['form'][$i]['style'];
            $Dim= $_POST['form'][$i]['Dim'];
            $Colour= $_POST['form'][$i]['Colour'];
            $Quantity= $_POST['form'][$i]['Quantity'];

    include ('connect.php');    

    $stmt = $db->prepare("INSERT INTO details(Style, Dimensions, Colour, Quantity) VALUES(:Style,:Dimensions,:Colour,:Quantity)");

    $stmt->execute(array(':Style' => $Style, ':Dimensions' => $Dim, ':Colour' => $Colour, ':Quantity' => $Quantity));     

        $i++;
        } 
    }           
?>

编辑：输入到数据库中的值都相同，除了“样式”字段。它们都采用最后一个复制形式的值。

4

1 回答 1

0

您的 JS 代码不起作用，这就是为什么您只收到一行。

您可以编辑新的元素内容，而不是遍历子元素。

var newElem = el.clone().attr('id', 'container' + newNum);
newElem.html(newElem.html().replace(/form\[0\]/g, 'form['+newNum+']'));
newElem.html(newElem.html().replace(/id="(.*?)"/g, 'id="1'+newNum+'"'));

http://jsfiddle.net/fMSa3/1/

于 2013-10-11T07:06:35.483 回答