Custom button with the SELECT property
Custom button with the SELECT property
mdiessner
Posts: 34Questions: 0Answers: 0
Hi Alan,
I am trying to create a button using TableTools that is inactive when no records are selected. I am extending the SELECT button that is available. I can't seem to find in the documentation how to change the button ID or button name though:
[code]
//HERE I DEFINE A NEW BUTTON FOR NEW RECORDS
TableTools.BUTTONS.new_record = $.extend( true, TableTools.buttonBase, {
"fnClick": function( nButton, oConfig ) {
//....code to new data
}
} );
//HERE I DEFINE THE DELETE BUTTON
TableTools.BUTTONS.delete_record = $.extend( true, TableTools.buttonBase, {
"fnClick": function( nButton, oConfig ) {
//....code to delete
}
} );
//STANDARD TABLE DEFINITION
$(document).ready(function() {
var oTable = $('#table_main').dataTable( {
"bJQueryUI": true,
"sPaginationType": "full_numbers",
"sDom": "T<'clear'><'H'lfr>t<'F'ip>",
"oTableTools": {
"sRowSelect": "multi",
"aButtons": [
{"sExtends": "new_record","sButtonText": "New Record"},
{"sExtends": "delete_record","sButtonText": "Delete Record"},
]
}
} );
[/code]
This all works fine - NEW and DELETE buttons working great.
I just want to change the DELETE button to only be active when actual rows are SELECTED.
For that I changed it from
[code]
{"sExtends": "delete_record","sButtonText": "Delete Record"},
[/code]
to
[code]
{"sExtends": "select","sButtonText": "Delete Record"},
[/code]
which is also working fine.
however, I then can't use TableTools.BUTTONS.delete_record any more.
My question is how can I change the button identifier 'delete_record' when extending a 'select' button.
Hope this is not too confusing, overall it sounds simple. Should be something like
[code]
{"sExtends": "select","sButtonID":"delete_record","sButtonText": "Delete Record"},
[/code]
I am trying to create a button using TableTools that is inactive when no records are selected. I am extending the SELECT button that is available. I can't seem to find in the documentation how to change the button ID or button name though:
[code]
//HERE I DEFINE A NEW BUTTON FOR NEW RECORDS
TableTools.BUTTONS.new_record = $.extend( true, TableTools.buttonBase, {
"fnClick": function( nButton, oConfig ) {
//....code to new data
}
} );
//HERE I DEFINE THE DELETE BUTTON
TableTools.BUTTONS.delete_record = $.extend( true, TableTools.buttonBase, {
"fnClick": function( nButton, oConfig ) {
//....code to delete
}
} );
//STANDARD TABLE DEFINITION
$(document).ready(function() {
var oTable = $('#table_main').dataTable( {
"bJQueryUI": true,
"sPaginationType": "full_numbers",
"sDom": "T<'clear'><'H'lfr>t<'F'ip>",
"oTableTools": {
"sRowSelect": "multi",
"aButtons": [
{"sExtends": "new_record","sButtonText": "New Record"},
{"sExtends": "delete_record","sButtonText": "Delete Record"},
]
}
} );
[/code]
This all works fine - NEW and DELETE buttons working great.
I just want to change the DELETE button to only be active when actual rows are SELECTED.
For that I changed it from
[code]
{"sExtends": "delete_record","sButtonText": "Delete Record"},
[/code]
to
[code]
{"sExtends": "select","sButtonText": "Delete Record"},
[/code]
which is also working fine.
however, I then can't use TableTools.BUTTONS.delete_record any more.
My question is how can I change the button identifier 'delete_record' when extending a 'select' button.
Hope this is not too confusing, overall it sounds simple. Should be something like
[code]
{"sExtends": "select","sButtonID":"delete_record","sButtonText": "Delete Record"},
[/code]
This discussion has been closed.
Replies
This is super easy - in the sExtends section I just added the fnClick method to call my delete function.
[code]
"sExtends": "select",
"sButtonText": "Delete Record",
"fnClick": function (nButton, oConfig, oFlash) {
//delete stuff comes here
}
[/code]
Thanks Alan - this forum discussion post can be closed now.