2007年5月29日

jEditable 小修改

一樣是 網頁上的就地編輯 (Edit in place) 功能 中提到的情形,jEditable 的 select 編輯模式不會由自行讀取原本頁面上的文字內容當成預設的選項。

這個問題最終只能自行修改 jeditable.js 檔內產生 select 物件時的建置程序,也就是 function setInputContent(str) 這段源碼。

簡單說明修改的方向:

  1. 確定傳入的選項中未包含預設值設定
  2. 逐一比較傳入選項中與原文字資料是否相同,當兩者相同時將該選項的 selected 設定 true 後結束相關程序。
function setInputContent(str) {

if (jQuery.isFunction(str)) { var str = str.apply(self, [self.revert, settings]); } switch (settings.type) { case 'select':

// check if a key selected, Added by Ada. var keySelected = false; // ***********************

if (String == str.constructor) { eval ("var json = " + str);

for (var key in json) { if ('selected' == key) { // if assigned a selected key, change keySelected to true, Added by Ada. keySelected = true; // **************

continue; } o = document.createElement('option'); o.value = key; var text = document.createTextNode(json[key]); o.appendChild(text) if (key == json['selected']) { o.selected = true; } i.appendChild(o); } }

// if no any key selected, try to make self.revert to selected, Added by Ada. if( ! keySelected ) { for( pt = 0; pt < i.options.length; pt++ ) { if( i.options[pt].value == self.revert ) { i.options[pt].selected = true; break; } } } // **************************

break; default: i.value = str; break; } }

如果不願自行修改的話,可以下載已修改過的 jquery.jeditable.js,不過如果其他功能有異常的話請自行修正處理,此處無法保證相關功能皆能正確運作!