przekazać model z widoku do kontrolera za pomocą html.actionlink

Question

Próbuję uzyskać dane modelu od mocno wpisanego widoku do kontrolera. Korzystanie z przycisku przesyłania jest OK, mogę pobrać dane. Teraz chcę osiągnąć to samo z html.actionlink. To jest to, co mam: Widok:

@model WordAutomation.Models.Document  
    @{ 
     ViewBag.Title = "Document"; 
    } 
     <script type="text/javascript"> 
      $(function() { 
       $("#dialog").dialog(); 
      }); 
     </script> 

    <h2>Document</h2> 

    @using (Html.BeginForm()) { 
     @Html.ValidationSummary(true) 

     <fieldset> 
      <legend>Document</legend> 

      <div class="editor-label"> 
       @Html.LabelFor(model => model.ClientTitle) 
      </div> 
      <div class="editor-field"> 
       @Html.EditorFor(model => model.ClientTitle) 
       @Html.ValidationMessageFor(model => model.ClientTitle) 
      </div> 

      <div class="editor-label"> 
       @Html.LabelFor(model => model.ClientFullName) 
      </div> 
      <div class="editor-field"> 
       @Html.EditorFor(model => model.ClientFullName) 
       @Html.ValidationMessageFor(model => model.ClientFullName) 
      </div> 

      <div class="editor-label"> 
       @Html.LabelFor(model => model.ClientCustomSSN) 
      </div> 
      <div class="editor-field"> 
       @Html.EditorFor(model => model.ClientCustomSSN) 
       @Html.ValidationMessageFor(model => model.ClientCustomSSN) 
      </div> 

      <p> 
       <input type="submit" value="Create" />    
      </p> 
     </fieldset> 
    } 

    <div> 
     @Html.ActionLink("Preview", "PreviewWordDocument", "Home", null, new { id = "previewLink" })  

    </div> 

    <div id="dialogcontainer"> 
     <div id="dialogcontent"><input type="submit" value="Create" />  </div> 
    </div> 

    @section Scripts { 

     <script type="text/javascript"> 

       $(document).ready(function() { 

        $("#dialogcontainer").dialog({ 
         width: 400, 
         autoOpen:false, 
         resizable: false, 
         title: 'Test dialog', 
         open: function (event, ui) { 
          $("#dialogcontent").load("@Url.Action("PreviewWordDocument", "Home")"); 
         }, 
         buttons: { 
          "Close": function() { 
           $(this).dialog("close"); 
          } 
         } 
        }); 

        $("#previewLink").click(function(e) { 
         e.preventDefault(); 
         $("#dialogcontainer").dialog('open'); 
        }); 

       }); 

      </script> 
    } 

Kontroler:

public ActionResult Document() 
     {  
      return View(); 
     } 

     [HttpPost] 
     public ActionResult Document(WordAutomation.Models.Document model) 
     { 
      Models.Utility.EditWord word = new Models.Utility.EditWord(); 
      word.EditWordDoc(model); 
      return View("Display", model); 
     } 

     public ActionResult PreviewWordDocument() 
     {   
      var image = Url.Content("~/Content/preview.jpeg"); 

      return PartialView((object)image); 
     } 

ActionResult dokument może dostać model, ale chcę wiedzieć, w jaki sposób można uzyskać wartości z link akcji, który uruchomi akcję PreviewWordDocument.

Dzięki z góry, Laziale

Answer 1

Formularz można opublikować za pomocą przycisku "Prześlij" pod adresem URL podanym jako jego atrybut działania.

Można jednak wysłać dane formularza do innego adresu URL za pomocą metody posta jQuery, ręcznie sprawdzając poprawność formularza przed jego wysłaniem. W ten sposób można wysłać dane formularza do metody kontrolera PreviewWordDocument i obsłużyć odpowiedź w celu wyświetlenia podglądu w wybranym elemencie div. (Będzie to pomocne, jeśli podać identyfikator formularza, dzięki czemu można łatwo znaleźć go za pomocą jQuery)

Więc obsługi zdarzenia kliknięcia na link podglądu będzie wyglądać następująco:

$("#previewLink").click(function(e) { 
    e.preventDefault(); 
    if($("#YourFormId").valid()){ 
     $("#dialogcontainer").dialog('open'); 
    } 
}); 

W otwórz funkcję okna dialogowego, do którego chcesz wysłać formularz (który został już zatwierdzony) do metody kontrolera podglądu, używając funkcji ajax jQuery. Odpowiedź zostanie załadowany do div dialogContent:

$.ajax({ 
     type: "POST", 
     url: $("#previewLink").attr("href"), //the preview controller method 
     data: $("#YourFormId").serialize(), 
     success: function (data) { 
      //load ajax response into the dialogContent div 
      $("#dialogcontent").html(data); 
     }, 
     error: function(xhr, error) { 
      $("#YourFormId").prepend('<div id="ajaxErrors"></div>') 
          .html(xhr.responseText); 
     } 
    }); 

Teraz będą teraz mogli odbierać cały dokument w akcji PreviewWordDocument:

public ActionResult PreviewWordDocument(WordAutomation.Models.Document model) 
{   
    var image = Url.Content("~/Content/preview.jpeg"); 

    return PartialView((object)image); 
} 

Answer 2

w stronie HTML, po kliknięciu na przycisk przesyłania wszystkich elementów wejściowych wewnątrz postaci, które przedkłada przycisk tkwi w woli wysłane do serwera, ale po kliknięciu na kotwicy (<a> tag). wyślij tylko żądanie za pomocą metody Get i nie publikuj żadnej wartości., ale jeśli chcesz wysłać konkretną wartość do serwera przy użyciu tego podejścia, możesz to zrobić za pomocą ciągu zapytań.użyłeś następujących informacji, aby złożyć wniosek:

 @Html.ActionLink("Preview", "PreviewWordDocument", "Home", null, 
    new { id = "previewLink" }) 

będzie produkować:

<a id="previewLink" href="/Home/PreviewWordDocument"> Preview </a> 

który jest incorrect.to przekazać dowolną wartość do serwera z ActionLink użytkowania 4. parametr jak poniżej:

 @Html.ActionLink("Preview", "PreviewWordDocument", "Home", 
    new { id = "previewLink" }, null) 

fR wynik om ten kod będzie:

<a href="/Home/PreviewWordDocument?id=previewLink"> Preview </a> 

Pozdrawiam!