JcMey3r JcMey3r - 1 year ago 146
jQuery Question

javascript click not firing after partial view load

I have a view with a javascript section. In this view I have javascript with an onclick event which fires on a tab click to load a partial view this all works perfectly.

Now I know javascript on a partial view wont work properly so in the main view I want to add a click event for when a print button gets clicked.

<script type="text/javascript">
$(function () {

$('#printBtn').click(function () {

$('#tabStrip a').click(function (e) {
var tabID = $(this).attr("href").substr(1);

$(".tab-pane").each(function () {

$("#" + tabID).empty().append("<div class='loader'><img src='/Content/img/Loader/ajax-loader.gif' alt='Loading' /></div>");

url: "/Account/CustomerTab",
data: { Id: tabID },
cache: false,
type: "get",
dataType: "html",
success: function (result) {
$("#" + tabID).empty().append("<div id='replaceDiv'>" + result + "</div>");

so the tab click works perfectly but once my partial view is loaded then the print button debugger doesn't get hit. this is the button in my partial view.

<button id="printBtn" type="button" class="btn btn-default">Print</button>

Answer Source

Try changing your clickhandler to something like this:

$(document).on('click','#printBtn', function() {
  //your code here
Recommended from our users: Dynamic Network Monitoring from WhatsUp Gold from IPSwitch. Free Download