вызов функции javascript в onClick

Question

Когда я развертываю свой код, он дает мне ошибку: saveRows не является функцией Итак, что случилось?

dataGrid.prototype = { 
 
     display: function() { 
 
     var self = this; 
 
     var html = []; 
 
     var check = 0; 
 
     var lastSelection; 
 
     html.push("<div style='margin-left:20px'>"); 
 
     html.push("<input class='btn btn-default' type='button' value='Save All Rows' onclick='saveRows()'' />"); 
 
     html.push("<table id='" + this.id + "" + "'class='table'>\n</table>"); 
 
     html.push("<div id='pagger_" + this.id + "'></div>"); 
 
     html.push("</div>"); 
 
     $('body').append(html.join("")); 
 
     $("#" + this.id).jqGrid({ 
 
      // ... 
 
     }); 
 
     }, 
 
     // ... 
 
     saveRows: function() { 
 
     var ids = $("#" + this.id).jqGrid('getDataIDs'); 
 
     for (var i = 0; i < ids.length; i++) { 
 
      $("#" + this.id).jqGrid('saveRow', ids[i]); 
 
     } 
 
     } 
 
    };

поэтому любые другие предложения ??

Answer 1

Вы можете изменить

<input class='btn btn-default' type='button' value='Save All Rows' 
     onclick='saveRows()'' /> 

в

<input id='mysave' class='btn btn-default' type='button' value='Save All Rows'/> 

и использовать

$("#mysave").click(function() { 
    // any code executed on click on the button 
}); 

Answer 2

saveRows функция является частью dataGrid прототипа. Поэтому он не определяется как глобальная функция и не может быть определен как обработчик onclick в простом HTML.

Вы можете решить свою проблему, создав элементы DOM, используя jQuery вместо строк HTML, и напрямую привяжите обратный вызов onclick. Например (непроверенных):

$(body).append(
    $('<div/>').style('margin-left', '20px').append(
     $('<button/>', { 
      'class': 'btn btn-default', 
      'text': 'Save All Rows' 
     }).on('click', function() { 
      self.saveRows(); 
     }), 
     $('<table/>', { 
      'id': self.id, 
      'class': 'table' 
     }), 
     $('<div/>', { 
      'id': 'pager_' + self.id 
     }) 
    ) 
); 

Answer 3

изменения этого:

html.push("<input class='btn btn-default' type='button' value='Save All Rows' onclick='saveRows()'' />"); 

на самом деле объект:

var theInput = $("<input class='btn btn-default' type='button' value='Save All Rows'>"); 
    $(document).on("click", theInput, function(){self.saveRows()}); 

, а затем добавить его в HTML-массива.

html.push($(theInput)[0].outerHTML); 

https://jsfiddle.net/atg5m6ym/3524/

Answer 4

Вы можете попробовать это

$('body').on('click','#yourButtonId',function(){ 
    saveRows(); 
});