2011-11-22 9 views
3

저는 MVC 방식으로는 아직 비교적 새롭습니다.부분 뷰 내의 부분 뷰는 게시되지 않습니다.

저는 현재 기존 MVC 웹 사이트에서 필요에 따라 관리 기능을 추가하고 있습니다. 하나의 메인 Admin View가 있습니다. 다른 모든 CRUD 작업은 하나의 단일 관리보기에로드 된 부분보기에 의해 처리됩니다. 이 시점까지는 이러한 부분 뷰를 모두 추가하는 데 아무런 문제가 없었습니다. 지금은 Email_Queue와 Smtp_Server의 두 테이블이 있습니다. 비즈니스 규칙에는 Email_Queue 레코드를 작성하기 전에 Smtp_Server 레코드가 있어야한다고 나와 있습니다.

따라서 사용자에게 더 좋게 만들려면 Email_Queue에 대한 부분보기 작성 내에서 Smtp_Server를 작성하는 옵션이 있습니다. 모달 팝업에서 열려면 Smtp_Server에 대한 만들기 부분보기를 얻을 수 있습니다 ... (모델에서 설정된) 모든 유효성 검사를 트리거 할 수 있습니다 ... 모달 팝업을 닫으려면 취소 단추를 얻을 수 있습니다. . 그러나, 나는 게시 버튼을 Smtp_Server 부분보기에 게시 할 수 없습니다.

이 모든 것을위한 최종 목표는 결국 게시하도록 설정 한 다음 방금 추가 한 새로운 Smtp_server를 사용하여 Email_Queue 부분보기 업데이트에 드롭 다운을 갖게합니다. 지금은 내가 입력 한 것을 저장하는 Smtp_Server에 만족할 것입니다.

그래서 여기에 몇 가지 코드가 있습니다. 첫째, Email_Queue 부분보기 (나는 그것이 짧은 유지하기 위해 추가 필드를 삭제했습니다) :

@model Models.Email_QueueModel 

<div class="main_column_leftfull"> 
<!--=========Graph Box=========--> 
<div class="box expose"> 
    <!-- A box with class of expose will call expose plugin automatically --> 
    <div class="header"> 
     Create E-Mail Queue 
    </div> 
    <div class="body"> 
     <script src="@Url.Content("~/Scripts/jquery.validate.min.js")" type="text/javascript"></script> 
     <script src="@Url.Content("~/Scripts/jquery.validate.unobtrusive.min.js")" type="text/javascript"></script> 
     <script type="text/javascript"> 

      function CancelAddSmtpServer() { 
       var windowElement = $('#QueueCreate'); 
       windowElement.hide(); 
      } 

      $(document).ready(function() { 

      var windowElement = $('#QueueCreate'); 
      var undoButton = $('#opener-popup'); 
      undoButton 
       .bind('click', function(e) { 
        windowElement.data('tWindow').open(); 
        undoButton.hide();}) 
       .toggle(!windowElement.is(':visible')); 
        windowElement.bind('close', function() { 
        undoButton.show(); 

       }); 
      }); 

      function CloseWindow() { 
       var windowElement = $('#QueueCreate').data('tWindow'); 
       windowElement.close(); 
      } 

     </script> 
     @using (Ajax.BeginForm("_Create", new AjaxOptions() { UpdateTargetId = "subForm", HttpMethod = "Post" })) 
     { 
      <fieldset> 
       @Form.HiddenID("DepartmentId") 
       <div class="editor-label"> 
        @Html.LabelFor(model => model.QueueName) 
        @Html.EditorFor(model => model.QueueName, new { @class = "textfield" }) 
        @Html.ValidationMessageFor(model => model.QueueName) 
       </div> 

       <div class="editor-label"> 
        @Html.LabelFor(model => model.EmailServerConfig) 
        @Html.DropDownList("EmailServerConfig", "Select E-Mail Server Configuration...") 
        @Html.ValidationMessageFor(model => model.EmailServerConfig) 
       </div> 

       <div id="opener-popup" class="editor-label" style="cursor:pointer;"> 
        Add SMTP Server 
       </div> 

       <div id="popup_content" title="Popup Title" style="display:none;"> 
        @Html.Partial("../Email_SmtpServer/_QueueCreate") 
       </div> 

       @(Html.Telerik().Window() 
        .Name("QueueCreate") 
        .Modal(true) 
        .Title("Add SMTP Server") 
        .Scrollable(false) 
        .Draggable(true) 
        .Resizable() 
        .Visible(false) 
        .Content 
        (
         @<text> 
          @Html.Partial("../Email_SmtpServer/_QueueCreate", new DATEL.MM.Models.Email_SmtpServerModel()) 
         </text> 
        ) 
       ) 

       <br /> 
       <p> 
        @Form.Submit(value: "Create E-Mail Queue") 
        <input id="btnCancelEmail_QueueCreate" type="button" value="Cancel" class="button" /> 
       </p> 
      </fieldset> 
     } 
     <div> 
      @Html.ActionLink("Back to List", "Index") 
     </div> 
    </div> 
</div> 

다음, 내가 모달 팝업을 위해 만든 부분보기 :

@model Models.Email_SmtpServerModel 

<div class="main_column_leftfull"> 
<!--=========Graph Box=========--> 
<div class="box expose"> 
    <!-- A box with class of expose will call expose plugin automatically --> 
    <div class="header"> 
     Create SMTP Server 
    </div> 
    <div class="body"> 
     <script src="@Url.Content("~/Scripts/jquery.validate.min.js")" type="text/javascript"></script> 
     <script src="@Url.Content("~/Scripts/jquery.validate.unobtrusive.min.js")" type="text/javascript"></script> 


     @using (Ajax.BeginForm("_QueueCreate", new AjaxOptions() { UpdateTargetId = "subForm", HttpMethod = "Post" })) 
     { 
      <fieldset> 
       @Form.HiddenID("SMTPServerId") 
       <div class="editor-label"> 
        @Html.LabelFor(model => model.ServerName) 
        @Html.EditorFor(model => model.ServerName, new { @class = "textfield" }) 
        @Html.ValidationMessageFor(model => model.ServerName) 
       </div> 

       <div class="editor-label"> 
        @Html.LabelFor(model => model.ServerDesc) 
        @Html.EditorFor(model => model.ServerDesc, new { @class = "textfield" }) 
        @Html.ValidationMessageFor(model => model.ServerDesc) 
       </div> 

       <br /> 
       <p> 
        @Form.Submit(value: "Create SMTP Server") 

        <input id="btnCancelEmail_SmtpServerQueueCreate" type="button" value="Cancel" class="button" onclick="CloseWindow();" /> 
       </p> 
      </fieldset> 
     } 
    </div> 
</div> 

마지막으로 _QueueCreate에 대한 내 컨트롤러 코드는 다음과 같습니다.

[HttpPost] 
    public virtual PartialViewResult _QueueCreate(Email_SmtpServerModel model, FormCollection fc) 
    { 
     ViewBag.HasError = "none"; 
     try 
     { 
      string errorMessage = ""; 
      BusinessLogic.Email_SmtpServer dbESS = new BusinessLogic.Email_SmtpServer(AppManager.GetUser(User.Identity.Name).ConnectionString); 
      model.SMTPServerId = System.Guid.NewGuid(); 
      model.CreatedDateGMT = DateTime.Now; 
      model.CreatedUserId = AppManager.GetUser(User.Identity.Name).UserId; 

      if (dbESS.Insert(model, out errorMessage)) 
      { 
       ModelState.AddModelError("", errorMessage); 
      } 
      else 
      { 
       ViewBag.HasError = "none"; 
       return PartialView("../Email_Queue/_Create"); 
      } 
     } 
     catch 
     { 
      ViewBag.HasError = "true"; 
      return PartialView("../Email_Queue/_Create"); 
     } 
     return PartialView(model); 
    } 

더 많은 코드를 게시해야하는 경우 알려 주시기 바랍니다.

TL; DR 버전 : 음, 제목을 살펴보십시오.

답변

1

당신은 클릭에 제출 버튼을 제출 강요 할 수

<input type="submit" name="btnSubmit" value="Submit Form" onclick="this.form.submit()" /> 

또는 정말로 단지 onclick을 찾기 위해 jQuery를 사용하고 아약스에게

$('input[name="btnSubmit"').click(function() { 
//you will need to get form variables 

$.ajax({ 
type:"POST", 
data: { id = var1, parameter = var2 } 
datatype: "json", 
success: function (data){ 
//whatever needs done 
}, 
error: function(){ 
alert("error"); 
} 

}); 

MVC 컨트롤러

public jsonresult somename(string id, string parameter) 
{ 
return Json("SUCCESS"); 
} 
를 사용하여 게시

또는

public jsonresult somename(FormCollection fc) 
{ 
strind id = fc["id"]; 
string parameter = fc["parameter"]; 
return Json("SUCCESS"); 
} 
+0

사실 저는 결국 jQuery를 사용하여 부분 뷰를 게시했습니다. 모든 것이 저장됩니다. 이제 모달 팝업을 닫고 성공시 드롭 다운을 업데이트하면됩니다. – user1059903