Избегайте постбэк на OnClick событие зрения

Question

У меня есть две точки зрения, как показано ниже:

Index.cshtml

<p> 
     @Html.ActionLink("Create New", "Create", "Owner ", new { id = "lnkCreate" }) 
    </p> 

@section JavaScript { 
     <script type="text/javascript" src="@Url.Content("/Scripts/Owner.js")"></script> 

    } 

Create.cshtml

<div> 
      @Html.ActionLink("Back", "Index", "Owner", new { id = "lnkBack" }) 
     </div> 

@section JavaScript { 
    <script type="text/javascript" src="@Url.Content("/Scripts/Owner.js")"></script> 

} 

Script >> Owner.js

$(document).ready(function() { 


    $('#lnkBack').click(function (e) {     // not working 
     alert('hello') 
     e.preventDefault(); 
     $.ajax({ 
      url: '/Owner/Index', 
      dataType: "html", 
      success: function (data) { 
       //$('#divContent').hide(); 
       //$('#divGrid').html(data); 
      } 
     }); 

    }); 

    $('#lnkCreate').click(function (e) {     //working fine 

     e.preventDefault(); 
     $.ajax({ 
      url: '/Owner/Create', 
      dataType: "html", 
      success: function (data) { 
       // $('#divGrid').hide(); 
       // $('#divContent').html(data); 
      } 
     }); 

    }); 

}); 

Что я хочу достичь, когда ver i кликнуть на ссылку «Создать новую», она работает как закодированная без обратной передачи. Но когда я нажимаю ссылку «Назад» другого представления под тем же контроллером, он делает обратную передачу и не собирается щелкнуть событие, как написано в коде сценария.

Answer 1

попробовать это:

$(document).ready(function() { 

function bindClicks(){ 
    $('#lnkBack').click(function (e) {     
     // alert('hello') 
     e.preventDefault(); 
     $.ajax({ 
      url: '/Owner/Index', 
      dataType: "html", 
      success: function (data) { 
       //$('#divContent').hide(); 
       //$('#divGrid').html(data); 
       bindClicks(); 
      } 
     }); 

    }); 

    $('#lnkCreate').click(function (e) {     
     e.preventDefault(); 
     $.ajax({ 
      url: '/Owner/Create', 
      dataType: "html", 
      success: function (data) { 
       // $('#divGrid').hide(); 
       // $('#divContent').html(data); 
       bindClicks(); 
      } 
     }); 

    }); 
} 

bindClicks(); 

}); 

В основном вам нужно привязать функции мыши() после загрузки контента через AJAX.

Функции jQuery, которые запускаются при загрузке страницы, являются агностическими для любого нового контента, который добавляется через ajax. Вы должны запускать те же функции снова каждый раз, когда новый контент добавляется на вашу страницу (если этот контент имеет некоторые функции jQuery, такие как привязки кликов). Хорошим местом для этого является успех «ajax» (новый контент полностью добавлен на страницу).