Question

这就是我想要做的。有一个主表单包含所有数据，并有几个对话框，数据将从中添加到主表单。

在所有数据都在主表单中后，我将提交表单。但问题是，当我将html复制到主窗体时，它不会保存对话框中数据的值。它不会将值放在post字符串中，post字符串将显示名称但包含空值。

这是我的HTML：

<div class="form">
<form method="post" enctype="multipart/form-data" action="/admin/home/create/" class="niceform">
    <fieldset>
        <dl>
            <dt><label>Name:</label></dt>
            <dd><input class="NFText" name="name" id="" size="54" type="text"></dd>
        </dl>
        <dl>
            <dt><label>StaffPicks:</label></dt>
            <dd >
                <a onClick="openStaffPickDialog()" class="bt_green"><span class="bt_green_lft"></span><strong>Manage Staffpicks</strong><span class="bt_green_r"></span></a></dd>
        </dl>
        <dl>
            <dt><label>Reviews:</label></dt>
            <dd><a onClick="openReviewDialog()" class="bt_green"><span class="bt_green_lft"></span><strong>Manage Reviews</strong><span class="bt_green_r"></span></a></dd>
        </dl>
        <dl>
            <dt><label>Carousel(Add Slide to Carousel):</label></dt>
            <dd><a onClick="openCarouselDialog()" class="bt_green"><span class="bt_green_lft"></span><strong>Add Carousel</strong><span class="bt_green_r"></span></a></dd>
        </dl>
        <dl>
            <dt><label>Theme:</label></dt>
            <dd><input class="NFText" name="theme" id="" size="54" type="text"></dd>
        </dl>
        <div id="appendform"></div>

        <input type="hidden" id="slidecount" name="slidecount" value="1"/>

        <dl class="submit">
            <img class="NFButtonLeft" src="/admin/img/0.png"><input type="submit" value="Save" id="submit" name="submit" class="NFButton"><img src="/admin/img/0.png" class="NFButtonRight">
        </dl>

</fieldset>
<div id="hiddeninform" style="visibility:hidden; height:1px;"></div>
</form> 
</div>
<div style="visibility:hidden; height:1px;">
    <div id="carouseldialog">
        <form id="carouselform">
            <div id="carouselslides">
                <div id="slide1"><label>LinkURL:</label><input name="linkurl1" type="text" /><br/>
                <label>Upload Image</label><input name="slideimage1" type="file" /><br/></div>
            </div>
            <a onClick="addSlide()" class="bt_green"><span class="bt_green_lft"></span><strong>Add Slide</strong><span class="bt_green_r"></span></a>
            <a onClick="removeSlide()" class="bt_red"><span class="bt_red_lft"></span><strong>Remove Slide</strong><span class="bt_red_r"></span></a>
        </form>
    </div>


    <div id="carouselslide">
        <div id="slidenonumber">
            <br/>
            <label>LinkURL:</label><input name="linkurl" id="linkurl" type="text" /><br/>
            <label>Upload Image</label><input name="slideimage" id="slideimage" type="file" /><br/>
        </div>
    </div>
    <div id="staffpickdialog">
        <div id="staffpicksaddto">
                <select id="staffpicks" name="staffpicks" size="1">
                    {% for program in programs %}
                    <option value="{{program.key.name}}">{{program.name}}</option>
                    {% endfor %}
                </select>
            </div>
            <a onClick="addStaffpick()" class="bt_green"><span class="bt_green_lft"></span><strong>Add Staffpick</strong><span class="bt_green_r"></span></a></dd>
            <a onClick="removeStaffPick()" class="bt_red"><span class="bt_red_lft"></span><strong>Remove Staffpick</strong><span class="bt_red_r"></span></a>

    </div>
    <div id="staffpickhidden">
                <br/>
                <select id="staffpicks" name="staffpicks"  >
                    {% for program in programs %}
                    <option value="{{program.key.name}}">{{program.name}}</option>
                    {% endfor %}
                </select>
    </div>

    <div id="reviewdialog">
        <div id="reviewsaddto">
            <textarea cols="60" rows="5" id="reviews" name="reviews"></textarea>
        </div>
            <a onClick="addReview()" class="bt_green"><span class="bt_green_lft"></span><strong>Add Staffpick</strong><span class="bt_green_r"></span></a></dd>
            <a onClick="removeReview()" class="bt_red"><span class="bt_red_lft"></span><strong>Remove Staffpick</strong><span class="bt_red_r"></span></a>

    </div>


    <div id="reviewhidden">
        <br/>
        <textarea cols="60" rows="5" id="reviews" name="reviews"></textarea>
    </div>

</div>

这是我的javascript：

function openReviewDialog(){
$('#reviewdialog').dialog({
        width: 480,
        modal: true,
        buttons: {
            'Save': function() {
                $('#hiddeninform').append($('#reviewsaddto').html())
                $(this).dialog('close');
            },
            Cancel: function() {
                $(this).dialog('close');
            }
        }
})

}

Answer 1

我很确定在表单输入元素上调用.html时不会传递值。尝试循环遍历对话框中的所有元素，并将它们作为隐藏元素添加到表单中。

$("select, textarea, input", $("#dialog")).each(function (i) {
    $("#hiddeninform").append($("<input/>").attr("name", $(this).attr("name")).val($(this).val()));
});

Answer 2

最好的办法就是这样。如果您正在使用文件字段或其他特殊类型的字段，使用上述答案会让您遇到麻烦。但要为他提供解决方案！

function openCarouselDialog(){
    $('#carouseldialog').dialog({
            width: 450,
            modal: true,
            buttons: {
                'Save': function() {
                    $("#carouseldialog input[type=text]").each(function (i) {
                        $("#hiddeninform").append($(this));
                    });
                    $("#carouseldialog input[type=file]").each(function (i) {
                        $("#hiddeninform").append($(this));
                    });
                    $(this).dialog('close');
                },
                Cancel: function() {
                    $(this).dialog('close');
                }
            }
    })
}

为什么我的变量在帖子中是空的？

2 个答案: