js event in a handlebars template

Question

When i click on a button, my template who have a table is feeded.

I want to do an action when i double click to a row of a table in a handlebar template.

<body>
<script id="lodgerSearchResult-template" type="text/x-handlebars-template">
    <div class="span12">
    <table id="lodgerSearchResultTable" data-show-header="true" class="table" data-toggle="table" data-height="250">
    <thead>
    <tr>
    <th>#</th>
    <th>Nom</th>
    <th>Date de naissance</th>
    <th>N.A.S.</th>
    <th>N.A.M.</th>
    <th>Immeuble</th>
    </tr>
    </thead>
    <tbody>
       {{#each this}}
       <tr>
         ...
         ...
       </tr>
       {{/each}}
    </tbody>
  </table>
</script>
</body>



<script>
   $('#lodgerSearchResultTable > tbody').dblclick(function () {
    alert($(this).text());
   });
</script>

Actually, nothing happen.

Edit: i put the double click event in the ajax success answer

$('#lodgerSearch').on('click', function (e) {

    var searchParam = $('#srch-term').val();
    var url = "http://localhost:8080/lodgers/search";
    if (searchParam != "") {
        url = "http://localhost:8080/lodgers/search?searchTemp=" + searchParam;
    }

    jQuery.ajax({
        type: "GET",
        url: url,
        success: function (data, status, jqXHR) {

            $("#lodgerSearchResult").empty().append(template(data));
            // is the line i added
            $('#lodgerSearchResultTable > tbody').dblclick(function () {
                alert($(this).text());
            });

        },
        error: function (jqXHR, status) {
            // error handler
            alert("error " + jqXHR + " -  " + status);
        }
    });
    // e.preventDefault();
});

Is there a cleaner way to do the same thing?

Answer 1

i mean:

<script>
  alert('table before: ' + String($('#lodgerSearchResultTable')));
  $( document ).ready(function() {
     alert('table after: ' + String($('#lodgerSearchResultTable')));
     $('#lodgerSearchResultTable > tbody').dblclick(function () {
        alert($(this).text());
     });
  });
</script>

other non-clear solution

<script>

  $( document ).ready(function() {

     $('#lodgerSearchResult').dblclick(function (event) {

        console.log(event.target);

        var res_table = $('#lodgerSearchResultTable > tbody');
        if( res_table ) {
            alert(res_table.text());
        }
     });
  });
</script>

js event in a handlebars template

Question

1 answers

solution1
1 ACCPTED 2015-06-18 23:45:56

js event in a handlebars template

Question

1 answers

solution1 1 ACCPTED 2015-06-18 23:45:56

solution1
1 ACCPTED 2015-06-18 23:45:56