SearchBox

İçinde arama ikonu bulunan, tek satırlık bir metin nesnesidir. Kullanıcının bir arama ifadesi yazıp listeleri ya da kayıtları filtrelemesi gereken yerlerde kullanılır. Davranış olarak TextBox ile aynıdır; tek farkı arama amacına uygun görünümüdür.

Değer tipi: string

Ne zaman kullanılır?

Kullanıcının bir şey araması gereken alanlarda kullanın: kayıt listesinde filtreleme, ad/kod ile arama, hızlı bulma kutusu. Girilen metni OnValueChanged olayında okuyup kendi arama/filtre kodunuzu çalıştırırsınız. Sıradan metin girişi için TextBox, belirli bir biçim gereken alanlarda MaskInput daha uygundur.

Tasarımcı özellikleri

Bir SearchBox seçildiğinde Özellik Görüntüleyici sekmelere ayrılır.

General

Özellik	Açıklama
Name	Nesnenin koddaki adı (ör. SearchBox1). Koddan bu adla erişirsiniz.
Field Name	Veritabanındaki alanın adı.
Size	Alanın veritabanındaki uzunluğu.

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.
Tab Index	Tab tuşuyla geçiş sırasını belirler.
Is Secret Data	Değeri hassas veri sayar; loglarda gizlenir.

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ı (ör. "Ara...").
Text Align	Yazının hizası.
Size Type	Genişlik davranışı (sabit / esnek).
Title	Fareyle üzerine gelince çıkan ipucu (tooltip) yazısı.
Text	Nesnede görünen metin.

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. SearchBox'ı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 arama metni kesinleştiğinde. En sık kullanılan olaydır.
OnValidating	Form kaydedilirken alanın değeri doğrulanırken.

İ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.

Olay parametreleri

OnValueChanging / OnTextChanging olaylarının parametresi (args TS, e C#) şunları taşır:

• newValue / NewValue — girilmek istenen yeni değer
• oldValue / OldValue — önceki değer
• cancel / Cancel — true yapılırsa değişiklik iptal edilir (yalnızca Changing olaylarında)

Changed olaylarında cancel yoktur (değişiklik artık gerçekleşmiştir).

Kod örnekleri

Bir SearchBox'a üç 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 aramaMetni = SearchBox1.Value.ToString();

// Yaz
SearchBox1.Value = "fatura";
SearchBox1.Text  = "fatura";

Akış (Flow) kodu (C#, sunucu)

Akış kodunda nesneye Document1.Controls üzerinden erişirsiniz:

// Oku
string aramaMetni = Document1.Controls["SearchBox1"].Value.ToString();

// Yaz
Document1.Controls["SearchBox1"].Value = "fatura";
Document1.Controls["SearchBox1"].Text  = "fatura";

İ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.SearchBox1.value = "";
this.SearchBox1.text  = "";

.Value mi .Text mi?

.Value saklanan değerdir, .Text ekranda görünen metindir. SearchBox için ikisi de string'tir; yazarken ikisini de aynı yazıyla set etmeye özen gösterin.

Örnek: arama metnini yakalama (OnValueChanged)

Kullanıcı arama metnini yazıp alandan çıktığında OnValueChanged çalışır. Bu olayda arama ifadesini okuyup filtre/arama kodunuzu tetikleyebilirsiniz.

İstemci (TypeScript):

async SearchBox1_OnValueChanged(args: Controls.EventArgs.IPropertyChangedEventArgs<string>) {
    const aranan = this.SearchBox1.value;                    // Yazılan arama metni
    if (!aranan) {
        return;                                              // Boşsa arama yapma
    }
    // TODO: aranan ifadeye göre kendi filtre/arama kodunuzu çalıştırın
    this.showMessage("Arama", "Aranıyor: " + aranan, "Information");
}

İpuçları

• Arama metnini her tuş vuruşunda değil, kullanıcı alandan çıkınca işlemek için OnValueChanged olayını kullanın; her harfte tetiklemek isterseniz OnTextChanged'i tercih edin.
• Placeholder özelliğine "Ara..." gibi bir ipucu yazarak alanın amacını netleştirin.
• Yalnızca veri girişi gereken, arama amacı taşımayan alanlarda SearchBox 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: IsSecretData, MaxLength, ReadOnly, Required, TabIndex

Appearance: ClientEnabled, ClientVisible, Enabled, Placeholder, SizeType, Text, TextAlign, Title, Value, Visible

Olaylar (Client): OnInit, OnLoad, OnPreRender, OnRender, OnPropertyChanging, OnPropertyChanged, OnClick, OnDoubleClick, OnDataLoad, OnValueChanging, OnValueChanged, OnTextChanging, OnTextChanged, OnValidating

Olaylar (Server): OnInit, OnLoad, OnRender, OnValueChanging, OnValueChanged, OnTextChanging, OnTextChanged, OnValidating