使用Javascript/Jquery从对话框中获取表单数据



我有一个类似的对话框

$("#dbSetting_div").dialog({
    height: 315,
    width: 500,
    autoOpen: false,
    modal: true,
    draggable: false,
    buttons: {
        "Save": function () {},
        "Add More": function () {
            l_i++;
            formHtml = "<div>";
            formHtml += "<form id='" + l_i + "'>";
            formHtml += "<label class = 'dbright'>DashBoard ID: </label><span class = 'dbleft'><select id='dashboard_id' class='dbSettingDD'><option>-------Select-------</option>" + dropDownDashboardName + "</select></br></span>";
            formHtml += "<label class = 'dbright'>Filtering parameter: </label><span class = 'dbleft'><select id='filter_by'><option>-------Select-------</option></select></br></span>";
            formHtml += "<label class = 'dbright'>Y-Axis: </label><span class = 'dbleft'><select id='yAxis'><option>-------Select-------</option></select></br></span>";
            formHtml += "<label class = 'dbright'>Chart Tiltle: </label><span class = 'dbleft'><input type='text' id='title'/></br></span>";
            formHtml += "<label class = 'dbright'>Chart Type: </label><span class = 'dbleft'><input type='text' id='chart_type'/></br></span>";
            formHtml += "<label class = 'dbright'>Main Chart: </label><span class = 'dbleft'><input type='radio' name='mainchart' value='yes'/>Yes <input type='radio' name='mainchart' value='No'/>No</br></span>";
            formHtml += "</form>";
            formHtml += "</div>";
            $("#dbSetting_div").append("<p>" + formHtml + "</p>");
            console.log(scroll);
        }
    }
}).css("font-size", "12px");

我试图将这个对话框的输出序列化为json

$("div form").each(function(){
console.log( $(this).serialize() );
});

我尝试在保存按钮函数中包含上述代码,但控制台中的输出为空。

我没有犯任何错误。

如何使用Javascript/Jquery 获取表单数据

JSBin

我得到了解决方案,看看这里Fiddle

如果你看看控制台,你就会得到结果。

"Save": function () {
        var data = new Object();
        $("div form :input").each(function () {
            data[$(this).attr("id")] = $(this).val();
        });
        console.log(data);
    },

最新更新