Ana içeriğe geç

DateRangePicker

Tarih veya zaman aralığı belirtmek için kullanılan nesnedir. Başlangıç ve bitiş tarihi mantığında aralık değeri belirtmek için kullanılır.

Geliştirme arayüzünde aktif ekran form iken, Araç Kutusu panelinde form nesneleri listelenir. Nesne, araç kutusu panelinden sürükle/bırak yöntemi ile forma eklenir.

DateRangePicker

Nesnenin üzerine tıklandığında Özellik Görüntüleyici panelinde “Genel” ve “Olaylar” sekmeleri yer alır ve nesneye ait özellikler görüntülenip, düzenlenebilir. Nesne özelliklerinin aktarıldığı kalıtım şeması aşağıdaki gibidir;

Genel

Design

Name - Nesnenin sistem tarafında kullanılacak ismidir. Başka bir nesnenin içinde ve kod tarafında nesneye, isim alanında yazan değerle erişim sağlanır.

Start Date

Allow empty - Başlangıç tarihi alanının boş bırakılıp bırakılamayacağı bu alandan belirlenir. Bu özellik aktif edildiğinde başlangıç tarihi alanı boş bırakılabilir. Özellik pasifken başlangıç tarihi olarak bir değer seçilmesi zorunlu tutulur.

Set today as default - Özellik aktif edildiğinde, başlangıç tarihi alanında bugünün tarihi varsayılan seçili olarak görülür.

Disabled hours - Nesne özelliklerindeki Show Time özelliği aktifken, bu alanda belirtilen saatler nesnede pasif olarak görünür ve seçilemez.

Belirli bir saat aralığının seçilmesi istenmiyorsa, ilgili saat aralığı, saat değerleri arasına “–” işareti konularak yazılır. Örneğin; saat 12 ile 16 arası saatlerin seçilmesi istenmiyorsa, bu alana “12-16” değeri yazılır. Nesnede saat seçim alanında bu saat aralıkları pasif görünür.

DateRangePicker

DateRangePicker

Birden çok saat değerinin seçilememesi isteniyorsa, bu saat değerleri arasına “,” konularak bu alana yazılır. Örneğin; 01,03 ve 05 saatlerinin seçilememesi istenirse, bu alana “01,03,05” ifadesi yazılmalıdır.

DateRangePicker

DateRangePicker

Disabled minutes - Nesne özelliklerindeki Show Time özelliği aktifken, bu alanda belirtilen dakikalar, nesnede pasif olarak görünür ve seçilemez.

Belirli bir dakika aralığının seçilmesi istenmiyorsa, ilgili dakika aralığı, dakika değerleri arasına “–” işareti konularak yazılır. Örneğin; 20 ile 25 dakika arası pasif olsun istenirse, bu alana “20-25” değeri yazılır. Nesnede dakika seçim alanında bu dakika aralıkları pasif görünür.

DateRangePicker

DateRangePicker

Birden çok dakika değerinin seçilememesi isteniyorsa, bu dakika değerleri arasına “,” konularak bu alana yazılır. Örneğin; 40 ve 45 dakikalarının seçilememesi istenirse, bu alana “40,45” ifadesi yazılmalıdır.

DateRangePicker

DateRangePicker

Disabled seconds - Nesne özelliklerindeki Show Time özelliği aktif edildiğinde, Format alanında varsayılan format “YYYY-MM-DD HH:mm” şeklinde gelir. Saniye değerinin de nesnede seçilebilmesi istenirse bu format, YYYY-MM-DD HH:mm:ss şeklinde düzenlenmelidir. Bu düzenlemeden sonra nesnede saniye değeri de görüntülenebilir olur.

DateRangePicker

Engelli Saniyeler alanında belirtilen saniyeler, nesnede pasif olarak görünür ve seçilemez.

Belirli bir saniye aralığının seçilmesi istenmiyorsa, ilgili saniye aralığı, saniye değerleri arasına “–” işareti konularak yazılır. Örneğin; 03 ile 07 saniye arası pasif olsun istenirse, bu alana “03-07” değeri yazılır. Nesnede saniye seçim alanında bu saniye aralıkları pasif görünür.

DateRangePicker

DateRangePicker

Birden çok saniye değerinin seçilememesi isteniyorsa, bu saniye değerleri arasına “,” konularak bu alana yazılır. Örneğin; 53, 55 ve 56 saniyelerinin seçilememesi istenirse, bu alana “53,55,56” ifadesi yazılmalıdır.

DateRangePicker

DateRangePicker

Value - Başlangıç tarihi alanının değeri burada ifade edilir. Bu alanda seçilen tarih, başlangıç tarihi alanının varsayılan değeri olarak nesnede belirir.

Placeholder - Nesne içine uç kullanıcı tarafından girilmesi istenen veri bilgisini, nesne içerisinde bilgi amaçlı göstermek için kullanılan özelliktir. Uç kullanıcı nesneyi görüntülediğinde bu alana yazılan yönlendirici metni görür, nesneye odaklandığında ve değer girmeye başladığında yönlendirici metin kaybolur.

End Date

Allow empty - Bitiş tarihi alanının boş bırakılıp bırakılamayacağı bu alandan belirlenir. Bu özellik aktif edildiğinde bitiş tarihi alanı boş bırakılabilir. Özellik pasifken bitiş tarihi olarak bir değer seçilmesi zorunlu tutulur.

Set today as default - Özellik aktif edildiğinde, bitiş tarihi alanında bugünün tarihi varsayılan seçili olarak görülür.

Disabled hours - Nesne özelliklerindeki Show Time özelliği aktifken, bu alanda belirtilen saatler nesnede pasif olarak görünür ve seçilemez.

Belirli bir saat aralığının seçilmesi istenmiyorsa, ilgili saat aralığı, saat değerleri arasına “–” işareti konularak yazılır. Örneğin; saat 12 ile 16 arası saatlerin seçilmesi istenmiyorsa, bu alana “12-16” değeri yazılır. Nesnede saat seçim alanında bu saat aralıkları pasif görünür.

DateRangePicker

DateRangePicker

Birden çok saat değerinin seçilememesi isteniyorsa, bu saat değerleri arasına “,” konularak bu alana yazılır. Örneğin; 01,03 ve 05 saatlerinin seçilememesi istenirse, bu alana “01,03,05” ifadesi yazılmalıdır.

DateRangePicker

DateRangePicker

Disabled minutes - Nesne özelliklerindeki Show Time özelliği aktifken, bu alanda belirtilen dakikalar, nesnede pasif olarak görünür ve seçilemez.

Belirli bir dakika aralığının seçilmesi istenmiyorsa, ilgili dakika aralığı, dakika değerleri arasına “–” işareti konularak yazılır. Örneğin; 20 ile 25 dakika arası pasif olsun istenirse, bu alana “20-25” değeri yazılır. Nesnede dakika seçim alanında bu dakika aralıkları pasif görünür.

DateRangePicker

DateRangePicker

Birden çok dakika değerinin seçilememesi isteniyorsa, bu dakika değerleri arasına “,” konularak bu alana yazılır. Örneğin; 40 ve 45 dakikalarının seçilememesi istenirse, bu alana “40,45” ifadesi yazılmalıdır.

DateRangePicker

DateRangePicker

Disabled seconds - Nesne özelliklerindeki Show Time özelliği aktif edildiğinde, Format alanında varsayılan format “YYYY-MM-DD HH:mm” şeklinde gelir. Saniye değerinin de nesnede seçilebilmesi istenirse bu format, YYYY-MM-DD HH:mm:ss şeklinde düzenlenmelidir. Bu düzenlemeden sonra nesnede saniye değeri de görüntülenebilir olur.

DateRangePicker

Engelli Saniyeler alanında belirtilen saniyeler, nesnede pasif olarak görünür ve seçilemez.

Belirli bir saniye aralığının seçilmesi istenmiyorsa, ilgili saniye aralığı, saniye değerleri arasına “–” işareti konularak yazılır. Örneğin; 03 ile 07 saniye arası pasif olsun istenirse, bu alana “03-07” değeri yazılır. Nesnede saniye seçim alanında bu saniye aralıkları pasif görünür.

DateRangePicker

DateRangePicker

Birden çok saniye değerinin seçilememesi isteniyorsa, bu saniye değerleri arasına “,” konularak bu alana yazılır. Örneğin; 53, 55 ve 56 saniyelerinin seçilememesi istenirse, bu alana “53,55,56” ifadesi yazılmalıdır.

DateRangePicker

DateRangePicker

Value - Bitiş tarihi alanının değeri burada ifade edilir. Bu alanda seçilen tarih, bitiş tarihi alanının varsayılan değeri olarak nesnede belirir.

Placeholder - Nesne içine uç kullanıcı tarafından girilmesi istenen veri bilgisini, nesne içerisinde bilgi amaçlı göstermek için kullanılan özelliktir. Uç kullanıcı nesneyi görüntülediğinde bu alana yazılan yönlendirici metni görür, nesneye odaklandığında ve değer girmeye başladığında yönlendirici metin kaybolur.

DateRangePicker

DateRangePicker

Caption

Title - Nesnenin etiket metninin düzenlendiği kısımdır.

Position - Nesne etiketinin, nesnenin solunda mı, sağında mı yoksa üzerinde mi konumlandırılacağının düzenlendiği kısımdır.

Yapılabilecek Seçimler : Left, Right, Top, Bottom

Width - Etiket alanının genişliğinin ayarlandığı kısımdır.

Height - Etiket alanının yüksekliğinin ayarlandığı kısımdır.

Font - Etiket alanındaki metnin font, yazı tipi, yazı boyutu ve renginin ayarlandığı kısımdır.

Ellipsis - Etiket metninin, etiket alanına sığmadığı durumlarda, metnin sığmayan kısmı için üç nokta (…) ifadesinin görünüp görünmeyeceğinin ayarlandığı kısımdır.

Visible - Etiket alanının gizli ya da görünür ayarlarının yapıldığı kısımdır.

Show Colon - Etiket metninin yanında iki nokta (:) ifadesinin görünüp görünmeyeceğinin ayarlandığı kısımdır.

Horizontal Align - Etiket metnini; sağa yasla, sola yasla ya da ortala ayarlarının gerçekleştirildiği kısımdır.

Yapılabilecek Seçimler : Left, Center, Right

Vertical Align - Etiket metnini; yukarı yasla, aşağı yasla ya da ortala ayarlarının gerçekleştirildiği kısımdır.

Yapılabilecek Seçimler : Top, Middle, Bottom

Mark Char - Nesneyi belirginleştirmek için, etiket metnine *, ! gibi karakterlerin girilebileceği alandır.

Mark Position - İşaret karakteri olarak belirlenen karakterin, etiket metninin başında mı yoksa sonunda mı gösterilmesinin ayarlandığı kısımdır.

Yapılabilecek Seçimler : AtFirst, AtLast

Appearance

Visible - Nesnenin gizlenip, görünür yapılma ayarlarının gerçekleştirildiği kısımdır. Bu alan aktifken, nesne form üzerinde görünür durumdadır. Alan pasif yapıldığında nesne görünmez olur.

Client Visible - Form ilk açıldığında nesne görünmesin, belirli bir şart sağlandığında nesne görünür olsun gibi bir işlem yapılmak istendiğinde, nesnenin istemci tarafında görünmez olması için bu alan pasif yapılır. Kodla ya da Kural Yöneticisi ile belirlenen şart sağlandığında nesne tekrar görünür hale getirilebilir. Sunucu görünürlüğü aktif değilken, istemci müdahale edemez ancak istemci görünürlüğü aktif değilken sunucu müdahale edebilir.

Enabled - Nesnenin etkin modu bu alandan ayarlanır. Bu özellik aktifken nesneye veri girişi sağlanabilir ve nesne düzenlenebilir. Özellik pasifken, nesne düzenlenemez moddadır ve pasif görünür.

Client Enabled - Form ilk açıldığında nesne etkin olmasın, belirli bir şart sağlandığında etkin olsun gibi bir işlem yapılmak istendiğinde, nesnenin istemci tarafında etkin olmaması için bu alan pasif yapılır. Kodla ya da Kural Yöneticisi ile belirlenen şart sağlandığında nesne tekrar etkin hale getirilebilir. Sunucu etkinliği aktif değilken, istemci müdahale edemez ancak istemci etkinliği aktif değilken sunucu müdahale edebilir.

Background Color - Nesneye arka plan rengi vermek için kullanılan alandır.

Title - Form arayüzde açıkken imleç ile nesne üzerine gelindiğinde, bu alanda yazılan metin, ipucu olarak gösterilir. Nesne ile ilgili detay bilgi verilmek istendiğinde kullanılan, uç kullanıcıyı yönlendirme amaçlı bir özelliktir.

ClassName - Forma ait CSS dosyası içinde yazılmış bir class'ın tanımlanarak nesne görünürlüğünün değiştirilebildiği alandır.

TextAlign - Nesne içine girilen ifadenin hizalanacağı yerin belirlenmesi için kullanılan alandır. Sola hizala, merkeze hizala, sağa hizala seçimleri yapılabilir.

Yapılabilecek Seçimler : Left, Center, Right

Size Type - Nesne boyutunun belirlenebileceği alandır.

Yapılabilecek Seçimler : Small, Middle, Large

Behavior

ReadOnly - Nesnenin düzenleme modunda olup olmayacağının ayarlandığı kısımdır. Bu özellik aktif edildiğinde nesne veri girişine izin vermez, salt okunur modda olur. Nesneye veri girişine izin verilmesi için özelliğin pasif olması gerekir.

Tab Index - Bu alana sayısal değerler girilerek, tab butonuna basıldığında form nesneleri arasında hangi sıra ile odaklanılacağı belirlenir. Form doldurulurken imleci, veri girilmek istenen nesneye tıklamak yerine, tab butonuna basarak belirli bir sırayla indekslenmiş nesnelere direk odaklanılması sağlanmış olur. Bu da form doldurma hızını artıran bir özelliktir.

Required - Nesnede veri girişinin zorunlu olup olmayacağının belirlendiği alandır. Bu özellik aktif edildiğinde nesne içerisine veri girişi yapılmadan formun ilerletilmesi/kaydedilmesi gerçekleştirilemez.

Format - Start ve End Date alanlarında görünecek olan tarih ve saat formatının belirlendiği kısımdır. Nesnede Show Time özelliği pasifken, varsayılan tarih formatı “YYYY-MM-DD” şeklindedir. Show Time özelliği aktifken, varsayılan format “YYYY-MM-DD HH:mm” şeklindedir. Nesnede gösterilmek istenen format yapısı bu alanda belirtilebilir.

Mode - Format alanı boş bırakıldığında aktif olan bir özelliktir. Nesnede gösterilecek değerin modunu ifade eder. Nesnenin start ve end date alanlarında; sadece yıl, sadece ay, sadece saat veya sadece gün bazlı seçim yapılmasını sağlamak için kullanılır.

DateRangePicker

Yapılabilecek Seçimler : Year, Month, Time, Date

Show Time - Nesnede saat değerinin gösterilmesi için bu özelliğin aktif edilmesi gerekir. Özellik aktif edildiğinde Format alanındaki varsayılan değer “YYYY-MM-DD HH:mm” şeklinde gösterilir.

Show Today - Nesnenin başlangıç ve bitiş tarihi alanlarında tarih seçimi ekranında “Bugün” seçeneğinin belirmesi için bu özellik aktif edilir. “Bugün” seçeneğine tıklandığında günün tarihi, nesneye otomatik olarak yansır.

DateRangePicker

Date limit type - Seçilecek tarih aralığında kısıtlama yapılmak istendiğinde, kısıtlama türünün belirlendiği alandır. Yapılan seçime göre nesne özelliğinde seçilmesi gereken alanlar değişecektir.

Yapılabilecek Seçimler : Active Date Types, Disabled Date Types

Active date type - Date limit type alanında Active Date Types seçili olduğunda aktif olacak alandır. Alanda yapılacak öge seçimine göre seçim aralığının belirlenmesi aşağıdaki gibi olacaktır.

  • Range dates - Seçimi yapıldığında nesnede Disabled date alanı seçilebilir duruma geçer. Disabled date içinde seçimi yapılacak tarih aralığına göre nesnede tarih seçimi yapılabilir, diğer tarihler seçilemez olacaktır. DateRangePickerDateRangePicker
  • In year - Seçimi yapıldığında, sadece o anki yıldan bir tarih seçilebilir. Önceki veya sonraki yıllar seçilemez olacaktır.
  • In month - Seçimi yapıldığında, sadece o anki ay içerisinden bir tarih seçilebilir. Önceki veya sonraki aylar pasif yani seçilemez olur. DateRangePicker
  • In week - Seçimi yapıldığında, sadece o anki hafta içerisinden bir tarih seçilebilir. Önceki ve sonraki haftalar pasif yani seçilemez olur. DateRangePicker

Disabled date type - Date limit type alanında Disabled Date Types seçili olduğunda aktif olacak alandır. Alanda yapılacak öge seçimine göre seçim aralığının belirlenmesi aşağıdaki gibi olacaktır.

DateRangePicker

  • Past disabled - Seçimi yapıldığında, nesnede bugünden önceki tarihler seçilemez olarak görünür. DateRangePicker
  • Before from date - Seçimi yapıldığında nesnede Disabled date alanı seçilebilir duruma geçer. Disabled date içinde seçilecek tarih öncesinki tarihler nesne içerisinde seçilemez olarak gözükecektir. DateRangePickerDateRangePicker
  • After from date - Seçimi yapıldığında nesnede Disabled date alanı seçilebilir duruma geçer. Disabled date içinde seçilecek tarih sonrasındaki tarihler nesne içerisinde seçilemez olarak gözükecektir. DateRangePickerDateRangePicker
  • Dynamic range - Seçimi yapıldığında, nesne özelliklerindeki Disabled date range alanı aktif olur. Başlangıç tarihi alanı mevcut günden itibaren, burada yazılan sayısal değer kadar gün önce veya sonraya sabitlenir. Seçilebilen günler arasından seçilen başlangıç tarihine göre ise bitiş tarihi alanında, başlangıç tarihincen önceki bir gün seçilemeyeceği için aralık belirlenmiş olur. DateRangePickerDateRangePickerDateRangePicker

Allow Clear - Nesne içinde yapılan seçimin kolaylıkla kaldırılabilmesi istenirse özellik aktif edilmelidir.

Data Definition Language

Field Name - Sistemin veri tabanında, nesne için oluşturacağı kolonun adının belirlendiği alandır. “Name” kısmında nesneye başka bir isim verilip, veritabanı tablosunda nesne için oluşturulacak kolon adı farklı bir isim olarak yaratılabilir.

Allow Null - Nesne için oluşturulacak veritabanı alanının boş(null) değerlere izin verip vermeyeceği bu kısımdan belirtilir.

Olaylar

Nesnenin sahip olduğu olaylar, Özellik Görüntüleyici panelindeki “Olaylar” sekmesinde yer almaktadır. Her bir olay, farklı çalışma anlarında tetiklenerek kendilerine özgü işlemleri gerçekleştirir. Bu olaylara geliştirici tarafından yazılan kodlar da ilgili olayın tetiklendiği anda çalıştırılır.

“Client” alanında bulunan olaylara çift tıklandığında ekran, TypeScript kodlamanın yapılabileceği “Formadı.ts” isimli form kod editörü kısmına yönlendirilir ve tıklanan olaya ait method bloğu otomatik olarak oluşturulur.

“Server” alanında bulunan olaylara çift tıklandığında ekran, C# kodlamanın yapılabileceği “Formadı.cs” isimli form kod editörü kısmına yönlendirilir ve tıklanan olaya ait method bloğu otomatik olarak oluşturulur.

Geliştirici bu methodlar içerisinde istediği kod bloğunu kurgulayabilir. Olaylar sekmesinden tıklanarak kod tarafında methodu oluşturulmuş olayın yanında, method adı bilgisi otomatik oluşturularak, olayla method arasındaki ilişki belirtilmiş olur.

DateRangePicker