一、Grid
1.在Grid中支持分頁刷新:
scrollable: {virtual : true },
2.在Grid的DataSource中添加分頁支持:
serverPaging: true,
serverSorting: true,
serverFiltering: true,
pageSize: 50,
3.在grid中顯示列(顯示/隱藏菜單)與過濾支持菜單
filterable: true,
columnMenu: true,
4.在Grid中隱藏某個指定的列,需要在columns中指定column下面添加:
hidden:true,
5.使用模板來格式化顯示grid中的列數據,給對應列添加模板的代碼如下:
template : "#=(value==-1) ? '-' :formatValue(value)#"
6.對齊顯示grid中列文本的代碼如下:
attributes:{ style: "text-align: right"}
7.綁定一個Kendo datasource到kendo.observable對象:
var formVM = kendo.observable({
sources: formDS,
source: null
});
8.綁定指定的formVM到某個Div元素:
kendo.bind($("#form_div"),formVM);
9.在頁面數據改變時,更新綁定的數據源(DataSource):
formDS.bind("change", function() {
//binds the view-model to the first entryin the datasource
formVM.set("source", this.view()[0]);
});
10.同步Grid數據更新,使用如下代碼:
grid.dataSource.sync()
或者
myGrid.dataSource.read();
myGrid.refresh();
11.下載grid中選中的所有文件:
var grid = $("#file_grid").data("kendoGrid");
var tr = grid.select(); //gets selected <tr> element
if(tr.length >= 1) {
for(var i=0; i<tr.length;i++) {
var item =grid.dataItem(tr[i]); //gets the dataSourceitem
var fid = item.id;
makeFrame("file/"+ fid +"/fileContent.htm");
}
}
function makeFrame( url )
{
var ifrm = document.createElement( "IFRAME");
ifrm.setAttribute( "style", "display:none;") ;
ifrm.setAttribute( "src", url ) ;
ifrm.style.width = 0+"px";
ifrm.style.height = 0+"px";
document.body.appendChild( ifrm ) ;
}
二、其他
1.強制更新form_div中的值:
formVM.set("source.userName", 'gloomyfish');對應的HTML為
<input id="uname"name="uname" data-bind="value: source.userName"/>
啟動一個新的瀏覽器新窗口代碼如下:
var left = (screen.width/2)-(800/2);
var top = 0;//(screen.height/2)-(800/2);
// force to open new widows in chrome,IE, FF
window.open("personInfo.html","_blank","resizable=yes, scrollbars=yes,titlebar=yes, width=800, height=800, top="+ top +", left="+ left);
通過window.location或者window.location.href打開指定URL
一個Ajax請求跳轉頁面的例子:
$.ajax({
url : "openMyInfo",
type : "POST",
data : {userName: name, userId:id },
success : function(jqXHR, textStatus) {
if (jqXHR.jsonResponse.success) {
var url = jqXHR.jsonResponse.message;
window.location=url;
} else {
alert(jqXHR.jsonResponse.message);
}
},
error : function(jqXHR, textStatus, errorThrown) {
alert (errorThrown);
}
});
2.Kendo UI dropdown list級聯菜單刷新:
在父dropdown list上綁定change事件函數:change : onItemChange
在函數中刷新更新子dropdow list的數據源(data source)
var subDDList = $('#subListDiv').data("kendoDropDownList");
subDDList.setDataSource(buildSubList(selectParentId));
3.上傳文件對話框使用
$("#selectedFiles").kendoUpload({
async: {
saveUrl: "myDomain/fileUpload.htm",
autoUpload: true
},
multiple:true, // 支持多個文件上傳,
complete: uploadFileComplete, //上傳結束以后處理,
error: onError,
cancel: onCancel,
select: onSelect,
success: onSuccess
});
調用代碼 $("# selectedFiles ").click();//模擬鼠標雙擊事件調用,
頁面上selectedFileshtml元素為隱藏對象。
4.禁用IE緩存,在JQuery1.2以上版本支持:
$.ajax({
type:"GET",
url:"static/cache.js",
dataType:"text",
cache:false, // disable cache(禁用IE緩存)
ifModified:true
});
在HTML文件中加上:
<meta http-equiv="Expires"content="0"/>
<meta http-equiv="Cache-Control"content="no-cache"/>
<meta http-equiv="Pragma"content="no-cache"/>
5.提交數據之后打開在新窗口:
<form action="getMyInfo.htm"method="post" target="_blank">
6.獲取Servlet的真實路徑:
request.getSession().getServletContext().getRealPath("/");
實現路徑重定向:
((HttpServletResponse)response).sendRedirect(redirectURL);
7.JS中替換反斜線正則表達式:
var myString = content.replace(/\//g, "\\\\");
或者:var value = value.replace(/\\/g, "whatever");
8.JQuery中報UncaughtSyntaxError: Unexpected identifier
原因多數是你在前一行少加了分號,或者使用了不恰當的關鍵字標識,比如
setTimeout(new function(){alert(“Helloworld”);}, 200);
其中new是多余關鍵字,導致錯誤。
9.隱藏頁面上DIV內容:
$(my_div_id).css("display","none");
顯示它:
$(my_div_id).css("display","");
10.純JavaScript方式實現,永遠有效的隱藏一個DIV內容的方法:
document.getElementById('myDivID').style.display = 'none';
顯示它:
document.getElementById('myDivID').style.display = '';