TextArea
Kullanıcının çok satırlı, uzun metin girebileceği nesnedir. Açıklama, not, gerekçe ya da serbest metin gibi bir satıra sığmayan alanlar için kullanılır.
Değer tipi: string
Ne zaman kullanılır?
Birden fazla satıra yayılan uzun metinler için idealdir: açıklama, gerekçe, not, talep detayı. Tek satırlık kısa metinlerde TextBox, belirli bir biçim gereken alanlarda MaskInput daha uygundur.
Tasarımcı özellikleri
Bir TextArea seçildiğinde Özellik Görüntüleyici sekmelere ayrılır.
General
| Özellik | Açıklama |
|---|---|
Name | Nesnenin koddaki adı (ör. TextArea1). Koddan bu adla erişirsiniz. |
Field Name | Veritabanındaki alanın adı. |
Size | Alanın veritabanındaki uzunluğu. Uzun metinlerde bu değeri yeterince büyük tutun. |
Label
Nesnenin yanındaki etiketi yönetir.
| Özellik | Açıklama |
|---|---|
Caption / Text | Etiketin yazısı (çok dilli olabilir). |
Position | Etiketin yeri: solda (Left) veya üstte (Top). |
Width / Height | Etiketin boyutu. |
Font | Yazı tipi, kalın / italik / altı çizili. |
Show Colon | Etiketin sonuna iki nokta (:) ekler. |
Horizontal Align / Vertical Align | Etiketin hizası. |
Visible | Etiketi gösterir veya gizler. |
Behavior
| Özellik | Açıklama |
|---|---|
ReadOnly | Alanı salt okunur yapar. |
Required | Alanı zorunlu yapar; boşsa form kaydedilmez. |
MaxLength | En fazla kaç karakter girilebileceğini sınırlar. |
Rows | Alanın kaç satır yüksekliğinde görüneceğini belirler. TextArea'yı TextBox'tan ayıran özelliktir. |
Tab Index | Tab tuşuyla geçiş sırasını belirler. |
Is Secret Data | Değeri hassas veri sayar; loglarda gizlenir. |
Enable MultiLanguage Text | Çok dilli değer girişini açar. |
Appearance
| Özellik | Açıklama |
|---|---|
Visible / Client Visible | Nesnenin görünürlüğü. |
Enabled / Client Enabled | Nesnenin aktif olup olmadığı. |
Placeholder | Alan boşken görünen soluk ipucu yazısı. |
Text Align | Yazının hizası. |
Title | Fareyle üzerine gelince çıkan ipucu (tooltip). |
Show Character Counter | Karakter sayacını gösterir. Uzun metin alanlarında kullanıcıya kalan karakteri gösterir. |
Olaylar
Bir nesne açılırken olaylar belirli bir sırayla tetiklenir; kullanıcı alana dokununca da ayrı olaylar çalışır. Doğru kodu doğru olaya yazmak için bu sırayı bilmek işinizi kolaylaştırır.
Açılış sırası: OnInit → OnLoad → OnDataLoad → OnPreRender → OnRender
Kullanıcı yazarken: OnTextChanging → OnTextChanged, alandan çıkınca OnValueChanging → OnValueChanged
Olaylar iki tarafta çalışabilir: sunucu olayları C# kodunda, istemci olayları tarayıcıdaki TypeScript kodunda. TextArea'nın iki tarafta sunduğu olaylar farklıdır.
Sunucu olayları (Server)
| Olay | Ne zaman çalışır |
|---|---|
OnInit | Form açılırken nesne oluşturulduğunda, en başta. |
OnLoad | OnInit'in hemen ardından, nesne yüklenince. |
OnRender | Nesne ekrana çizilirken. |
OnTextChanging | Kullanıcı yazarken, metin değişmeden hemen önce. |
OnTextChanged | Metin değiştikten hemen sonra. |
OnValueChanging | Değer değişmeden hemen önce (iptal edilebilir). |
OnValueChanged | Kullanıcı alandan çıkıp değer kesinleştiğinde. En sık kullanılan olaydır. |
OnValidating | Alan doğrulanırken çalışır; geçerlilik kontrolü buraya yazılır. |
OnMultiLanguageTextChanging / OnMultiLanguageTextChanged | Çok dilli metin değişmeden önce / sonra. |
İstemci olayları (Client)
Sunucudaki olaylara ek olarak tarayıcı tarafında şunlar da vardır:
| Olay | Ne zaman çalışır |
|---|---|
OnDataLoad | Nesnenin verisi yüklendiğinde. |
OnPreRender | Nesne ekrana çizilmeden hemen önce. |
OnClick / OnDoubleClick | Nesneye tıklanınca / çift tıklanınca. |
OnPropertyChanging / OnPropertyChanged | Bir özellik kodla değiştirilmeden önce / sonra. |
OnValueChanging / OnTextChanging olaylarının parametresi (args TS, e C#) şunları taşır:
newValue/NewValue— girilmek istenen yeni değeroldValue/OldValue— önceki değercancel/Cancel—trueyapılırsa değişiklik iptal edilir (yalnızcaChangingolaylarında)
Changed olaylarında cancel yoktur (değişiklik artık gerçekleşmiştir).
Kod örnekleri
Bir TextArea'ya üç yerden erişebilirsiniz. Sunucu örnekleri turuncu, istemci örnekleri kırmızı çerçevelidir.
Form kodu (C#, sunucu)
Form kodunda nesneye doğrudan adıyla erişirsiniz:
// Oku
string aciklama = TextArea1.Value.ToString();
// Yaz
TextArea1.Value = "Talep gerekçesi buraya yazılır.";
TextArea1.Text = "Talep gerekçesi buraya yazılır.";
Akış (Flow) kodu (C#, sunucu)
Akış kodunda nesneye Document1.Controls üzerinden erişirsiniz:
// Oku
string aciklama = Document1.Controls["TextArea1"].Value.ToString();
// Yaz
Document1.Controls["TextArea1"].Value = "Talep gerekçesi buraya yazılır.";
Document1.Controls["TextArea1"].Text = "Talep gerekçesi buraya yazılır.";
İstemci kodu (TypeScript, tarayıcı)
İstemci tarafında nesnelere this. ile erişilir ve özellik adları küçük harfle yazılır (value, text):
this.TextArea1.value = "";
this.TextArea1.text = "";
.Value saklanan değerdir, .Text ekranda görünen metindir. TextArea için ikisi de string'tir; yazarken ikisini de aynı yazıyla set etmeye özen gösterin.
Örnek: değeri doğrulama (OnValueChanging)
OnValueChanging değer değişmeden hemen önce çalışır; istemediğiniz bir değeri burada iptal edebilirsiniz. Aşağıdaki örnekte 10 karakterden kısa bir açıklama girilmesi engellenir.
İstemci (TypeScript):
async TextArea1_OnValueChanging(args: Controls.EventArgs.IPropertyChangingEventArgs<string>) {
if (args.newValue != null && args.newValue.length < 10) {
args.cancel = true; // Değer değişimini iptal eder
this.showMessage("Uyarı", "Açıklama en az 10 karakter olmalıdır.", "Validation");
}
}
Sunucu (C#):
void TextArea1_OnValueChanging(object sender, PropertyChangingEventArgs<string> e)
{
if (e.NewValue != null && e.NewValue.Length < 10)
{
e.Cancel = true;
ShowMessage("Uyarı", "Açıklama en az 10 karakter olmalıdır.",
Bimser.CSP.FormControls.RuleManager.AlertType.Validation);
}
}
İpuçları
Rowsözelliğiyle alanın kaç satır yüksekliğinde görüneceğini ayarlayın; uzun açıklamalar için 4-6 satır rahat bir başlangıçtır.- Uzun metinlerde
Show Character Counterözelliğini açarak kullanıcıya kalan karakteri gösterin;MaxLengthile birlikte iyi çalışır. - Tek satırlık kısa metinler için TextArea yerine TextBox kullanın.
Tüm tasarımcı özellikleri (tam liste)
General: Name, Field Name, Size
Label: Caption, Text, Position, Left, Width, Height, Font (Bold / Italic / Underline), Ellipsis, Visible, Show Colon, Horizontal Align, Vertical Align, Mark Char, Mark Position
Behavior: ReadOnly, Required, MaxLength, Rows, Tab Index, Is Secret Data, Enable MultiLanguage Text
Appearance: Visible, Client Visible, Enabled, Client Enabled, Placeholder, Text Align, Title, Show Character Counter, Text, Value
Olaylar (Client): OnInit, OnLoad, OnPreRender, OnRender, OnPropertyChanging, OnPropertyChanged, OnClick, OnDoubleClick, OnDataLoad, OnValueChanging, OnValueChanged, OnTextChanging, OnTextChanged, OnValidating, OnMultiLanguageTextChanging, OnMultiLanguageTextChanged
Olaylar (Server): OnInit, OnLoad, OnRender, OnValueChanging, OnValueChanged, OnTextChanging, OnTextChanged, OnValidating, OnMultiLanguageTextChanging, OnMultiLanguageTextChanged