Chenge count of column in fixed column section with an event such as click button
Chenge count of column in fixed column section with an event such as click button
goolbon
Posts: 2Questions: 0Answers: 0
hello,
i create a datatble and this datatable works corrently.
i wana with click a button , add 4 another columns to fixed column section.
so i create datatable at first and create 6 column for fixed column and 1 column for scroll column:
[quote]
var oTable = $("#xStockDataTable")
.bind('draw', function () {
$('#xStockDataTable').find('tr.trbody').click(function () {
$('#xStockDataTable tr.odd').css("background", "#e6e6e6");
$('#xStockDataTable tr.even').css("background", "#fff");
$(".DTFC_Cloned tr.odd").css("background", "#e6e6e6");
$(".DTFC_Cloned tr.even").css("background", "#fff");
$(this).css("background", "#ffcc99");
$(".DTFC_Cloned tr:eq(" + ($(this).index() + 4) + ")").css("background", "#ffcc99");
});
$(".DTFC_Cloned").find('tr.trbody').click(function () {
$('#xStockDataTable tr.odd').css("background", "#e6e6e6");
$('#xStockDataTable tr.even').css("background", "#fff");
$(".DTFC_Cloned tr.odd").css("background", "#e6e6e6");
$(".DTFC_Cloned tr.even").css("background", "#fff");
$(this).css("background", "#ffcc99");
$("#xStockDataTable tr:eq(" + ($(this).index() + 2) + ")").css("background", "#ffcc99");
});
})
.dataTable({
"sDom": '<"top"i>rt<"bottom"lp><"clear">',
"oLanguage": {
"sProcessing": "...",
"sLengthMenu": " : _MENU_",
"sZeroRecords": "",
"sInfo": "_START_ تا _END_", // _TOTAL_
"sInfoEmpty": "",
"sInfoFiltered": "(_MAX_ )",
"sInfoPostFix": "",
"sSearch": ":",
"sUrl": "",
"oPaginate": {
"sFirst": "<<",
"sPrevious": "<",
"sNext": ">",
"sLast": ">>"
}
},
"aLengthMenu": [[-1, 10, 20, 30], ["همه", 10, 20, 30]],
"iDisplayLength": 20,
//"bPaginate": true,
"bPaginate": false,
"sPaginationType": "full_numbers",
"bSortClasses": false,
"bAutoWidth": false,
"bJQueryUI": false,
"bLengthChange": true,
"aaSorting": [[addedCriteria.length + 6, 'asc']], // Sorting on Symbol column by default
"aoColumns": ColumnsArray,
"sScrollX": "100%",
//"sScrollY": "385px",
"sScrollY": GridHeight,
"bScrollCollapse": true,
"fnDrawCallback": function (oSettings) {
$('#xStockDataTable tr.odd').css("background", "#e6e6e6");
$('#xStockDataTable tr.even').css("background", "#fff");
$(".DTFC_Cloned tr.odd").css("background", "#e6e6e6");
$(".DTFC_Cloned tr.even").css("background", "#fff"); }
});
new FixedColumns(oTable, {
"iLeftColumns": 0,
"iLeftWidth": 15,
"iRightColumns": 2,
//"iRightWidth": 290
});
[/quote]
Attention to : id's my datatable is '#xStockDataTable' and iRightColumns : 2 , this work correctly at first and show just 2 column in fixed column.
when i click on my button use bellow code to create 4 another column to fixed column section.
[quote]
var oTable = $('#xStockDataTable');
FixedColumns(oTable, {
"iLeftColumns": 0,
"iLeftWidth": 15,
"iRightColumns": 6,
"iRightWidth": 929
});
[/quote]
but i have this error :
0x800a01b6 - Microsoft JScript runtime error: Object doesn't support property or method 'fnSettings'
and dont show 4 another column.
please help me and thanks for your attention.
i create a datatble and this datatable works corrently.
i wana with click a button , add 4 another columns to fixed column section.
so i create datatable at first and create 6 column for fixed column and 1 column for scroll column:
[quote]
var oTable = $("#xStockDataTable")
.bind('draw', function () {
$('#xStockDataTable').find('tr.trbody').click(function () {
$('#xStockDataTable tr.odd').css("background", "#e6e6e6");
$('#xStockDataTable tr.even').css("background", "#fff");
$(".DTFC_Cloned tr.odd").css("background", "#e6e6e6");
$(".DTFC_Cloned tr.even").css("background", "#fff");
$(this).css("background", "#ffcc99");
$(".DTFC_Cloned tr:eq(" + ($(this).index() + 4) + ")").css("background", "#ffcc99");
});
$(".DTFC_Cloned").find('tr.trbody').click(function () {
$('#xStockDataTable tr.odd').css("background", "#e6e6e6");
$('#xStockDataTable tr.even').css("background", "#fff");
$(".DTFC_Cloned tr.odd").css("background", "#e6e6e6");
$(".DTFC_Cloned tr.even").css("background", "#fff");
$(this).css("background", "#ffcc99");
$("#xStockDataTable tr:eq(" + ($(this).index() + 2) + ")").css("background", "#ffcc99");
});
})
.dataTable({
"sDom": '<"top"i>rt<"bottom"lp><"clear">',
"oLanguage": {
"sProcessing": "...",
"sLengthMenu": " : _MENU_",
"sZeroRecords": "",
"sInfo": "_START_ تا _END_", // _TOTAL_
"sInfoEmpty": "",
"sInfoFiltered": "(_MAX_ )",
"sInfoPostFix": "",
"sSearch": ":",
"sUrl": "",
"oPaginate": {
"sFirst": "<<",
"sPrevious": "<",
"sNext": ">",
"sLast": ">>"
}
},
"aLengthMenu": [[-1, 10, 20, 30], ["همه", 10, 20, 30]],
"iDisplayLength": 20,
//"bPaginate": true,
"bPaginate": false,
"sPaginationType": "full_numbers",
"bSortClasses": false,
"bAutoWidth": false,
"bJQueryUI": false,
"bLengthChange": true,
"aaSorting": [[addedCriteria.length + 6, 'asc']], // Sorting on Symbol column by default
"aoColumns": ColumnsArray,
"sScrollX": "100%",
//"sScrollY": "385px",
"sScrollY": GridHeight,
"bScrollCollapse": true,
"fnDrawCallback": function (oSettings) {
$('#xStockDataTable tr.odd').css("background", "#e6e6e6");
$('#xStockDataTable tr.even').css("background", "#fff");
$(".DTFC_Cloned tr.odd").css("background", "#e6e6e6");
$(".DTFC_Cloned tr.even").css("background", "#fff"); }
});
new FixedColumns(oTable, {
"iLeftColumns": 0,
"iLeftWidth": 15,
"iRightColumns": 2,
//"iRightWidth": 290
});
[/quote]
Attention to : id's my datatable is '#xStockDataTable' and iRightColumns : 2 , this work correctly at first and show just 2 column in fixed column.
when i click on my button use bellow code to create 4 another column to fixed column section.
[quote]
var oTable = $('#xStockDataTable');
FixedColumns(oTable, {
"iLeftColumns": 0,
"iLeftWidth": 15,
"iRightColumns": 6,
"iRightWidth": 929
});
[/quote]
but i have this error :
0x800a01b6 - Microsoft JScript runtime error: Object doesn't support property or method 'fnSettings'
and dont show 4 another column.
please help me and thanks for your attention.
This discussion has been closed.
Replies
Allan