 Show Posts
|
|
Pages: 1 ... 3 4 [5]
|
|
62
|
General Category / EasyUI for jQuery / Form Fields Misaligned in Window
|
on: February 14, 2022, 03:50:21 AM
|
Hi, Form fields tend to be misaligned in Window. Please, have a look at the screenshot and code below. Any Help? Window Contents fetched from ajax: <div class="easyui-layout" data-options="fit:true">
<div data-options="region:'west',cls: 'pd3',collapsible:false" title="დეტალები" style="width:40%;padding:5px;background-color:#dfe8f6 !important;">
<table style="width:100%; ">
<tr>
<td>
<input class="easyui-textbox" value="<? echo "".vremja3($query['time'])."";?>" data-options="labelWidth: 140, readonly:true,label:'შესრულების თარიღი:',labelPosition:'left',prompt:'...'" style="width:100%; height:22px">
</td>
</tr>
<tr>
<td>
<input class="easyui-textbox" value="<? echo "".vremja3($query['time'])."";?>" data-options="labelWidth: 140, readonly:true,label:'ბოლო რედაქტირების თარიღი:',labelPosition:'left',prompt:'...'" style="width:100%; height:22px">
</td>
</tr>
<tr>
<td>
<input type="text" class="easyui-textbox" value="<? echo "" . $query['code'] . ""; ?>" data-options="labelWidth: 140, label:'<span title=\'კონტრაქტი\'>კონტრაქტი</span>:',labelPosition:'left',prompt:'მიმდინარე კონტრაქტი.',readonly: true" style="width:100%;height:22px;">
</td>
</tr>
<tr>
<td>
<input type="text" class="easyui-textbox" value="<? echo "" . vremja3($query['contract_start']) . ""; ?>-<? echo "" . vremja3($query['contract_end']) . ""; ?>" data-options="labelWidth: 140, label:'<span title=\'კონტრაქტის ვალიდურობა\'>ვალიდურობა</span>:',labelPosition:'left',prompt:'ვალიდურობის პერიოდი.',readonly:true" style="width:100%;height:22px">
</td>
</tr>
<tr>
<td>
<input class="easyui-textbox" value="<? echo "" . contract_status($query['status']) . ""; ?>" labelPosition="left" data-options="labelWidth: 140, label: '<span title=\'კონტრაქტის სტატუსი\'>სტატუსი</span>:',prompt:'...',readonly:true" style="width:100%; height:22px">
</td>
</tr>
<tr>
<td>
<input class="easyui-textbox" value="<? echo "".$query['avtori']."";?>" data-options="labelWidth: 140, readonly:true,label:'ოპერაციის ავტორი:',labelPosition:'left',prompt:'...'" style="width:100%; height:22px">
</td>
</tr>
<tr>
<td>
<input class="easyui-textbox count-files" value="<? echo "".$query['files']."";?>" data-options="labelWidth: 140, readonly:true,label:'ფაილების რნ-ბა:',labelPosition:'left',prompt:'...'" style="width:100%; height:22px">
</td>
</tr>
</table>
<hr>
<form id="Upload_view_contract_details" class="easyui-form" method="post" enctype="multipart/form-data" style="max-width: 100%">
<table style="width:100%; ">
<tr>
<td>
<input class="easyui-filebox Pdf" name="Pdf" data-options="labelWidth: 140, labelPosition:'left', label: 'PDF ფაილი', required: true, prompt:'Choose another file...',validType: 'maxFileSize[2500]',accept: '.pdf'" style="width:100%; height:22px;">
</td>
</tr>
<tr>
<td>
<input class="easyui-textbox comment" name="comment" data-options="labelWidth: 140,label:'კომენტარი:',labelPosition:'left',prompt:'...',validType:['minLength[0]','maxLength[190]']" style="width:100%; height:22px;">
</td>
</tr>
</table>
<br>
<button type="submit" class="easyui-linkbutton" data-options="iconCls:'icon-save'">ფაილის ატვირთვა</button>
</form>
</div>
<div data-options="region:'center',cls: 'pd3',collapsible:false" title="მიმაგრებული ფაილები" style="background-color:#dfe8f6 !important;">
<table class="easyui-datagrid" id="view_contract_details" style="width:100%;"></table>
</div>
</div>
 |
|
|
|
|
66
|
General Category / EasyUI for jQuery / Conflict between enableFilter and enableCellEditing
|
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'
}); |
|
|
|
|
67
|
General Category / EasyUI for jQuery / How to minimize the Window into a new tab
|
on: December 15, 2021, 12:16:19 PM
|
Hello, I need to minimize a window into a new tab. Namely, on clicking the minimize button of the window, I need the content of the window to be inserted in the newly created tab, copying the title of the window and setting it to the tab title. I have tried the following, but it doesn't seem to be perfect. Any suggestions? onMinimize: function() {
var birthday = $('#windowPopUp').find('#birthday').datebox('getValue');
var city = $('#windowPopUp').find('#city').combobox('getValue');
var office = $('#windowPopUp').find('#office').combobox('getValue');
var department = $('#windowPopUp').find('#department').combobox('getValue');
var contents = $('#windowPopUp').contents();
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: contents,
fit: true,
cls: 'pd3',
closable: true
});
$('#'+id).find('#birthday').datebox('setValue', birthday);
$('#'+id).find('#office').combobox('setValue', office);
$('#'+id).find('#department').combobox('setValue', department);
$('#'+id).find('#city').combobox('setValue', city);
} |
|
|
|
|
69
|
General Category / EasyUI for jQuery / How to bind Form Submit Function to the Content from Window Refresh (new URL)?
|
on: December 03, 2021, 11:59:10 PM
|
Hello, I am stuck... Any help will be much appreciated. After the user submits the form which is located in Window, there is refresh function from a new URL: $('#windowPopUp').window('refresh', '/saoperatoro/editUser.php?id='+data.user);
the refresh URL loads new form. My question is how to add $('#...').form('submit', {... to the form that was loaded after refreshing the window? Here is the full code: function CreateOperator(){
$.messager.progress({ title: 'მიმდინარეობს მონაცემების შენახვა', msg: 'გთხოვთ, დაელოდოთ...' });
$('#CreateOperator').form('submit', {
url: '/api-submitCreateOperator',
onSubmit: function(){
var isValid = $(this).form('validate');
if (!isValid){
$.messager.progress('close'); // hide progress bar while the form is invalid
}
return isValid; // return false will stop the form submission
},
success: function(data){
$.messager.progress('close'); // hide progress bar while submit successfully
var data = eval('(' + data + ')'); // change the JSON string to javascript object
if (data.success){
//$('#windowPopUp').window('refresh', '/saoperatoro/editUser.php?id='+data.user);
$('#windowPopUp').window({
title: 'მომხმარებლის რედაქტირება',
width: '80%',
height: 600,
modal: true,
resizable: true,
closeAnimation: 'hide',
minimize: 'animate',
collapsible: false,
href: '/saoperatoro/editUser.php?id='+data.user,
footer: '#windowPopUpFooter',
onBeforeLoad: function() {
$(this).window('hideFooter');
$.messager.alert('წარმატებით შესრულდა',data.message);
},
onLoad: function() {
$(this).window('showFooter');
$(this).window('footer').html('<a href="#" class="easyui-linkbutton" iconCls="icon-ok" style="width:80%;height:32px">Register</a> <a href="#" class="easyui-linkbutton" iconCls="icon-ok" style="width:20%;height:32px">Cancel</a>');
$(this).window('footer').css('padding', '5px');
},
onMinimize: function() {
var contents = $('#windowPopUp').contents();
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: contents,
fit: true,
cls: 'pd3',
closable: true
});
}
});
$('#operatorsIndex').datagrid('reload');
}
if (data.error){
$.messager.alert('შეცდომა',data.message,'error');
}
}
});
} |
|
|
|
|
