在 jquery 对话框和帖子之后添加新选项到下拉列表

Question

我有一份用于签订分包合同的表格。在这张表格上，我有系统中所有公司的下拉列表。旁边是一个“创建公司”按钮。此按钮将打开一个 jquery 对话框，允许用户创建新公司。对话框关闭后，需要将新公司添加到下拉列表中并进行选择。如果我刷新，它就在那里，但我需要在不刷新表单的情况下执行此操作 b/c 我不希望用户丢失他们在其他字段中输入的所有内容。我不知道如何执行此操作，因为我没有新公司的 guid/company_id。

我的 jquery 对话框：

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


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

公司字段：

<label for="company">Company:</label>
            <%= Html.DropDownList("company", Model.SelectCompanies, "** Select Company **") %>
            <%= Html.ValidationMessage("Company", "*") %>
            <button type="button" id="create-company" >Create Company</button>

SelectList 声明：

SelectCompanies = new SelectList(subcontractRepository.GetPrimaryCompanies(), "company_id", "company_name", Subcontract.company);

Answer 1

我得到了它。我随指南返回了一个 Json。

            $('#popupCreateCompany').dialog(
                {
                    autoOpen: false,
                    modal: true,
                    buttons:
                    {
                        'Add': function() {
                            var dialog = $(this);
                            var form = dialog.find('input:text, select');
                            $.post('/company/create', $(form).serialize(), function(data) {
                                alert(data.Result);
                                if (data.Result == "success") {

                                    $('#company').append($('<option selected="selected"></option>').val(data.company_id).html(data.company_name));
                                };
                                dialog.dialog('close');
                            }, "json")
                        },
                        'Cancel': function() {
                            $(this).dialog('close');
                        }
                    }
                });