jquery 대화 상자 및 게시 이후 dropdownlist에 새 옵션 추가

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

내가 그것을 얻었다. 나는 guid와 함께 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'); 
         } 
        } 
       });