JqGrid国際化---エッセイ
JqGrid国際プラグイン
jqgrid国際化プラグイン:https://download.csdn.net/download/qq_39668819/12350915 demoダウンロードアドレス:https://download.csdn.net/download/qq_39668819/12351487
異なる国際語プラグインを動的に搭載することで、JqGrid言語の切り替えを実現します.
言語切り替えツール類:common.js
index.
jqgrid国際化プラグイン:https://download.csdn.net/download/qq_39668819/12350915 demoダウンロードアドレス:https://download.csdn.net/download/qq_39668819/12351487
異なる国際語プラグインを動的に搭載することで、JqGrid言語の切り替えを実現します.
言語切り替えツール類:common.js
/**
* JqGrid
* @param language
* @param path
*/
function switchJqGridLanguage(language, index) {
if(isBlank(language)){
language = localStorage.getItem("language");
}
if(language == 'zh_CN'){
$("#en_US").attr('src', 'about:blank');
$("#en_US").remove();
if(parseInt(index) > 0){
lastLoadJsFileIndex('/JqGridDemo/plug-in/jqgrid/js/i18n/grid.locale-cn.js', language, index);
}else{
lastLoadJsFileId('/JqGridDemo/plug-in/jqgrid/js/i18n/grid.locale-cn.js', language);
}
}else{
$("#zh_CN").attr('src', 'about:blank');
$("#zh_CN").remove();
if(parseInt(index) > 0){
lastLoadJsFileIndex('/JqGridDemo/plug-in/jqgrid/js/i18n/grid.locale-en.js', language, index);
}else{
lastLoadJsFileId('/JqGridDemo/plug-in/jqgrid/js/i18n/grid.locale-en.js', language);
}
}
}
/**
* JS ,
* @param path
* @param id id
* @param index , 0 ，1 ，
*/
function lastLoadJsFileIndex(path, id, index) {
var randomh = Math.random();
var arr = document.getElementsByTagName("script");
if(isBlank(index)){
index = 0;
}
var e = arr[arr.length - (1+index)];
var d = generateJsNode(randomh, path, id);
insertAfterTime(d, e, 100)
};
function lastLoadJsFileId(path, id) {
var randomh = Math.random();
var arr = document.getElementsByTagName("script");
var e = arr[arr.length - 1];
var d = generateJsNode(randomh, path, id);
insertAfter(d, e)
};
function lastLoadJsFile(path) {
var randomh = Math.random();
var arr = document.getElementsByTagName("script");
var e = arr[arr.length - 1];
var d = generateJsNode(randomh, path, null);
insertAfter(d, e)
};
/**
* javaScript
* @param randomh
* @param path
* @param id
* @returns {HTMLElement}
*/
function generateJsNode(randomh, path, id) {
var d = document.createElement("script");
if(!isBlank(id)){
d.id = id;
}
d.src = path + "?x=" + randomh + "";
d.type = "text/javascript";
d.async = true;
d.defer = true;
return d;
}
/**
* ,
* @param newElement
* @param targetElement
*/
function insertAfterTime(newElement, targetElement, time){
var parent = targetElement.parentNode;
if(parent.lastChild == targetElement){
parent.appendChild(newElement);
}else{
parent.insertBefore(newElement,targetElement.nextSibling);
}
setTimeout(function () {
window.location.reload();
}, time);
}
/**
*
* @param newElement
* @param targetElement
*/
function insertAfter(newElement, targetElement){
var parent = targetElement.parentNode;
if(parent.lastChild == targetElement){
parent.appendChild(newElement);
}else{
parent.insertBefore(newElement,targetElement.nextSibling);
}
}
/**
*
* @param value
* @returns true: false:
*/
function isBlank(value) {
return !value || !/\S/.test(value)
}
index.
"cn">
"Content-Type" content="text/html; charset=UTF-8">
"stylesheet" href="plug-in/jqgrid/css/ui.jqgrid.css" />
"stylesheet" href="plug-in/bootstrap/bootstrap.min.css"/>
"stylesheet" href="plug-in/jqgrid/css/css/redmond/jquery-ui-1.8.16.custom.css" />
"text/javascript"</span> src=<span class="token string">"js/jquery.min.js"</span>>
"text/javascript"</span> src=<span class="token string">"plug-in/bootstrap/bootstrap.min.js"</span>>
"text/javascript"</span> src=<span class="token string">"plug-in/jqgrid/js/jquery.jqGrid.src.js"</span>>
demo
"text/javascript"</span> src=<span class="token string">"js/common.js"</span>>
"text/javascript"</span> src=<span class="token string">"js/index.js"</span>>
"layui-nav larry-header-item">
- "presentation" class="dropdown layui-nav-item">
「dropdown-toggle」data-toggle=「dropdown」href=「 」role=「button」ara-haspopup=「true」ara-expaded=「false」
「laguage itle」
「caret」
"dropdown-menu language">
- "zh_CN_lang" class="lang-item lan_zh">
- "en_US_lang" class="lang-item lan_en" style="border-bottom: none;">English
jqGrid 。 api， http://blog.mn886.net/jqGrid
index.js
$(function(){
var lang = localStorage.getItem("language");
if(isBlank(lang)){
lang = "zh_CN";
}
$(".lang-item").removeClass("lang-active");
$("#"+lang+"_lang").addClass("lang-active");
switchJqGridLanguage(null, 0);
$(".lang-item").click(function () {
var val = $(this).html();
if (val === " " || val === "English") {
LANGUAGE_Index = "en_US";
} else {
LANGUAGE_Index = "zh_CN";
}
$(".lang-item").removeClass("lang-active");
localStorage.setItem("language", LANGUAGE_Index);
$("#"+LANGUAGE_Index+"_lang").addClass("lang-active");
switchJqGridLanguage(LANGUAGE_Index, 1);
});
// jqgrid
setTimeout(function () {
pageInit(lang);
}, 500);
});
function pageInit(lang){
var colNames = [];
var caption = "";
if(lang == 'zh_CN'){
colNames = [ ' ',' ',' ',' ',' ',' ',' ' ];
caption = " ";
}else if(lang == 'en_US'){
colNames = [ 'Inv No', 'Date', 'Client', 'Amount', 'Tax','Total', 'Notes' ];
caption = "TEST Example";
}
// jqGrid
$("#list").jqGrid(
{
url : 'data/JSONData.json',// url
datatype : "json",// 。 json,xml,txt
colNames : colNames,//jqGrid
colModel : [ //jqGrid 。 ， ， , .....
{name : 'id',index : 'id',width : 55},
{name : 'invdate',index : 'invdate',width : 90},
{name : 'name',index : 'name asc, invdate',width : 100},
{name : 'amount',index : 'amount',width : 80,align : "right"},
{name : 'tax',index : 'tax',width : 80,align : "right"},
{name : 'total',index : 'total',width : 80,align : "right"},
{name : 'note',index : 'note',width : 150,sortable : false}
],
rowNum : 10,//
rowList : [ 10, 20, 30 ],//
pager : '#pager',// ( div) id
sortname : 'id',//
sortorder : "desc",// , desc,asc
mtype : "post",// ajax 。 post,get
viewrecords : true,
caption : caption//
});
/* jqGrid */
/* */
$("#list").jqGrid('navGrid', '#pager2', {edit : false,add : false,del : false});
}