Wysyłanie danych z jquery do kontrolera MVC

Question

Mam app ASP.NET MVC3 i gdy użytkownik kliknie na moim tagu zakotwiczenia, chcę wysłać 3 fragmentów danych do działania:

<a onclick='editDescription(<#= DocID,FileName,Description #>)'></a> 

Jest javascript zadzwonić moje działania:

function editDescription(docId,fileName,description) { 
    var url = "@Url.Content("~/OrderDetail/_EditDescription/")" + docId+'/'+ 
    fileName + '/' + description; 
    //do the rest} 

Moja akcja:

public ActionResult _EditDescription(string id,string filename, string descritpion) 

kawałki im zaniepokojeni są pliku i Descriptio n, ponieważ mogą one być loooooong i nie chcę url do wyglądać tak:

http://localhost/OrderDetail/_EditDescription/123/some long filename.pdf/this is a long description for the name 

Jak mogę wysłać całej moich danych do mojego działania bez konieczności wysyłania go jak ciąg kwerendy? Dzięki

Answer 1

Ty może użyć metody jQuery $ .ajax:

<div id="what-I-want-updated"> 

    <input id="whatever-the-id-is" type="text" value="@Model.ID" /> 
    <br /> 
    <input id="whatever-the-filename" type="text" value="@Model.Filename" /> 
    <br /> 
    <input id="whatever-the-description" type="text" value="@Model.Description" /> 
    <br /> 
    <button id="whatIsClicked">Update!</button> 

</div> <!-- /#what-I-want-updated --> 

<script> 

    // You're probably clicking something to initiate update 
    var $whatIsClicked = $('#whatIsClicked'); 

    // .live persists on the page even after other ajax calls 
    // So when the thing is clicked 
    $whatIsClicked.live('click', function() { 

     // Grab the information needed to update 
     var theId = $('#whatever-the-id-is').val(); //Or it could be .text() 
     var theFilename = $('#whatever-the-filename').val(); 
     var theDescript = $('#whatever-the-description').val(); 

     // Let's edit the description! 
     $.ajax({ 
     type: "POST", 
     url: "OrderDetail/_EditDescription", // the method we are calling 
     contentType: "application/json; charset=utf-8", 
     data: {id: theId, filename: theFilename, description: theDescript}, 
     dataType: "json", 
     success: function (result) { 
      alert('Yay! It worked!'); 
      // Or if you are returning something 
      alert('I returned... ' + result.WhateverIsReturning);      
     }, 
     error: function (result) { 
      alert('Oh no :('); 
     } 
    }); 
    }); 
</script> 

Mimo to nadal działa, upewnij się metodę Controller zmienić na:

[HttpPost] 
public ActionResult _EditDescription(string id, string filename, string descritpion) 

Answer 2

Możesz zrobić pełny post formularza, jeśli chcesz przez ajax $.post lub akcji z atrybutem [HttpPost].

Answer 3

Zadeklaruj swoje działania w postaci POST

[HttpPost] 
public ActionResult _EditDescription(string docId, string filename, string description) 

Tworzenie niewidocznej formularza HTML:

<form action="@Url.Content("~/OrderDetail/_EditDescription/")" method="post" name="editDescriptionForm"> 
    <input type="hidden" name="docId" /> 
    <input type="hidden" name="fileName" /> 
    <input type="hidden" name="description" /> 
</form> 

wypełnić formularz i przesłać go z JS:

function editDescription(docId, fileName, description) { 
    document.editDescriptionForm.docId = docId; 
    ... 

    document.editDescriptionForm.submit(); 
}