Question

我提交的表单中有一个对话框div。 div使用JavaScript动态填充复选框。当我单击链接打开对话框时，选中几个复选框，关闭，提交，我的PHP进程页面未将选中的复选框注册为POST项目。

所以，我相信因为复选框是在页面加载后动态生成的，所以它们实际上并没有在表单中注册为元素？它是否正确？有了这些知识（或缺乏知识），我不知道如何规避这一点。

任何帮助都会非常感激，我一直在寻找帮助无济于事。

HTML：

<form action="submit.php" method="POST">

        <div id="dialog" style="font-size:14px;">
            <div id="states_container">
                <div style="width:33%; float:left;" id="col1">

                </div>

                <div style="width:33%; float: left;" id="col2">

                </div>

                <div style="width:33%; float: left;" id="col3">

                </div>
            </div>

        </div>
   <input type="submit" value="Submit">
</form>

submit.js（是的，我知道这是糟糕的代码，但我要重构）：

$(function() {
    $( "#dialog-link" ).click(function( event ) {
        $( "#dialog" ).dialog( "open" );
        event.preventDefault();
    });

    $( "#dialog" ).dialog({
    autoOpen: false,
    width: 600,
    buttons: [
        {
            text: "Ok",
            click: function() {
                $( this ).dialog( "close" );
            }
        },
        {
            text: "Cancel",
            click: function() {
                $( this ).dialog( "close" );
            }
        }
    ]
    });

    var states1 = {
        AL: "Alabama", 
        AK: "Alaska", 
        AZ: "Arizona", 
        AR: "Arkansas", 
        CA: "California", 
        CO: "Colorado", 
        CT: "Connecticut", 
        DE: "Delaware", 
        DC: "District Of Columbia", 
        FL: "Florida", 
        GA: "Georgia", 
        HI: "Hawaii", 
        ID: "Idaho", 
        IL: "Illinois", 
        IN: "Indiana", 
        IA: "Iowa",
        KS: "Kansas"
    };

    var states2 = {

        KY: "Kentucky", 
        LA: "Louisiana", 
        ME: "Maine", 
        MD: "Maryland", 
        MA: "Massachusetts", 
        MI: "Michigan", 
        MN: "Minnesota", 
        MS: "Mississippi", 
        MO: "Missouri", 
        MT: "Montana",
        NE: "Nebraska",
        NV: "Nevada",
        NH: "New Hampshire",
        NJ: "New Jersey",
        NM: "New Mexico",
        NY: "New York",
        NC: "North Carolina"
    };

    var states3 = {
        ND: "North Dakota",
        OH: "Ohio", 
        OK: "Oklahoma", 
        OR: "Oregon", 
        PA: "Pennsylvania", 
        RI: "Rhode Island", 
        SC: "South Carolina", 
        SD: "South Dakota",
        TN: "Tennessee", 
        TX: "Texas", 
        UT: "Utah", 
        VT: "Vermont", 
        VA: "Virginia", 
        WA: "Washington", 
        WV: "West Virginia", 
        WI: "Wisconsin", 
        WY: "Wyoming"
    };



    $.each(states1, function(key, value) {
        $('#col1').append(
            '<label for="' + value + '"><input type="checkbox" name="'+value+'" id="'+value+'">'+value+'</label><br/>'
        );
    });


    $.each(states2, function(key, value) {
        $('#col2').append(
            '<label for="' + value + '"><input type="checkbox" name="'+value+'" id="'+value+'">'+value+'</label><br/>'
        );
    });


    $.each(states3, function(key, value) {
        $('#col3').append(
            '<label for="' + value + '"><input type="checkbox" name="'+value+'" id="'+value+'">'+value+'</label><br/>'
        );
    });
});

Answer 1

将其放在表格标签

中

<div id="dvDialog"></div>

打开表单时，在打开对话框

之前将其放在jQuery中

$('#dialog').parent().appendTo('#dvDialog');

我们需要这样做是因为，当打开对话框时，它会附加在DOM中但不会附加在Form标记中，并且我们知道当我们应该将数据发布到任何页面时，我们需要在表单标记内部进行控制或输入，所以这样我们在表格标签的DOM中的form标签下面的div中添加对话框。

JQuery UI对话框表单元素未与表单一起提交

1 个答案: