2012-10-12 8 views
5

Próbuję stworzyć stronę MVC z połączeniem Ajax. Nie mam problemu z używaniem bezpośredniego jquery, ale kiedy używam @ Ajax.ActionLink, nie otrzymuję wyniku, którego chcę. Oto mój widok:MVC 4 Ajax.Action link won t work

<script type="text/javascript"> 
     function deleteComment(id) { 
      $.post(
       "/Role/AjaxTest", 
       //{ id: id }, 

       function (data) { 
        $("#testtarget").html(data);    
       }); 
     } 
    </script> 


    <script src="@Url.Content("~/Scripts/jquery.unobtrusive-ajax.min.js")" type="text/javascript"></script> 
    <h2>TITLE</h2> 
    <p> 
@Ajax.ActionLink("Ajax Test", "AjaxTest", "Role", new AjaxOptions{UpdateTargetId="testtarget",HttpMethod = "Get" , InsertionMode = InsertionMode.Replace }) 
    </p> 
    <table>  
    @foreach (var item in Model) { 
     <tr> 
      <td> 
       @Html.DisplayFor(modelItem => item.RoleName) 
      </td> 
      <td> 
       <a onclick="deleteComment('@item.RoleId'); return false;" href="#">Delete</a> 
       @Html.ActionLink("Delete", "Delete", new { id=item.RoleId }) 

      </td> 
     </tr> 
    } 
    </table> 
    <div id="testtarget">Test Div</div> 

i tu jest moje dane Controler:

public string AjaxTest() 
{ 
    return "Some random text"; 
} 

Moja Zaproszenie na Jquery działa idealnie i tekst pojawia się w div, ale mój actionlink tylko przekierowuje mnie: localhost/Role/AjaxTest, więc mam tylko wiadomość w przeglądarce banku.

Każdy pomysł, co jest nie tak?

Bardzo dziękuję z góry!

+0

Czy jesteś pewien, że ładowany jest plik 'jquery.unobtrusive-ajax.min.js'? –

+0

Tak, po kliknięciu łącza na stronie internetowej źródło: otwiera. – Tom

Odpowiedz

9

Upewnij dodaniu skryptu jquery.unobtrusive-ajax.js do strony:

<script type="text/javascript" src="~/scripts/jquery.unobtrusive-ajax.js"></script> 

lub jeśli używasz pakiety (co jest zalecane podejście) upewnij się, że masz włączone paczkę zawierającą ten skrypt. Na przykład podczas tworzenia nowego projektu ASP.NET MVC 4 pomocą szablonu internetowego, który byłby ~/bundles/jqueryval bundle:

bundles.Add(new ScriptBundle("~/bundles/jqueryval").Include(
    "~/Scripts/jquery.unobtrusive*", 
    "~/Scripts/jquery.validate*") 
); 

Więc upewnij się, że jest w widoku po wiązce jquery:

@Scripts.Render("~/bundles/jquery") 
@Scripts.Render("~/bundles/jqueryval") 

Lub po prostu połącz je w jednym pakiecie. Wszystko zależy od twoich wymagań i od tego, czy potrzebujesz dyskretnej obsługi sprawdzania poprawności jQuery, czy też nie.

Chciałbym również polecić, aby mieć swoje działania kontroler ActionResult deklaracji, a nie ciąg:

public ActionResult AjaxTest() 
{ 
    return Content("Some random text"); 
} 
+1

Doskonale, dziękuję bardzo, wszystko, co powiedziałeś, było w moim projekcie, po prostu nie miałem @ Scripts.Render ("~/bundles/jqueryval"). Więc dodałem go do mojej strony i zrobiłem to, czy jest to "mądre", aby umieścić to na stronie wzorcowej układu? Zgaduję, że będzie używany na wielu stronach. Bardzo dziękuję za Twoją pomoc! Utknąłem na tym przez jakieś 4 godziny ... – Tom

2

Spróbuj użyć F12 w swojej przeglądarce oraz sprawdzenie czy masz jakieś błędy skryptów w konsoli. Fiddler pomoże również w identyfikacji, czy którakolwiek z twoich bibliotek nie jest prawidłowo przywołana lub załadowana.

+0

Dzięki! To było częścią mojego problemu, jquery nie został zdefiniowany, więc zrobiłem to, co sugerował następny post. – Tom