Question

我不想使用serialize（）函数请帮帮我。我是初学者

HTML

        <input type='button' value='Add Tier Flavor' id='Add'>
        <input type='button' value='Remove Tier Flavor' id='Remove'>

        <div id='batch'>
            <div id="BatchDiv1">
                <h4>Batch #1 :</h4>
                <label>Flavor<input class="textbox" type='text' id="fl1" name="fl[]" value=""/></label></br>
                <label>Filling<input class="textbox" type='text' id="fi1" name="fi[]" value="" /></label></br>
                <label>Frosting<input class="textbox" type='text' id="fr1" name="fr[]" value=""/></label></br>

            </div>
        </div>
        <br>

    </div>

这是使用javascript动态添加的字段，代码为：

的javascript

  <script src="http://code.jquery.com/jquery-1.10.1.min.js"></script>

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

    var counter = 2;

    $("#Add").click(function () {

        if(counter>5){
            alert("Only 5 Tiers allow");
            return false;
        }
        var newBatchBoxDiv = $(document.createElement('div')).attr("id", 'BatchDiv' + counter);
        newBatchBoxDiv.html('<h4>Batch #'+ counter + ' : </h4>' +
            '<label> Flavor<input type="text" name="fl[]" id="fl' + counter + '" value=""></label><br>'+
            '<label> Filling<input type="text" name="fi[]" id="fi' + counter + '" value=""></label><br>'+
            '<label> Frosting<input type="text" name="fr[]" id="fr' + counter + '" value=""></label><br>' );

        newBatchBoxDiv.appendTo("#batch");

        counter++;
    });

    $("#Remove").click(function () {
        if(counter==1){
            alert("No more tier to remove");
            return false;
        }
        counter--;

        $("#BatchDiv" + counter).remove();
    });



});
 </script>

我想在数组中发布值，将其发布到下一个.php页面

我正在使用这个

        var user_cupfl =  $('input[name^="fl"]').serialize();
        var user_cupfi =  $('input[name^="fi"]').serialize();
        var user_cupfr = $('input[name^="fr"]').serialize();

序列化没有传递值。：（

在第二页我尝试使用

邮寄

   $message .= "<tr><td><strong>Cake Flavors(according to batches):</strong> </td><td><pre>" .implode("\n", $user_cupfl). "</pre></td></tr>";
            $message .= "<tr><td><strong>Filling type (Inside the cake):</strong> </td><td><pre>" .implode("\n", $user_cupfi). "</pre></td></tr>";
            $message .= "<tr><td><strong>Frosting type (top of the cake):</strong> </td><td><pre>" .implode("\n", $user_cupfr). "</pre></td></tr>";

我发布像这样的数组

  $user_cupfl=filter_var($_POST["userCupfl"], FILTER_SANITIZE_STRING);

$user_cupfi=filter_var($_POST["userCupfi"], FILTER_SANITIZE_STRING);
$user_cupfr=filter_var($_POST["userCupfr"], FILTER_SANITIZE_STRING);

您的回复将受到高度赞赏

Answer 1

仅仅因为您命名变量user_*并不意味着该字段的名称在序列化的POST数据中。您仍然在寻找$_POST['fl']，$_POST['fi']等。

我不明白为什么你认为你需要单独序列化一组输入组。您应该立即序列化整个表单。

我也没有理由为什么你需要将所有这些逻辑与计数器的唯一ID相对应而不是。如果您根本没有使用id，请完全放弃它们。

您可能还会考虑使用克隆技术来生成动态添加的字段。通过执行这些操作，您可以大大简化所有javascript代码。

更合理的实现可能如下所示。

HTML（清理代码 - 一致使用属性的双引号，更好的类和id使用策略等）

<div id="batch">
    <div class="batchDiv">
        <h4 class="batchLabel">Batch #1 :</h4>
        <label>Flavor</label>
        <input class="textbox" type="text" name="fl[]" value=""/>
        </br>
        <label>Filling</label>
        <input class="textbox" type="text" name="fi[]" value="" />
        </br>
        <label>Frosting</label>
        <input class="textbox" type="text" name="fr[]" value=""/>
        </br>
    </div>
</div>

使用Javascript：

$(document).ready(function() {
    $('#Add').click(function(){
        var $existingBatches = $('.batchDiv');
        var count = $existingBatches.size();
        if (count < 5) {
            // get last batch div
            var $newBatch = $existingBatches.last().clone();
            // reset input values to empty string
            $newBatch.find('input').val('');
            // change batch label
            count++;
            $newBatch.find('.batchLabel').html('Batch #' + count + ' :');
            // append to document
            $newBatch.appendTo('#batch');
        } else {
            // alert or whatever
        }
    });

    $('#Remove').click(function(){
        var $existingBatches = $('.batchDiv');
        var count = $existingBatches.size();
        // delete last batch item if more than 1 exists
        if(count > 1) {
            $existingBatches.last().remove();
        } else {
            // alert or whatever
        }
    });
});

现在您还没有展示您的AJAX代码，但您需要做的就是：

var url = '/some/url';
var postData = $('[some form selector]').serialize();
var dataType = '...'; //whatever dataType you are expecting back
$.post(url, postData, function(){
    // success handler
}, dataType));

您的数据然后在$_POST['fl']等的PHP脚本中可用

使用jquery和ajax发布文本字段数组

1 个答案: