After adding dynamic language, appending a control to div.dataTables_length didn't work
After adding dynamic language, appending a control to div.dataTables_length didn't work
babu
Posts: 2Questions: 0Answers: 0
We are having a gridview. with a class gvDataTable and CheckBox list with the class "cbShowOrHideGvCols"
Column display works well.
But the appending the checkboxlist next to div.dataTables_length didn't work.
/*get the language from hidden field*/
var locale = ($('#ctl00_hdnLang').val() || "en-us");
var langFile = "../Scripts/jquery.dataTables.en-US.txt";
if (locale === "zh-cn") { langFile = "../Scripts/jquery.dataTables.zh-CN.txt"; }
var oTable = $('.gvDataTable').dataTable({
"oLanguage": {
"sUrl": langFile
}
});
/*Append the checkbox next to the row count dropdown*/
$(".cbShowOrHideGvCols").appendTo("div.dataTables_length");
/*when the checkbox checked changed event occurs*/
$(".cbShowOrHideGvCols input[type=checkbox]").change(function () {
ToggleGridViewCol(oTable, this, '');
});
/*Remarks: if we want to show or hide gridview columns
grid: GridView.ClientID
ctrl: CheckBoxList control(if we are using foreach)
colIndex: gridview column index we need to show/hide
someValue: this the attribute added to the checkbox, which holds the checkbox value
*/
function ToggleGridViewCol(grid, ctrl, colIndex) {
var col = (colIndex === '') ?
$(ctrl).parent().attr('someValue') : colIndex;
if (col != '') {
var show = $(ctrl).is(":checked");
if ($(grid + " tr").length <= 0) return true; //check gridview loaded/empty
var oTable = $(grid).dataTable();
var bVis = oTable.fnSettings().aoColumns[col].bVisible;
if (show && !bVis)
oTable.fnSetColumnVis(col, true);
else if (!show && bVis)
oTable.fnSetColumnVis(col, false);
}
}
Column display works well.
But the appending the checkboxlist next to div.dataTables_length didn't work.
/*get the language from hidden field*/
var locale = ($('#ctl00_hdnLang').val() || "en-us");
var langFile = "../Scripts/jquery.dataTables.en-US.txt";
if (locale === "zh-cn") { langFile = "../Scripts/jquery.dataTables.zh-CN.txt"; }
var oTable = $('.gvDataTable').dataTable({
"oLanguage": {
"sUrl": langFile
}
});
/*Append the checkbox next to the row count dropdown*/
$(".cbShowOrHideGvCols").appendTo("div.dataTables_length");
/*when the checkbox checked changed event occurs*/
$(".cbShowOrHideGvCols input[type=checkbox]").change(function () {
ToggleGridViewCol(oTable, this, '');
});
/*Remarks: if we want to show or hide gridview columns
grid: GridView.ClientID
ctrl: CheckBoxList control(if we are using foreach)
colIndex: gridview column index we need to show/hide
someValue: this the attribute added to the checkbox, which holds the checkbox value
*/
function ToggleGridViewCol(grid, ctrl, colIndex) {
var col = (colIndex === '') ?
$(ctrl).parent().attr('someValue') : colIndex;
if (col != '') {
var show = $(ctrl).is(":checked");
if ($(grid + " tr").length <= 0) return true; //check gridview loaded/empty
var oTable = $(grid).dataTable();
var bVis = oTable.fnSettings().aoColumns[col].bVisible;
if (show && !bVis)
oTable.fnSetColumnVis(col, true);
else if (!show && bVis)
oTable.fnSetColumnVis(col, false);
}
}
This discussion has been closed.
Replies
added $(".cbShowOrHideGvCols").appendTo("div.dataTables_length");
it worked