2014-10-30 2 views
2

Постановка задачи: не в состоянии вызвать функцию Javascript от Ajax действий Link, но я в состоянии вызвать ту же функцию JavaScript с помощью HTML .actionlinkВ функции MVC Javascript не получает запускается с помощью Ajax.ActionLink

Что я делаю: на самом деле я имею сетку деталей и ссылку для удаления на каждой строке, по-щелчку удалить я хочу передать значение в результате действий под названием Удалить с помощью Javascript/JQuery.

Что я пытаюсь избежать: На щелчку удалять не следует переходить на новый адрес, как это происходит с Html.ActionLink, поэтому я использую Ajax.ActionLink для этого:

Пожалуйста, найдите изображение для справки:

enter image description here

Вид:

<table class="table"> 
     <tr> 

      <th> 
       @Html.DisplayNameFor(model=> model.RequestedBy) 
      </th> 
      <th> 
       @Html.DisplayNameFor(model=> model.Description) 
      </th> 
      <th> 
       @Html.DisplayNameFor(model=> model.Name) 
      </th> 
      <th> 
       @Html.DisplayNameFor(model=> model.FromDate) 
      </th> 
      <th> 
       @Html.DisplayNameFor(model => model.ToDate) 
      </th> 

     </tr> 
     @if (Model!= null) 
     { 
      foreach (var item in Model) 
      { 
      <tr> 

       <td> 
        @Html.DisplayFor(modelItem => item.RequestedBy,new { id="lstRequestedBy"}) 
        @Html.Hidden("#RequestedBy") 
       </td> 
       <td> 
        @Html.DisplayFor(modelItem => item.Description) 
       </td> 
       <td> 
        @Html.DisplayFor(modelItem => item.FromDate) 
       </td> 
       <td> 
        @Html.DisplayFor(modelItem => item.ToDate) 
       </td> 
       <td>  

        @Ajax.ActionLink("Delete","Delete","Request", 
        new AjaxOptions 
        { 
         OnBegin="return DeleteAsset()", 
         HttpMethod = "POST" 
        }) 
        @*@Html.ActionLink("Delete","Delete","Request", new { onclick="DeleteAsset()"})*@ 
       </td> 
      </tr> 
      } 
     } 

    </table> 

Javascript:

<script type='text/javascript'> 

    function DeleteAsset() { 
     var RequestedBy= $('#lstRequestedBy').val(); 
     $('#RequestedBy').val(RequestedBy); 

    } 
</script> 

Контроллер:

public ActionResult Delete(string RequestedBy) 
    { 
     //Want to perform some action here based on RequestedBy 
    } 

Что я делаю неправильно здесь ??

Почему функция java-script не запускается с помощью ajax.actionlink, которая запускается с помощью html.actionlink ??

Это также прекрасно, если любой из них предоставляет альтернативу для этого ????

+0

Изменить onclick = "DeleteAsset()" to onclick = "return DeleteAsset()" и внутри функции DeleteAsset добавить return false; Это приведет к тому, что браузер не перейдет к URL-адресу. –

ответ

0

Personnaly, мне нравится делать свой собственный вызов ajax.

<td>  
    // prevent the link from doing something. You can also use evet.preventDefault in the click event. 
    <a href="javascript:void(0)" data-requestedby="@item.RequestedBy" >Delete</a> 

</td> 


$("[data-requestedby]").click(function() { 
    var row = $(this).closest("tr"); 
    $.ajax({ 
     url: "Delete/Delete", 
     data : { RequestedBy : $(this).attr("data-requestedby") } , 
     success:function(result){ 
      // probably remove the row; 
      $(row).remove(); 
     } 
    }); 

}); 

Код не проверен, но я надеюсь, что вы получите эту идею.

Смежные вопросы