常見問答

如何使DataGrid的欄位可以排序?
進入EEPCloud畫面，左側點選RWD(Boostrap)打開表單，點選dgMaster，再點選 Columns ，
最後選擇您要排序的欄位，並將 Sortable 打勾即可。
查詢窗體中的Combobox如何額外設定Where的條件?
在DataGrid的QueryColumn中，找到Combobox元件，並在OnBeforeLoad事件裡點兩下，會自動產生以下的方法:

function dgMaster_CustomerID_onBeforeLoad(param)
{
param.whereStr = "Code like 'A%'" //你的where條件
}
如何控制DataGrid上ToolItem隱藏或顯示?
如下在表單的 JS中，增加下列程式來隱藏"新增"的按鈕 (新增的onclick為"insert_row")

$('#dgMaster').prev('div.datagrid-toolitem').find('.btn').each(function () {
var options = $.parseOptions(this);
if (options.onclick == 'insert_row') {
$(this).hide();
}
});

上面的
dgMaster -> datagrid 的ID
insert_row ->toolitem onClick呼叫的function名稱
$(this).hide(); -> toolitem隱藏
$(this).show(); -> toolitem 顯示
如何在DataGrid的欄位中顯示多行(使用 Multiline的格式但顯示不會換行)?
請在datagrid的該欄位中設定Formatter事件，產生如下的js程式即可:

function dgMaster_地址_formatter(value, row, index)
{
value=value.replace(/\n/g,'<br>');
return value;
}
Image 在datagrid 如何控制照片大小(寬度)?
設定 DataGrid的相片 Format屬性即可，如下:

image,Images,200 (200代表相片寬度)
如何讓DataGrid TextArea的內容換行顯示如同在DataForm顯示的樣子?
請在DataGrid該欄位的Formatter設定一個Function名稱

然後請至 "原始碼" 寫下以下的function
function test(value, row, index)
{
return value.replace(/\n/g,"<br />");
}
呼叫後端Server Method改變了資料後, 前端的DataGrid如何更新?
呼叫完後端Server Mehod完畢後，請添加以下的程式碼
$('#dgMaster').datagrid('load');
如何控制DataGrid瀏覽選擇時, 可以對應到另一個DataGrid顯示相對資料?
在DataGrid的Toolitem添加一個按鈕去執行ServerMethod

前端的JS
function serverMethod(){
var row = $('#dgMaster').datagrid('getSelected'); //取得dgMaster上選中的一筆資料
$.callMethod('sCustomers', 'testServerMethod', {CustomerID: row.CustomerID}, function(result){
var rows = $.parseJSON(result); //將JSon轉回Object類型提供給Grid顯示
$('#DataGrid1').datagrid('loadData', {rows:rows,total:rows.length});
})
}

裡面的callMethod方法內參數依序是：ServerModule的名字、ServerMethod的名字、上傳的參數（如果沒有的話可以填null）、Server端返回時的回調方法

後端的js
exports. testServerMethod = function(param, callback){
var clientInfo = this.clientInfo;
var CustomerID =param.CustomerID;
var sql = "select 名稱 from 客戶資料表 where 客戶編號 = '"+ CustomerID +"'"; //SQL條件句
this.queryRaw(clientInfo, clientInfo.database, sql, {}, callback);
}
如何在DataGrid中, 只更新一筆數據?
$(target).datagrid('updateRow', {
index: index,
row: { fieldName: 'value'}//可以多欄位用','隔開
});

target -> DataGrid的ID
fieldName -> 欄位名稱
'value' -> 給予的值
如何在DataGrid中, 只重新載入當頁數據?
var page = $('#dgMaster').datagrid('options').page;
$('#dgMaster').datagrid('load', { page: page});
如何控制 DataGrid的更改與刪除是否可以執行?
function dgMaster_onUpdate(row)
{
var date = row.進貨日期.substr(0,4)+row.進貨日期.substr(5,2);
var closeym = $.getVariableValue('closeYM');
if (date <= closeym) {
$.alert("進貨日期小於結帳日, 無法刪除與更改",'info');
return false;
}
return true;
}
在DataGrid的印表到Word或Excel上, 可否動態更換Word或Excel的檔名格式嗎?
可以的, 透過 DataGrid.ToolItems中, 設定onclick事件, 重新定義Word或Excel的檔名即可, 如Excel為:
function exportExcel2()
{
$(this).datagrid('exportExcel', '銷貨統計表依業務'); // 更換成"銷貨統計表依業務.xls"
}
Word則為:
function exportWord2()
{
$(this).datagrid('exportWord', '出貨單2'); // 更換成"出貨單2.doc"
}
如何新增時複製DataGrid的某一筆資料?
請在DataGrid的ToolItem添加一個按鈕，
OnClick 呼叫 copy_row
如何讓DataGrid與DataForm同時顯示，並兩者互相同步?
只要把DataGrid的EditForm清空，並將DataForm的Mode設為Panel後，再設定 DataGrid的 onSelect事件就可以讓 DataGrid與DataForm同時與同步顯示: 如下:
function dgMaster_onSelect(index, row)
{
$('#dfMaster').form('setWhere', "F001=" + row.F001);
}
如果EditForm要能夠編輯，可以設定ToolItem內的Add/Update/Submit/Cancel等Button即可，並設定onApplied事件去同步DataGrid的內容，如下:
function dfMaster_onApplied(data)
{
var page = $('#dgMaster').datagrid('options').page
$('#dgMaster').datagrid('load', {page: page});
}
如果DataGrid上有兩個欄位分別DrillDown到不同表單時, 會兩個都同時打開追蹤, 請問如何避免?
在 DataGrid上的Format除了選擇"drilldown"格式外, 還要設定其對應的DrillDown組件,
如設定為: "drilldown,#Drill進貨退回單" 代表要追蹤的對應組件。
如何以Tree組件自由控制DataGrid的Where條件?
透過 Tree組件的onNodeSelected事件來實現, 如下:
function Tree1_onNodeSelected(event, node)
{
var sID = node.row.項目序號;
var dataGrid = $('#dgDetail');
dataGrid.datagrid('setWhere',"(項目序號='"+sID+"' or 上層項目='"+sID+"')");
}
DataGrid如何預設打開的顯示條件?
透過onBeoforeLoad事件來改變Where條件即可。如下:
function dgMaster_onBeforeLoad(param)
{
var user = $.getVariableValue('user');
param.whereStr = "交辦人 = '" + user + "' or 待辦人='" + user + "'";
}
如何取得DataGrid欄位的值?
var rows = $('#dgMaster').datagrid('getRows');
var index=$('#dgMaster').datagrid('getSelectedIndex');
var row=rows[index];
alert(row.欄位名稱); //欄位名稱請自行替換
如何在DataGrid中選擇一筆資料, 然後呼叫後端的處理程序?
在DataGrid中加一個Button, 然後寫一個JS的方法來調用後端的程序, 如下:
function createPo() {
var sIndex = $("#dgMaster").datagrid("getSelectedIndex");
if (sIndex >= 0) {
var pno = $("#dgMaster").datagrid("getRows")[sIndex].訂單號碼; //取出訂單號碼
$.callMethod('客戶訂單','doCreatePo',{type:1,no:pno},function(result){
$.alert(result,'info');
});
}
else {
$.alert('請選擇一筆訂單','info');
}
}
如何在 DataGrid中以 Excel上傳來匯入資料,而不是一筆一筆輸入?
可以在DataGrid的ToolItems中, 新增一個"導入"的Button, 設定為 'importExcel' 即可
如何動態隱藏某一個DataGrid?
如下的程序:
$(‘#dgMaster’).closest('div').parent().hide();//隱藏datagrid
如何在Drilldown時自定參數傳給另一個頁面?
在Drilldown的onClick雙擊添加一個事件，如下:
function Drilldown1_onClick(row, whereItems)
{
row.parameter1 = "abc"; //自定一個parameter1 參數
return true;
}

在目標頁面寫下
$(function(){
var drillRow = $.getEncryptParameter('drillRow', 'drill'); //取出drillRow的對象
var myPara1=drillRow.parameter1; // 取出parameter1參數
});
如何在DataGrid的編輯中, 讀取欄位的編輯內容, 及改變某欄位的內容?
可以透過Columns中的個別事件讀取與設定DataGrid欄位內容, 如在Refval或Combo可以透過onSelect事件, Textbox可以透過onBlur事件來處理, 如下範例:
function dgDetail_項目次序_onSelect(row)
{
var type = $('#dgDetail').datagrid('getEditorValue', '類別'); //讀取欄位值
var amt = 0;
if (type=="代扣所得") {
amt = -($('#dptab_薪資設定_所得扣繳金額').val());
}
else if (type=="代扣保險") {
amt = -($('#dptab_勞保健保資料_本人勞健保費').val());
}
$('#dgDetail').datagrid('setEditorValue',{field: '金額', value: amt}); // 設定欄位值
}
Master/Detail中如何清除所有Detail的DataGrid資料?
function delAll() {
//取消確認框的方法,但如果ConfirmDelete設為False就不用這段
$.confirm = function (text, callback) {
callback(true);
};
var rows = $("#dgDetail").datagrid('getRows');
var cnt = rows.length;
for (var i = cnt - 1 ;i>= 0 ; i--) {
$('#dgDetail').datagrid('delete_row', 0);
}
$('#dfMaster').form('submit'); //如果要自動存檔的話
}
為何DataGrid裡的ToolItems中的OnClick無法讓我鎖定成我更改過後的,每次iCoder產生時都會把我改的OnClick覆蓋?
ToolItems的OnClick屬性為版本差異比對的主要key值, 所以無法鎖定,
每次Word輸出都會被覆蓋, 如果不想被覆蓋的話，請直接添加一個新的按鈕，這樣重新匯入Word時就不會覆蓋掉OnClick。
請問,如何用JS去更改DataGrid的欄位內容?
如下,透過DataGrid的getRows與updateRow的方法:
function updTax() //更新稅額
{
var rows = $('#dgDetail').datagrid('getRows');
for(var i = 0; i<rows.length; i ++){
var row = rows[i];
if(row.類別=='代扣所得' ){
var amt= -($('#dptab_薪資設定_所得扣繳金額').val());
$('#dgDetail').datagrid('updateRow',{index: i,row: {'金額': amt}});
}
if(row.類別=='代扣保險' ){
var amt= -($('#dptab_勞保健保資料_本人勞健保費').val());
$('#dgDetail').datagrid('updateRow',{index: i,row: {'金額': amt}});
}
}
}
如何讓DataGrid某欄位的數值隨著條件變更顏色且依然使用原先的format?
舉例如下:
function dgMaster_總計含稅_formatter(value, row, index)
{
if (value && value > 50000 ){
return '<span style="color:red">' + $.getFormatValue.call(this, value, row, $(this)[0].format) + '</value>';
}
else {
return $.getFormatValue.call(this, value, row, $(this)[0].format);
}
}
DataGrid的欄位寬度通常是自動調整的,如何控制某些欄位讓他固定的寬度,以滿足使用者輸入的要求?
RWD的DataGrid是自適應寬度, 所以需透過CSS來改變欄位寬度, 可在EEPCloud中貼入Literal網頁組件, 並以CSS的方式在Html屬性中來改變欄寬, 如下:
<style>
#dgMaster thead>tr>th:nth-child(3),
#dgMaster thead>tr>th:nth-child(4){
width: 150px!important;
}
</style>
註: dgMaster為DataGird的ID, child(3),(4)為DataGird的Columns次序(從3起算)
如何用JS程式取得DataGrid的查詢條件?
可以透過Runtime頁面的查詢元件以右鍵的'檢查'來得知查詢物件的ID, 再透過如下的JS來取得查詢內容:
var yymm = $('#dgMasterqueryObj_薪資年月').dateselect('getValue');
var co = $('#dgMasterqueryObj_子公司').combobox('getValue');
var all = $('#dgMasterqueryObj_全部印出').selectoptions('getValue');
如何動態更改DataGrid的資料源(RemoteName), 來達到動態的統計效果?
例如, 原來資料為月份統計的明細, 可以透過一個 '年度彙總' 改為年度的統計內容, 如下:
function reLoad()
{
$('#dgMaster').datagrid('options').remoteName = '薪資發放作業.薪資發放統計';
$('#dgMaster').datagrid('load');
}
如何用js動態隱藏DataGrid?
舉例如下:
$('#dgMaster').closest('div').parent().hide();//隱藏DataGrid
//$('#dgMaster').closest('div').parent().show();//顯示DataGrid
DataGrid編輯時, 如果有些欄位為ReadOnly狀態, 可否使用原來顯示的格式, 而非ReadOnly的文字編輯框?
可以透過 DataGrid的 onShowEditor事件來處理, 如下:
function dgDetail_onShowEditor(index, field, editor)
{
if(field == '題目'){ //欄位為'題目'時, 改育 type: 'div'來顯示
return {type: 'div'};
}
else {
return editor; // 使用原來的 Editor
}
}
如何使用 Stored Procedure來查詢自訂的資料, 並傳回到DataGrid中?
* InfoCommand的CommandType如果為StoredProcedure時，前端的DataGrid查詢條件送回後端時會自動與StoredProcedure配合。如果在InfoCommand的Parameters中所設定的參數與前端DataGrid欄位名稱一致時，前端送過來的查詢條件會自動寫入Parameters的Value中，這樣就可以透過StoredProcedure的Input變數進行資料查詢與回傳結果。如下:
1. 設計一個SP，透過MSSQL或是EEPCloud來新增一個SP，並定義好input參數。
2. 原來前端的DataGrid需事先連上一個虛擬或實體的Table，結構與SP要傳會的資料一致。在Server端除了原來的InfoCommand對應到這個虛擬或實體的Table外，還要另外貼一個SP的InfoCommand(CommandType為StoredProcedure)，CommandText輸入SP的名稱，並填好與SP對應的Parameters參數。
3. 前端的DataGrid.RemoteName改成這個SP的InfoCommand即可，這樣User輸入查詢條件就會送往SP這個InfoCommand，InfoCommand因為為SP的Type，所以會自動用欄位對應Parameters參數。
如何動態顯示或隱藏DataGrid的欄位?
舉例如下:
//隱藏
$("#dgMaster").datagrid('hideColumn', '姓名');
//顯示
$("#dgMaster").datagrid('showColumn', '姓名');
如何動態顯示或隱藏 DataGrid的查看/編輯/刪除的按鈕?
在DataGrid的OnBeforeLoad事件添加如下的js
function dgMaster_onBeforeLoad(param)
{
//隱藏
$('#dgMaster').datagrid('options').viewCommandVisible = false;
//如果要顯示將false改為true
//$('#dgMaster').datagrid('options').editCommandVisible = false;
//$('#dgMaster').datagrid('options').deleteCommandVisible = false;
}
如何動態修改DataGrid的欄位Caption?
舉例如下:
//RWD 一般畫面改變欄位title
$("#dgMaster").find('thead>tr>th').each(function () {
if($.parseOptions(this).field == "英文姓名"){
this.innerText = "測試1";
//this.style.color = "red";
//this.style.fontSize = "22px";
}
});
//RWD 手機/平板畫面改變欄位title
$("#dgMaster").find('tbody>tr>td').each(function () {
if ($(this).attr('data-field') == "員工編號") {
$(this).find('.table-cell-label').html("測試2");
//$(this).find('.table-cell-label').css('color',"red");
//$(this).find('.table-cell-label')[0].style.fontSize = "22px";
}
});
請問 DataGrid 的顯示欄位上, 如何放入提示訊息(Title訊息)?
可以使用 Formatter屬性來控制, 如下為使用Title訊息顯示另一個欄位內容:
function dgMaster_請假日期時間_formatter(value, row, index)
{
var data = $.getFormatValue.call(this, value, row, $(this)[0].format); //以原來的Format來顯示
var title = '結束日期時間:'+$.getFormatValue.call(this, row.結束日期時間 , row, $(this)[0].format); // 取得另一個欄位
return '<span title="'+ title +'">' + data + '</span>';
}
如何控制DataGrid Row的背景顏色?
透過DataGrid的RowStytler事件來處理, 如下:

js舉例如下:
function dgMaster_rowStyler(index, row)
{
if(index%2 == 0)
return 'background-color:#FFFFBB;color:black;';
else
return 'background-color:#77FFCC;color:black;';
}
如何讓查詢的Refval欄位做到ColumnMatch的功能?
在QueryColumns的refval欄位屬性Editor裡設定OnSelect事件(雙擊可以直接產生一個function)
js舉例如下:
function dgMaster_客戶編號_onSelect(row)
{
$('#dgMasterqueryObj_名稱').val(row.名稱);
//#dgMasterqueryObj_名稱為另一個查詢欄位的ID
//row.名稱為 refval該筆資料的其他欄位值
}
如果不希望DataGrid的某欄位自動換行，該如何處理?
設定DataGrid->Columns->該欄位的屬性Nowrap設為false即可
如何讓DataGrid結束編輯?
舉例:
在明細DataGrid的Toolitem添加一個按鈕去執行下方的js

function end_Edit()
{
$("#dgDetail").datagrid('endEdit');
}
DataGrid如何取得欄位加總值?
JQ取值方法:
var footer =$('#dgMaster').datagrid('getFooterRows');
alert(footer[0].欄位);
RWD取值方法:
var totalRow = $('#dgMaster').datagrid('getTotal');
alert(totalRow.欄位);
DataGrid的查詢, 我如何更換查詢條件?
可以透過 onQuery事件, 如下:
function dgMaster_onQuery(whereItems)
{
for (i=0;i<whereItems.length;i++)
{
if (whereItems[i].field=='帳戶' && whereItems[i].value=='全部') whereItems[i].value=""; // 如果是全部, 代表查詢為空
}
return true;
}
DataGrid查詢時, 我如何在欄位名稱上加上運算式來查詢?
前端的 onQuery是無法改動欄位名稱或加上運算式的, 所以必須改用後端 InfoCommand的onBeforeExecuteSQL事件來處理, 如下:
exports.股東開會通知書_onBeforeExecuteSQL = function(sql, whereStrs)
{
for (var i = 0; i < whereStrs.length; i++) {
whereStrs[i] = whereStrs[i].replace(/股東戶號/g, "CONVERT(INT,股東戶號)"); //將股東戶號改用INT的模式來查詢
}
return sql;
};
如果DataGrid屬性ShowCheckBox設為True，如何取到所有被勾選資料的某欄位值?
function GetCheck()
{
var rows = $("#dgMaster").datagrid('getChecked'); //取出所有被勾選的資料
for(var i = 0 ;i <rows.length;i++){
alert(rows[i].出貨編號);
}
}
DataGrid編輯時, 是否可以動態改變編輯器的屬性內容?
可以的, 如下使用 onShowEditor事件來處理, 利用editor來存取編輯器的屬性, 下面的例子是動態改變Combobox的欄位與條件:
function dgDetail2_onShowEditor(index, field, editor)
{
if(field == '聯絡人') {
editor.options.valueField = '次序';
editor.options.textField = '姓名';
editor.options.whereItems = [{ field: '客戶編號', operator: '=', value: "parent['客戶編號']"}];
}
return editor;
}
如何在控制DataGrid動態隱藏或顯示每一筆row的(查看/編輯/刪除)按鈕?
可以透過OnLoad事件來處理，如下的方式:
$($('#dgMaster').find('.glyphicon-eye-open')[i]).hide();//查看按鈕
$($('#dgMaster').find('.glyphicon-pencil')[i]).hide();//編輯按鈕
$($('#dgMaster').find('.glyphicon-remove')[i]).hide();//刪除按鈕
// 以上i就是row的序號，從0開始，如要顯示的話將hide()改為show()
如何自行用程式進行DataGrid的新增/更改/刪除功能?
舉例如下:
var index = $('#dgMaster').datagrid('getSelectedIndex');
$('#dgMaster').datagrid('viewRow', index); // 查看
$('#dgMaster').datagrid('delete_row', index); // 刪除
$('#dgMaster').datagrid('edit_row', index); //更改
$('#dgMaster').datagrid('insert_row'); //新增

瀏覽和編輯方法的第二個參數是rowindex，上面'getSelectdIndex是代表選中的row。如果要指定某一筆row可以自行設定index值。
如何自行控制DataGrid的Query視窗所執行的"查詢/清除/取消"等按鈕功能?
在DataGrid的onBeforeLoad事件處理，舉例如下:
改寫DataGrid Query "查詢" 按鈕要做的事:
$('.form-query').unbind('click').bind('click', function () {
//$('#dgMasterqueryObj').form('query'); //原來執行的功能
alert('Query');
});
//改寫DataGrid Query "清除"按鈕要做的事情:
$('.form-clear').unbind('click').bind('click', function () {
// $('#dgMasterqueryObj').form('clear'); //原來執行的功能
alert('Clear');
});
//改寫DataGrid Query "取消"按鈕要做的事情:
$('.form-close').unbind('click').bind('click', function () {
$('#dgMasterqueryObj').form('close'); //原來執行的功能
alert('Close');
});
如何動態改變DataGrid 的標題Title?
舉例如下:
$('#dgMaster').prev().prev()[0].innerText = "你的標題";
如何取得DataGrid的資料總筆數?
可以在DataGrid_OnLoad的時機點取得資料總筆數，如下:
function dgMaster_onLoad(data)
{
alert(data.total);
}
如何隱藏或打開Query查詢的Panel?
$('#dgMasterqueryObj_panel').collapse('hide'); // 隱藏
$('#dgMasterqueryObj_panel').collapse('show'); // 打開
DataGrid打開的查詢頁面過小, 會造成部分查詢欄位折行, 可以加大彈出頁面的寬度嗎?
可以, 統一在"網頁"/"共用樣式表(CSS)"中, 設定以下的CSS內容即可:
@media (min-width: 768px){
.bootstrap-form[id$="queryObj"] .modal-dialog{
width: 700px; // 電腦桌面開啟寬度改為700點
}
如何搭配ShowCheckBox的屬性控制當頁資料全部勾選或者全部取消勾選?
舉例:
function CheckAll()
{
//全部勾選
$(this).datagrid('checkAll');
}
function UnCheckAll()
{
//全部取消勾選
$(this).datagrid('uncheckAll');
}
如何讓user輸入密碼後才允許刪除?
舉例:
請先將DataGrid的ConfirmDelete屬性設為False，再以onDelete的事件處理如下
var delFlag = false;
function dgMaster_onDelete(row)
{
var delPassword='';
if (!delFlag) {
$.prompt( "請輸入管理者刪除密碼: ?","" , function(DelPassword) {
if (DelPassword =='123'){ //為了保密, 這段最好寫在後端
var index = $('#dgMaster').datagrid('getSelectedIndex');
delFlag = true;
$('#dgMaster').datagrid('delete_row', index);
}
else {
$.alert('密碼不正確, 取消刪除','info');
delFlag = false;
}
});
}
return delFlag;
}
DataGrid的QueryColumns如何抓到指定日期的30天後?
舉例:
在QueryColumns欄位中的onSelect事件
function dgMaster_訂單日期_onSelect(date)
{
var date = $('[name="dgMasterqueryObj_3"]').datebox('getValue');
var addDate = addDays(date,30);
$('[name="dgMasterqueryObj_4"]').datebox('setValue',addDate);

}
dgMasterqueryObj_3和dgMasterqueryObj_4為訂單日期起迄欄位的name
如果datagrid屬性autoApply設為false，那該如何針對Datagrid做存檔的動作?
在DataGrid的Toolitem添加一個按鈕去執行下方的js
function dg_submit()
{
$('#dgMaster').datagrid('endEdit');//結束編輯
$('#dgMaster').datagrid('submit');//存檔
}
DataGrid的QueryColumns使用時間欄位作為起迄時間查詢時，如何透過起始日期的值，自動給值至結束的日期欄位?
在QueryColumns的日期onSelect事件中,添加以下代碼
function dgMaster_日期_onSelect(date)
{
var date = $(‘[name=”dgMasterqueryObj_3”]’).datebox(‘getValue’);
var addDate =addDays(date,30); //將結束日期欄位設為抓取起始欄位後30天
$(‘[name=”dgMasterqueryObj_4”]’).datebox(‘setValue’,addDate);
}
dgMasterqueryObj_3和dgMasterqueryObj_4為日期起迄欄位的name
DataGrid編輯中, 如何透過Refval選不同的ID, 來控制其他欄位是否可以編輯?
可以透過 Refval的 onSelect事件來控制, 如下:
function dgDetail_科目編號_onSelect(row)
{
if (row.性質控制!='是') { // 判斷條件
$(this).closest('tr').find('td[data-field="性質別"]').find('.form-control').setReadonly(true); // 將性質別設為Readonly
}
else {
$(this).closest('tr').find('td[data-field="性質別"]').find('.form-control').setReadonly(false); // 將性質別設為可編輯
}
}
如何在 dataGrid中, 動態控制另一個Refval的資料來源與WhereItem內容?
假設有當某一個Refval更改時, 觸發了onSelect事件, 透過這個事件, 來控制另一個 Refval的RemoteName與WhereItem, 如下:
function dgDetail_科目編號_onSelect(row)
{
var editor=$(this).closest('tr').find('td[data-field="子科目"]').find('.form-control'); //取得子科目的Refval對象
if (row.對象別=='子科目') { // 動態設定 refval的資料來源
editor.refval('options').remoteName='會計科目.會計子科目';
editor.refval('options').whereItems = [{field:'科目編號', operator: '=', value: "row['科目編號']"}]; // 動態設定WhereItem
}
else if (row.對象別=='客戶') { // 動態設定 refval的資料來源
editor.refval('options').remoteName='客戶資料表.客戶子科目';
editor.refval('options').whereItems = [];
}
else if (row.對象別=='廠商') { // 動態設定 refval的資料來源
editor.refval('options').remoteName='廠商資料表.廠商子科目';
editor.refval('options').whereItems = [];
}
}
請問Server Method會處理比較久, 如何頁面上告知'處理中'的訊息?
可以透過 $.loading() 來處理, 如下:
$.loading($('#dgMaster').closest('div'), '處理中...'); // 顯示進度訊息
$.callMethod('員工資料表','doCloseSalary',{yymm:row.年月,co:row.子公司,id:row.員工編號},function(result){ // 執行後端檢查方法
$.loaded($('#dgMaster').closest('div')) //關閉訊息框
$.alert('員工:'+row.員工編號+' 薪資結算成功!','info');
$('#dgMaster').datagrid('load');
});
如何在 DataGrid的QueryColumns中固定增加一個欄位?
有兩個方法, 一個寫在前端 DataGrid.onQuery() 事件, 如下:
whereItems.push({field:'子科目',operator: '!=',value: ''});
return true;
}
另一個方法寫在後端的 Command.onBeforeExecuteSQL事件中, 如下:
exports.明細分類帳_onBeforeExecuteSQL = function(sql, whereStrs)
{
whereStrs.push("子科目<>''");
return sql;
};
如果我想在DataGrid的編輯要帶入初值, 而不是新增時帶入, 要如何處理?
可以使用DataGrid的onUpdate事件來處理, 以下為上一筆欄位的內容值, 帶入下一筆的方法:
function dgDetail_摘要_onBlur()
{
var rem = $('#dgDetail').datagrid('getEditorValue', '摘要');
$.setVariableValue('remark',rem,true); // 設定全域變數 remark
}

function dgDetail_onUpdate(row)
{
if (row.摘要.length==0) row.摘要 = $.getVariableValue('remark');
return true;
}
如何利用ToolItem對datagrid的資料進行過濾?
可以在ToolItem添加一個按鈕，onClick時呼叫一個function，參考如下:
function test(){
$('#dgMaster').datagrid('setWhere',"您的Where條件'");
// dgMaster為datagrid id
}
為何我資料庫欄位前面故意有空格, 但到了DataGrid卻不見了?
因為空格在網頁中是無法顯示的, 要使用HTML的格式才會顯示, 可以加入 formatter 事件來處理:
function dgMaster_科目名稱_formatter(value, row, index)
{
return (value || '').replace(/\s/g, ' ');
}
如何默認選取Datagrid指定的第幾筆資料?
function select_first()
{
var index = 0;
$('#dgMaster').find("tbody>tr:eq("+index+")").addClass('selected').addClass('info');
//$('#dgMaster').find("tbody").find("tr:eq("+index+")").addClass('selected').addClass('info');
}
Datagrid如何依照有勾選的資料進行欄位加總值的計算?
$(function (){
//第一次進入畫面先將total歸0
setTimeout(function (){
$("#dgMaster").find('tfoot>tr>td').each(function () {
if ($(this).attr('data-field') == "小計") {
$(this).find('.table-cell-text').html(0);
}
});
},100);
//添加onclick事件
$('#dgMaster').click(function(){
var Total = 0;
var sumTotal = 0;
var rows = $("#dgMaster").datagrid('getChecked'); //取出所有被勾選的資料
if (rows.length > 0){
for(var i = 0 ;i <rows.length;i++){
Total=(parseInt(rows[i].小計));
sumTotal += Total;
}
}
$("#dgMaster").find('tfoot>tr>td').each(function () {
if ($(this).attr('data-field') == "小計") {
$(this).find('.table-cell-text').html(sumTotal);
}
});
});
});