|
poeziafree
|
 |
« on: December 19, 2021, 11:24:55 AM » |
|
Hello, I have an issue with using the DataGrid filtering and cell editing at the same time. When I click one of the cells, the cell gets yellowish color (gets selected), and at this time, it is impossible to type anything in the filter input field. So, if the cell is selected, typing in the column filter input is impossible. Please, advise me what to do... Here is my code var dg = $('#operatorsIndex').datagrid();
dg.datagrid({
url: '/saoperatoro/dataGrids.php?saoperatoro',
rownumbers: true,
loadMsg: 'მონაცემები იტვირთება...',
emptyMsg: 'მონაცემები არ მოიძებნა',
clickToEdit: false,
dblclickToEdit: true,
checkbox: true,
fit: true,
nowrap: true,
remoteFilter: true,
remoteSort: true,
clientPaging: false,
pagination: true,
pageSize: 10,
pageList: [5, 10, 20, 50],
sortName: 'id',
idField: 'id',
sortOrder: 'desc',
frozenColumns: [
[{
field: 'ck',
checkbox: true,
width: 100
},
{
field: 'id',
title: '<b>ოპერატორი</b>',
width: 100,
sortable: true,
order: 'desc',
styler: function(value,row,index){
return {class:'see-details',style:'cursor:help'}
}
},
{
field: 'user_name',
title: 'სახელი და გვარი',
width: 100
}
]
],
columns: [
[{
field: 'departamenti',
title: 'დეპარტამენტი',
width: 100,
sortable: true,
order: 'desc'
},
{
field: 'email',
title: 'Name',
width: 100
},
{
field: 'active',
title: 'სტატუსი',
width: 100,
styler: function(value,row,index){
if (value==0)
{
return 'background-color: red';
}
},
formatter: function(value, row) {
if (value == 1)
return 'აქტიური';
else if (value == 0)
return 'შეზღუდული';
},
editor: {
type: 'combobox',
options: {
valueField: 'label',
textField: 'value',
data: [{
label: '0',
value: 'შეზღუდული'
}, {
label: '1',
value: 'აქტიური'
}],
required: true
}
}
},
{
field: 'pin',
title: 'პ/ნ',
width: 100
},
{
field: 'threshold',
title: 'გეგმა',
width: 100,
editor: {
type: 'numberspinner',
options: {
min: 1,
max: 1000000,
editable: true,
required: true
}
}
},
{
field: 'rating',
title: 'რეიტინგი',
width: 100
},
{
field: 'date_last',
title: 'ბოლო აქტივობა',
width: 120,
formatter: function(value, row) {
return moment.utc(value * 1000).format('DD.MM.YYYY HH:mm');
}
},
]
],
toolbar: [{
iconCls: 'icon-add',
tooltip: 'მომხმარებლის შექმნა',
handler: function() {
var id = 'create-operator';
var title = '<uniqueID>' + id + '<\/uniqueID> მომხმარებლის შექმნა';
var tabPanel = $('#wu-tabs');
if (tabPanel.tabs('exists', title)) {
tabPanel.tabs('select', title);
return false;
}
$('#windowPopUp').window({
title: 'საოპერატორო: მომხმარებლის შექმნა',
width: '80%',
height: 600,
modal: true,
resizable: true,
closeAnimation: 'hide',
minimize: 'animate',
collapsible: false,
href: '/saoperatoro/create_user.php',
footer: '#windowPopUpFooter',
onMinimize: function(){
var id = 'create-operator';
var title = '<uniqueID>' + id + '<\/uniqueID> მომხმარებლის შექმნა';
var tabPanel = $('#wu-tabs');
if (tabPanel.tabs('exists', title)) {
tabPanel.tabs('select', title);
return false;
}
tabPanel.tabs('add', {
id: id,
title: title,
content: '<div id="tabs-window" style="position:relative;width:100%;height:100%;overflow:auto"></div>',
fit: true,
closable: true
})
$('#windowPopUp').contents().appendTo('#tabs-window');
}
});
}
}, '-', {
iconCls: 'icon-print',
tooltip: 'ბეჭვდა',
handler: function() {
var rows = $('#operatorsIndex').datagrid('getData').filterRows;
dg.datagrid('print', {
title: 'DataGrid',
caption: 'ოპერატორების სია',
rows: rows,
fields: ['id', 'user_name', 'departamenti', 'pin', 'rating']
});
}
}, '-', {
iconCls: 'icon-save',
tooltip: 'XLS ფორმატით ჩამოტვირთვა',
handler: function() {
dg.datagrid('toExcel', {
filename: 'DataGrid.xls',
worksheet: 'Worksheet',
caption: 'ოპერატორების სია',
fields: ['id', 'user_name', 'departamenti', 'pin', 'rating']
});
}
}, '-', {
iconCls: 'icon-filter',
disabled: true,
id: 'btn',
tooltip: 'ფილტრის გაუქმება',
handler: function() {
dg.datagrid('removeFilterRule');
dg.datagrid('doFilter');
}
}, '-', {
iconCls: 'icon-filter',
disabled: true,
id: 'selected',
tooltip: 'ფილტრის გაუქმება',
handler: function() {
dg.datagrid('removeFilterRule');
dg.datagrid('doFilter');
}
}
],
onLoadSuccess: function(data) {
$(this).datagrid('getPanel').find('.l-btn').each(function() {
var opts = $(this).linkbutton('options');
$('.sbtn').linkbutton({
iconCls: 'icon-search'
});
});
$(this).datagrid('getPanel').find('.l-btn').each(function() {
var opts = $(this).linkbutton('options');
if (opts.tooltip) {
$(this).tooltip({
content: opts.tooltip
})
}
});
var opts = $(this).datagrid('options');
if (opts.filterRules.length === 0) {
$(this).datagrid('getPanel').find('#btn').linkbutton('disable');
} else {
$(this).datagrid('getPanel').find('#btn').linkbutton('enable');
}
},
onAfterEdit: function(index, row, changes) {
console.log(changes);
dg.datagrid('updateRow', index);
},
onDblClickCell: function(index,field,value){
if (field=='id')
{
alert('eee')
}
},
onCheck: function(index,row){
var ids = [];
var rows = dg.datagrid('getChecked');
for (var i = 0; i < rows.length; i++) {
ids.push(rows[i].id);
}
//console.log(ids);
$(this).datagrid('getPanel').find('#selected').linkbutton('enable');
},
onCheckAll: function(index,row){
var ids = [];
var rows = dg.datagrid('getChecked');
for (var i = 0; i < rows.length; i++) {
ids.push(rows[i].id);
}
//console.log(ids);
var count = $(this).datagrid('getChecked').length;
$(this).datagrid('getPanel').find('#selected').linkbutton('enable');
},
onUncheckAll: function(index,row){
var ids = [];
var rows = dg.datagrid('getChecked');
for (var i = 0; i < rows.length; i++) {
ids.push(rows[i].id);
}
//console.log(ids);
var count = $(this).datagrid('getChecked').length;
$(this).datagrid('getPanel').find('#selected').linkbutton('disable');
},
onUncheck: function(index,row){
var ids = [];
var rows = dg.datagrid('getChecked');
for (var i = 0; i < rows.length; i++) {
ids.push(rows[i].id);
}
//console.log(ids);
var count = $(this).datagrid('getChecked').length;
if (count==0)
{
$(this).datagrid('getPanel').find('#selected').linkbutton('disable');
}
}
});
//enable filter
dg.datagrid('enableFilter', [{
field: 'rating',
type: 'numberbox',
options: {
precision: 1
},
op: ['equal', 'notequal', 'less', 'greater']
}, {
field: 'threshold',
type: 'numberbox',
options: {
precision: 1
},
op: ['equal', 'notequal', 'less', 'greater']
},
{
field: 'date_last',
type: 'datebox',
op: ['equal', 'notequal', 'less', 'lessorequal', 'greater', 'greaterorequal'],
options: {
panelWidth: '240',
editable: false,
formatter: function(date) {
var y = date.getFullYear();
var m = date.getMonth() + 1;
var d = date.getDate();
return (d < 10 ? ('0' + d) : d) + '.' + (m < 10 ? ('0' + m) : m) + '.' + y;
},
parser: function(s) {
if (!s) return new Date();
var ss = (s.split('.'));
var y = parseInt(ss[2], 10);
var m = parseInt(ss[1], 10);
var d = parseInt(ss[0], 10);
if (!isNaN(y) && !isNaN(m) && !isNaN(d)) {
return new Date(y, m - 1, d);
} else {
return new Date();
}
},
onShowPanel: function() {
var c = $(this).datebox('calendar');
c.calendar({
validator: function(date) {
var now = new Date();
var d1 = new Date(now.getFullYear(), now.getMonth(), now.getDate());
var d2 = new Date(now.getFullYear(), now.getMonth(), now.getDate());
return date <= d2;
}
})
}
}
},
{
field: 'departamenti',
type: 'combobox',
options: {
panelHeight: 'auto',
data: [{
value: 'ტექნიკური სამსახური',
text: 'ტექ. სამსახური'
}, {
value: 'შესყიდვები',
text: 'შესყიდვები'
}, {
value: 'გაყიდვები',
text: 'გაყიდვები'
}, {
value: 'ლოჯისტიკა',
text: 'ლოჯისტიკა'
}],
onChange: function(value) {
if (value == '') {
dg.datagrid('removeFilterRule', 'departamenti');
} else {
dg.datagrid('addFilterRule', {
field: 'departamenti',
op: 'equal',
value: value
});
}
dg.datagrid('doFilter');
}
}
}, {
field: 'active',
type: 'combobox',
options: {
panelHeight: 'auto',
data: [{
value: '0',
text: 'შეზღუდული'
}, {
value: '1',
text: 'აქტიური'
}],
onChange: function(value) {
if (value == '') {
dg.datagrid('removeFilterRule', 'active');
} else {
dg.datagrid('addFilterRule', {
field: 'active',
op: 'equal',
value: value
});
}
dg.datagrid('doFilter');
}
}
}
]);
dg.datagrid('enableCellEditing').datagrid('gotoCell', {
index: 0,
field: 'id'
}); |
