Button link don't fire the event with jquery
Button link don't fire the event with jquery
jtorroledo
Posts: 1Questions: 0Answers: 0
I have some JQuery that makes an Ajax call and crete a datatable, this one has a column with button link, this button should trigger an event, but never fire the event, instead makes a postback. This is my code.
[code]
$(document).ready(function() {
//Trigger event
$('#datatable_tabletools tbody td a').click('click', function (e) {
e.preventDefault();
// show modal dialog
// Code
});
//Load info to datatable
$("#btn-search").click(function(e){
e.preventDefault();
$.ajax({
url: '../appointment' ,
dataType: 'json',
type: 'get',
data: {date : $('#date').val()},
success: function(data){
var display_results = $("#table1");
display_results.empty();
display_results.html("Loading...");
var results = '';
results += ' Time Date Company';
results += ' ';
if (data.length != 0)
{
$.each(data, function() {
results += '';
results +='' + this.date + '';
results +='' + this.time + '';
results +='' + this.company + '';
results +='';
results +='r<'dt-wrapper't><'dt-row dt-bottom-row'<'row'<'col-sm-6'i><'col-sm-6 text-right'p>>",
"aaSorting": [[ 0, "asc" ]],
"sScrollX": "100%",
"oTableTools" : {
"aButtons" : ["copy", "print", {
"sExtends" : "collection",
"sButtonText" : 'Save ',
"aButtons" : ["csv", "xls", "pdf"]
}],
"sSwfPath" : "assets/js/plugin/datatables/media/swf/copy_csv_xls_pdf.swf"
},
"fnInitComplete" : function(oSettings, json) {
$(this).closest('#dt_table_tools_wrapper').find('.DTTT.btn-group').addClass('table_tools_group').children('a.btn').each(function() {
$(this).addClass('btn-sm btn-default');
});
}
});
};
/* END TABLE TOOLS */
})
[/code]
[code]
$(document).ready(function() {
//Trigger event
$('#datatable_tabletools tbody td a').click('click', function (e) {
e.preventDefault();
// show modal dialog
// Code
});
//Load info to datatable
$("#btn-search").click(function(e){
e.preventDefault();
$.ajax({
url: '../appointment' ,
dataType: 'json',
type: 'get',
data: {date : $('#date').val()},
success: function(data){
var display_results = $("#table1");
display_results.empty();
display_results.html("Loading...");
var results = '';
results += ' Time Date Company';
results += ' ';
if (data.length != 0)
{
$.each(data, function() {
results += '';
results +='' + this.date + '';
results +='' + this.time + '';
results +='' + this.company + '';
results +='';
results +='r<'dt-wrapper't><'dt-row dt-bottom-row'<'row'<'col-sm-6'i><'col-sm-6 text-right'p>>",
"aaSorting": [[ 0, "asc" ]],
"sScrollX": "100%",
"oTableTools" : {
"aButtons" : ["copy", "print", {
"sExtends" : "collection",
"sButtonText" : 'Save ',
"aButtons" : ["csv", "xls", "pdf"]
}],
"sSwfPath" : "assets/js/plugin/datatables/media/swf/copy_csv_xls_pdf.swf"
},
"fnInitComplete" : function(oSettings, json) {
$(this).closest('#dt_table_tools_wrapper').find('.DTTT.btn-group').addClass('table_tools_group').children('a.btn').each(function() {
$(this).addClass('btn-sm btn-default');
});
}
});
};
/* END TABLE TOOLS */
})
[/code]
This discussion has been closed.
Replies
> $('#datatable_tabletools tbody td a').click('click', function (e) {
Is a static event which is applied before the table data is loaded and therefore doesn't have anything to attach to.
Use a jQuery delegate event instead - see the jQuery documentation for how to do so.
Allan