1
我正在使用帶有自定義排序功能的YUI DataTable去除HTML代碼,僅基於文本內容進行排序,而不是使用HTML標記整個字符串進行排序。我遇到的問題是我需要在三個不同的列上使用這種排序功能,而且我似乎無法將「字段」值傳遞給我的排序函數。我想使用「字段」而不是命名列 - 因爲我想對所有三列使用相同的排序函數,而不是像我在下面的代碼中那樣重複三次。當我通過「字段」排序停滯或掛在瀏覽器和「字段」似乎是「未定義」。有任何想法嗎?YUI DataTable自定義排序功能問題
YAHOO.util.Event.addListener(window, "load", function() {
var sortProject = function(a, b, desc) {
var col = "project";
// Deal with empty values
if(!YAHOO.lang.isValue(a)) {
return (!YAHOO.lang.isValue(b)) ? 0 : 1;
}
else if(!YAHOO.lang.isValue(b)) {
return -1;
}
var comp = YAHOO.util.Sort.compare;
var tagregex = /<[^>]*>/g;
var aString = a.getData(col).replace(tagregex, "");
var bString = b.getData(col).replace(tagregex, "");
var compString = comp(aString, bString, desc);
return compString;
};
var sortArchitect = function(a, b, desc) {
var col = "architect"
// Deal with empty values
if(!YAHOO.lang.isValue(a)) {
return (!YAHOO.lang.isValue(b)) ? 0 : 1;
}
else if(!YAHOO.lang.isValue(b)) {
return -1;
}
var comp = YAHOO.util.Sort.compare;
var tagregex = /<[^>]*>/g;
var aString = a.getData(col).replace(tagregex, "");
var bString = b.getData(col).replace(tagregex, "");
var compString = comp(aString, bString, desc);
return compString;
};
var sortStatus = function(a, b, desc) {
var col = "status"
// Deal with empty values
if(!YAHOO.lang.isValue(a)) {
return (!YAHOO.lang.isValue(b)) ? 0 : 1;
}
else if(!YAHOO.lang.isValue(b)) {
return -1;
}
var comp = YAHOO.util.Sort.compare;
var tagregex = /<[^>]*>/g;
var aString = a.getData(col).replace(tagregex, "");
var bString = b.getData(col).replace(tagregex, "");
var compString = comp(aString, bString, desc);
return compString;
};
var myColumnDefs = [
{key:"design",label:"<span class='dtTitleText'>Design</span>", width:105, formatter:YAHOO.widget.DataTable.formatDate, sortable:true},
{key:"status",label:"<span class='dtTitleText'>Status</span> <sup>1</sup>", sortable:true, width:62, sortOptions:{sortFunction:sortStatus}},
{key:"project",label:"<span class='dtTitleText'>Project Name</span>", sortable:true, width:105, sortOptions:{sortFunction:sortProject}},
{key:"address",label:"<span class='dtTitleTextNoSort'>Address</span>", width:80, sortable:false},
{key:"city",label:"<span class='dtTitleText'>City</span>", width:80, sortable:true},
{key:"state",label:"<span class='dtTitleText'>State</span>", width:45, sortable:true},
{key:"type",label:"<span class='dtTitleText'>Building <br />Type</span>", width:75, sortable:true},
{key:"feet",label:"<span class='dtTitleText'>Gross <br />Sq. Ft.</span>", width:55, formatter:YAHOO.widget.DataTable.formatNumber,sortable:true},
{key:"owner",label:"<span class='dtTitleText'>Building <br />Owner</span>", width:95, sortable:true},
{key:"architect",label:"<span class='dtTitleText'>Architect of <br />Record (AOR)</span>", width:115, sortable:true, sortOptions:{sortFunction:sortArchitect}}
];
var myDataSource = new YAHOO.util.DataSource(YAHOO.util.Dom.get("storableTable"));
myDataSource.responseType = YAHOO.util.DataSource.TYPE_HTMLTABLE;
myDataSource.responseSchema = {
fields: [{key:"design", parser:"number"},
{key:"status"},
{key:"project"},
{key:"address"},
{key:"city"},
{key:"state"},
{key:"type"},
{key:"feet", parser:"number"},
{key:"owner"},
{key:"architect"}
]
};
var myDataTable = new YAHOO.widget.DataTable("progEnhanceTable", myColumnDefs, myDataSource,
{sortedBy:{key:"design",dir:"desc"}, renderLoopSize: 50}
);
return {
oDS: myDataSource,
oDT: myDataTable
}; });
Gavin, 非常感謝您回答我的問題。您的解決方案完美運作。正是我所希望的!這對我來說是一次學習經歷。謝謝! – Matt 2010-05-21 12:31:34