1

我有页面，用户可以添加日期范围、至和价格。默认情况下有三个，但用户可以使用添加日期范围按钮按钮添加更多范围。我的问题是，在我获得$_POST值时添加了一些额外的日期范围后，它没有显示附加的 html 元素的 post 值。

javascript部分

var n = 0;
$(document).ready(function () {

    $("#btn2").click(function () {
        $("#add_drange").append(" <p><input type='text' name='from" + n + "' class='datepicker' placeholder='From' />&nbsp;&nbsp;<input type='text' name='to" + n + "' class='datepicker' placeholder='To' />&nbsp;&nbsp;<input type='text'  name='price" + n + "'id='price' placeholder='Price in USD' /></p>");

        n = n + $("#add_drange").length;
        //c = c + n;
        //alert(n);
        if (n == 25) {
            alert('You can only add 25 Date Ranges');
            event.preventDefault();
            $("#btn2").hide();
        }
        $(".datepicker").datepicker({
            dateFormat: 'yy-mm-dd'
        }).val();
    });
});

HTML

<div id="add_drange">
    <br>
    <h1>Add Price for Date Ranges</h1>
    <br>
    <form action="" method="post" name="add_price">
        <p>
            <input type="text" name="from_f_1" class="datepicker" placeholder="From" />&nbsp;&nbsp;
            <input type="text" name="to_f_1" class="datepicker" placeholder="To" />&nbsp;&nbsp;
            <input type="text" name="price_f_1" id="price" placeholder="Price in USD" />
        </p>
        <p>
            <input type="text" name="from_f_2" class="datepicker" placeholder="From" />&nbsp;&nbsp;
            <input type="text" name="to_f_2" class="datepicker" placeholder="To" />&nbsp;&nbsp;
            <input type="text" name="price_f_2" id="price" placeholder="Price in USD" />
        </p>
        <p>
            <input type="text" name="from_f_3" class="datepicker" placeholder="From" />&nbsp;&nbsp;
            <input type="text" name="to_f_3" class="datepicker" placeholder="To" />&nbsp;&nbsp;
            <input type="text" name="price_f_3" id="price" placeholder="Price in USD" />
        </p>
</div>
<br>
<input type="button" id="btn2" name="add_more" value="AddMore Data Ranges" />
<br>
<br>
<br>
<br>
<h1>Alter you Base Price for Each Day of the Week</h1>

<br>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla quam velit, vulputate eu pharetra nec, mattis ac neque. Duis vulputate commodo lectus, ac blandit elit tincidunt id. Sed rhoncus, tortor sed eleifend tristique, tortor mauris molestie elit, et lacinia ipsum quam nec dui.</p>
<br>
<input type="text" id="" name="sunday" placeholder="Sunday" size="8" />&nbsp;&nbsp;
<input type="text" id="" name="monday" placeholder="Monday" size="8" />&nbsp;&nbsp;
<input type="text" id="" name="tuesday" placeholder="Tuesday" size="8" />&nbsp;&nbsp;
<input type="text" id="" name="wednesday" placeholder="Wednesday" size="8" />&nbsp;&nbsp;
<input type="text" name="Thursday" id="" placeholder="Thursday" size="8" />&nbsp;&nbsp;
<input type="text" name="Friday" id="" placeholder="Friday" size="8" />&nbsp;&nbsp;
<input type="text" name="Saturday" id="" placeholder="Saturday" size="8" />
<br>
<br>
<input type="submit" id="save" name="save_all" value="save" style="float: right;" />
</form>

PHP

///dynamic created text feild part
$dynamic_feild;

    for($n=0;$n<25;$n++)
    {

     $dynamic_feild[$n][0]=$_POST['from'."$n"];
     $dynamic_feild[$n][1]=$_POST['to'."$n"];
     $dynamic_feild[$n][2]=$_POST['price'."$n"];

    } 
var_dump($dynamic_feild);
4

3 回答 3

5

检查您的 HTML 是否存在不正确的嵌套。
具体来说，查看<div id="add_drange">and<form>标签。

看起来它没有正确嵌套......更像这样：

<div id="add_drange">
    <form>
</div>
</form>

您的浏览器会将其更新为以下内容以使其有效：

<div id="add_drange">
    <form>
    </form>
</div>

然后，当您将新字段附加到 时#add_drange，它实际上在表单之外。

要修复它，要么直接附加到<form>标签，要么将#add_drangediv 完全移动到表单内。

于 2013-06-07T04:20:00.263 回答
2 
 $("#add_drange form").append(" <p><input type='text' name='from" + n + "' class='datepicker' placeholder='From' />&nbsp;&nbsp;<input type='text' name='to" + n + "' class='datepicker' placeholder='To' />&nbsp;&nbsp;<input type='text'  name='price" + n + "'id='price' placeholder='Price in USD' /></p>");

试试这个追加

于 2013-06-07T04:21:51.270 回答
1

我认为不要使用 n = n + $("#add_drange").length; 在您的 jquery 中，您可以使用

n = parseInt(jQuery('#index').val()) + 1;

保留一个初始值为 4 的隐藏输入框。因为您已经有 3 个元素用于范围。

<input type="hidden" name="index" id="index" value="4" />

它可用于查找您在 POST 期间使用的元素数量。

于 2013-06-07T04:26:52.250 回答