0

We are adding rows to the table in html dynamically, But the problem is that Click event of is not trigger for dynamically added rows.

 <table>
   <tbody id="DataTbody">
    <tr>
     <td class="Master-edit">
         Some display.....
     </td>
   <tr>
  </tbody>
 <table>

We have a scroll event to add rows to the " with ID DataTbody"

  var bool_scroll = false;
    $(".sticky-wrap").scroll(function () {
        if (bool_scroll == false) {
            if ($("div.sticky-wrap").scrollTop() > ($("#ContentTable").height() - $("div.sticky-wrap").height() - 1)) {
                bool_scroll = true;

                AddIndmanRecord();

                bool_scroll = false;
            }
        }
    });

var addcount = 0;
function AddIndmanRecord() {

    var Current_tableRowcount = $("#DataTbody").find("tr").length;
    $.ajax({
        type: 'Get',
        url: 'ScrollMaster',
        async: false,
        dataType: "html",
        success: function (data) {
            $("#DataTbody").append(data); // New row to the #DataTbody
   },
        error: function (xhr, ajaxOptions, thrownError) {
            alert(xhr.status);
            alert(thrownError);
        }
    });
}

We have a jQuery for the click of based on the className 'Master-edit'.

$(".Master-edit").dblclick(function () {
$.ajax({
    async:false,
    // Call CreatePartialView action method
    url: "/Master/EditPartial",
    type: 'Get',
    success: function (data) {
         //Some display
    },
    error: function () {
        alert("something seems wrong");
    }
});

});

Here td with className ".Master-edit" not trigger the click event if it added dynamically otherwise working fine.

JKANNAN
  • 83
  • 1
  • 10
  • 2
    You need to use [**Event Delegation**](http://learn.jquery.com/events/event-delegation/) using [**.on()**](http://api.jquery.com/on/) delegated-events approach. – Satpal Feb 09 '15 at 09:42
  • @Satpal But the hover is not working using .on() – JKANNAN Feb 09 '15 at 10:23
  • Use `mouseenter` and `mouseleave` event instead of [`hover()`](http://api.jquery.com/hover/#hover1) as it is shorthand for `$( selector ).mouseenter( handlerIn ).mouseleave( handlerOut )` – Satpal Feb 09 '15 at 11:25

0 Answers0