ExtJS 4 2 教程 04 資料模型

在上一節中，我們使用ext.define 來自定義類，通過ext.define 定義的類都預設繼承自ext.base 類。如果我們將extend 設定為ext.data.model，那麼定義的類就是乙個資料模型類了。先定義乙個簡單的資料模型類 user類，**如下：

ext.define(
, , ,
]});

在**中可以看出，資料模型類其實就是乙個繼承自ext.data.model 的類。

fields 屬性中定義了該模型的字段，它可以是對應到資料庫中的字段。在使用的時候，資料模型包含的字段和類的屬性使用方式不太相同。要訪問欄位的值，需要視同get 和 set 方法，例如：

var 
tom = ext.create(
, );
tom.set(
'age'
, 20);
ext.messagebox.alert(
'提示'
, tom.get(
'age'
));

我們例項化user類，初始化的時候，age的值為26，然後通過set 方法設定為 20，再通過get 方法得到 age 欄位的值，執行截圖如下：

在定義資料模型的時候，我們可以定義欄位的型別和該型別的轉換器。例如，我們將為user類新增birthday欄位，在初始化的時候，我們可能會傳入乙個字串型別的日期格式，這個時侯就需要我們來定義乙個型別轉換器，將字串格式的日期轉換為date型別。**如下：

ext.define(
, , ,,}
}]
});

在**中新增了birthday欄位，並為該字段設定了轉換器，當傳入的型別為string時，將會被轉換為標準的時間型別。用法如下：

var 
tom = ext.create(
, );
alert(tom.get(
'birthday'
));

在使用的時候，傳入的是乙個字串型別的時間，當我們例項化以後，字串日期被轉換為標準的時間型別：

我們可以使用資料模型來驗證資料是否正確。在上面的例子中，我們希望phone 欄位的長度在8和15之間，那麼，我們需要這樣修改**：

ext.define(
, , ,,}
}],
validations: [
]});

為phone 字段新增驗證，驗證型別為length，最小為8，最大為15，驗證的**如下：

var 
tom = ext.create(
, );
var 
errors = tom.validate();
var 
errormsg = ;
if (!errors.isvalid()) );
ext.msg.alert(
"錯誤"
, errormsg.join(''
));}

我們將phone的長度設定為6位，很明顯是不能通過驗證的。程式執行起來以後，我們會得到下面的錯誤：

儘管我們已經引入了漢化包，但這裡的提示還是英文的，為了能讓他顯示為中文，我們需要手動的來將其漢化，在程式開始的時候加入**：

ext.data.validations.lengthmessage = 
"長度錯誤"
;

重新整理我們的頁面，錯誤提示已經變成中文了：

由此可以看出，extjs 的驗證錯誤提示是沒有進行漢化的，我們可以將相應的漢化**寫在layout中，方便所有頁面都能夠使用。

extjs 中雖然內建了一些驗證規則，但這些規則面對龐大的業務需求肯定是不夠的，所以extjs 還允許我們自定義驗證規則。

在user類中，我們希望age欄位的值在0到150之間，我們來自定義乙個驗證規則：

agemessage:

'必須在0到150之間'

, age:

function

(config, value)

if (value < 0 || value > 150)

return true

; }

});

接下來我們修改驗證部分的**，新增age驗證：

validations: [,]

在初始化的時候，我們將age的值設定為-26，執行程式，截圖如下：

（本段內容翻譯自官方api）

ext.define(
'post'
, });
ext.define(
'comment'
, );
ext.define(
'user'
, ]
});

ext.define(
'user'
, , 
]});