**چند مثال ساده**
در این بخش چند تا مثال ساده از نحوه تغییر عملکرد فیلد ها خواهیم زد و با موارد جدیدی در قالب مثال آشنا خواهیم شد.
**دریافت مقدار فیلد:**
در بخش های قبل یک مثال برای دریافت مقدار زدیم اما روش های دیگری برای دریافت مقدار فیلد وجود دارد:
```js
// (توصیه میشود) روش اول
viewModel.data().MyField();
// روش دوم
viewModel.fields.MyField_Instance.option('value');
// روش سوم
viewModel.fields.MyFieldConfig.value();
```
- تمامی این متد ها از نوع Observable هستند و همانطور که قبلا اشاره شد در صورتی که مقدار پاس ندهید، مقدار Observable برگشت داده میشود و در صورتی که مقدار پاس دهید مقدار آن تغییر خواهد کرد.
**تنظیم مقدار فیلد:**
```js
// (توصیه میشود) روش اول
viewModel.data().MyField('MyNewValue');
// روش دوم
viewModel.fields.MyField_Instance.option('value', 'MyNewValue');
// روش سوم
viewModel.fields.MyFieldConfig.value('MyNewValue');
```
**دریافت وضعیت نمایش فیلد:**
```js
// روش اول
viewModel.fields.MyFieldConfig.visible();// false or true
// روش دوم
viewModel.fields.DateField_Visibility();// false or true
```
**تنظیم وضعیت نمایش فیلد:**
```js
// روش اول
viewModel.fields.MyFieldConfig.visible(true /*or false*/);
// روش دوم
viewModel.fields.DateField_Visibility(true /*or false*/);
```
**دریافت وضعیت فقط خواندنی بودن فیلد:**
```js
// روش اول
viewModel.fields.MyFieldConfig.readOnly();// false or true
// روش دوم
viewModel.fields.MyField_ReadOnly();// false or true
```
**تنظیم وضعیت اجباری بودن فیلد:**
```js
viewModel.fields.MyFieldConfig.isRequired(true /*or false*/);
```
**تنظیم placeholder فیلد:**
```js
viewModel.fields.MyField_Instance.option('placeholder', 'My placeholder');
```
- به طور کلی، وقتی که از حالت \_Instance در کد استفاده میشود به این معنی است که کد شما مستقیما به Instance فیلد مربوطه متصل شده است. تمامی Instance فیلد های Devextreme دارای یک متد به اسم option هستند، این متد دو پارامتر میگیرد که هردوی آنها اختیاری هستند.
- در صورتی که هیچ پارامتری به این متد پاس ندهید، تمامی option های بایند شده به اینن کامپوننت را در قالب یک Object دریافت خواهید کرد.
- در صورتی که پارامتر اول را به این متد پاس بدهید، این پارامتر نام آپشن خواهد بود و مقدار آن به شما برگشت داده خواهد شد.
- در صورتی که هردو پارامتر را به این متد پاس دهید، پارامتر اولی نام آپشن و پارامتر دومی مقدار جدید آن آپشن خواهد بود. (مثال بالا)
**تنظیم مقدار hint:**
```js
viewModel.fields.MyField_Instance.option('hint', 'My hint');
```
**تنظیم مقدار کمینه و بیشینه فیلد عددی:**
```js
viewModel.fields.MyNumberField_Instance.option('min', 10);
viewModel.fields.MyNumberField_Instance.option('max', 100);
```
در مثال بالا، عددی که کاربر وارد میکند باید بین 10 تا 100 باشد و در غیر اینصورت با خطای اعتبارسنجی مواجه خواهد شد.
- این مثال فقط برای فیلد عددی است.
**تشخیص focus کردن روی فیلد:**
```js
viewModel.fields.MyField_Instance.on('focusIn',() => {
alert('Do something');
});
```
**تشخیص خارج شدن از حالت focus:**
```js
viewModel.fields.MyField_Instance.on('focusOut',() => {
alert('Do something');
});
```
**تشخیص تغییر مقدار فیلد:**
```js
viewModel.fields.MyField_Instance.on('valueChanged',() => {
alert('Do something');
});
```
**تشخیص paste کردن روی فیلد:**
```js
viewModel.fields.MyField_Instance.on('paste',() => {
alert('Do something');
});
```
**تشخیص key up روی فیلد:**
```js
viewModel.fields.MyField_Instance.on('keyUp',() => {
alert('Do something');
});
```
لطفا توجه داشته باشید که این موارد فقط چند مثال هستند و امکانات سامانه به این موارد محدود نمیشود.
جهت آشنایی با موارد بیشتر که مستنداتی که در بخش قبل به آن اشاره شد مراجعه کنید.