从下拉列表中选择的值不会从 jquery 对话框中发布答案

【问题标题】：Selected value from drop-down list doesn't post from jquery dialog从下拉列表中选择的值不会从 jquery 对话框中发布
【发布时间】：2010-04-19 23:29:51
【问题描述】：

我有一个 jQuery 对话框。除下拉列表外，所有字段均正确发布，该值作为 null 而不是选定值传递。

    <div id="popupCreateCompany" title="Create a new company"> 
    <form>
    <fieldset>
    <p>  
        <label for="company_name">Company Name:</label>
        <%= Html.TextBox("company_name") %>    
    </p>
    <p>
        <label for="company_desc">Company Description:</label>
        <%= Html.TextBox("company_desc") %>
    </p>  
    <p>
        <label for="address">Address:</label>
        <%= Html.TextBox("address") %>
    </p>
    <p>
        <label for="city">City:</label>
        <%= Html.TextBox("city") %>
    </p>
    <p>
        <label for="state">State:</label>
        <%= Html.TextBox("state") %>
    </p>
    <p>
        <label for="zip">Zip:</label>
        <%= Html.TextBox("zip") %>
    </p>
    <p>
        <label for="website">Website:</label>
        <%= Html.TextBox("website", "http:/") %>
    </p>
    <p>
        <label for="sales_contact">Sales Contact:</label>
        <%= Html.DropDownList("sales_contact", Model.SelectSalesContacts, "** Select Sales Contact **") %>
    </p>
    <p>
        <label for="primary_company">Primary Company:</label>
        <%= Html.DropDownList("primary_company", Model.SelectPrimaryCompanies, "** Select Primary Company **") %>

    </p>
    </fieldset>
    </form>

jQuery:

 $('#popupCreateCompany').dialog(
                {
                    autoOpen: false,
                    modal: true,
                    buttons:
                    {
                        'Add': function() {
                            var dialog = $(this);
                            var form = dialog.find('input:text');
                            $.post('/company/create', $(form).serialize(), function() {
                                dialog.dialog('close');
                            })
                        },
                        'Cancel': function() {
                            $(this).dialog('close');
                        }
                    }
                });

        $("#create-company").click(function() {
            $('#popupCreateCompany').dialog('open');
        });

我的 SelectList 定义：

    public class SubcontractFormViewModel
{
    public subcontract Subcontract { get; private set; }
    public SelectList SelectPrimaryCompanies { get; set; }
    public MultiSelectList SelectService_Lines { get; private set; }
    public SelectList SelectSalesContacts { get; private set; }

    public SubcontractFormViewModel(subcontract subcontract)
    {
        SubcontractRepository subcontractRepository = new SubcontractRepository();

        Subcontract = subcontract;
        SelectPrimaryCompanies = new SelectList(subcontractRepository.GetPrimaryCompanies(), "company_id", "company_name");
        SelectService_Lines = new MultiSelectList(subcontractRepository.GetService_Lines(), "service_line_id", "service_line_name", subcontractRepository.GetSubcontractService_Lines(Subcontract.subcontract_id));
        SelectSalesContacts = new SelectList(subcontractRepository.GetContacts(), "contact_id", "contact_name");
    }
}

【问题讨论】：

标签： asp.net-mvc post jquery jquery-ui-dialog

【解决方案1】：

你的问题是这一行：

var form = dialog.find('input:text');

您只是在序列化 <input> 元素，而不是其他表单元素。

您可以通过将其更改为来添加选择元素

var form = dialog.find('input:text, select');

或

var form = dialog.find('input:text').add('select');

【讨论】：

【解决方案2】：

您需要确保对话框仍在表单中以发布值，默认情况下不是，如下所示：

$('#popupCreateCompany').dialog({
    autoOpen: false,
    modal: true,
    buttons:
    {
        'Add': function() {
            var dialog = $(this);
            var form = dialog.find('input:text');
            $.post('/company/create', $(form).serialize(), function() {
                dialog.dialog('close');
            })
        },
        'Cancel': function() {
            $(this).dialog('close');
        }
    }
}).parent().appendTo("#myFormID");

默认情况下，jQuery UI（以及其他一些模态）附加到创建的模态到 <body> 的末尾，因此实际的 <select> 元素在您的表单之外，这意味着它不包含在 POST 值中.如果您像上面那样执行.parent().appendTo()，它会将包装在表单中的对话框移回并且应该正确发布。

【讨论】：