Form Kütüphanesi

Form nesnelerini sınıf formuna getirerek gerek görünüm gerekse de kontrolcü içerisinde kullandırmayı amaçlar. Nesne zincirlemesi ile istenilen özellik değer çiftleri kolaylıkla eklenebilmektedir. Özellikle veritabanı ile doğrudan ilişkili çalışabilir olması standart form kullanımına göre büyük kolaylık ve avantaj sağlar. Ayrıca DB::, Validation:: ve Permission:: kütüphaneleri ile entegreli çalışır.

# Kurulum

ZN dağıtımları için kurulum gerekmez.

↓ composer require znframework/package-hypertext

# Yöntemler

# Özellikler

Tüm form nesneleri için geçerli tüm HTML özellikleri bir yöntemle kullanılabilir.

Form::id('example')->style('red:color')-> - - -

Yukarıda kullanılan id(), style() gibi yöntemler input nesnesinin özellik değer çiftini oluşturan yapıları belirlemek için kullanılır. Bu kullanım tüm form nesneleri için ortaktır. Her Form:: nesnesi kendi parametreleri dışında bu opsiyonel yöntemler ile de parametre kullanımlarını sağlayabilir. Eğer özellik birden fazla kelime ve aralarında tire(-) içeren bir yapıda ise bu özellik yöntem olarak camelCase yani exampleElement() formunda kullanılır.

Parametreler

Kullanımlar

@Form::required()->placeholder('Name Please')->id('name')->text('name')

Eğer form özellikleriniz data-validation gibi - ile ayrılan bir özellikse camelCase standartında yazmanız gerekir.

@Form::dataValidation('required')->myId(1)->textarea('name', 'Value')

<textarea data-validation="required" my-id="1" name="name">Value</textarea>

# Open (ZN >= 1.0.0)

Html <form> kullanımının karşılığıdır.

Parametreler

Kullanımı

@Form::action('home')->method('get')->open('example-form')

<form name="example-form" method="get" action="https://www.example.xxx/home">

Form nesnesinin enctype değerini ayarlamak için kullanılır. Özellikle dosya yükleme işlemlerinde bu değerin kullanılması gerekmektedir.

Parametreler

Kullanımı

@Form::enctype('multipart')->open('upload-form')

CSRF ataklarını engellemek için token datası oluşturur.

Parametreler

Kullanımı

@Form::csrf()->open('form')

Form'a tablo kayıtını bağlamak için kullanılır. DB::where() kullanımı ile aynıdır. Bu yöntemle doğrudan istenilen tablonun istenilen koşula göre ilgili kayıtın bağlanmasını sağlayabilirsiniz. Tablo adı olarak form nesnesinin name değeri kullanılır.

Parametreler

Kullanımı

@Form::where('id', URI::get('id'))->open('accounts')

Form Nesneleri

Tablo tanımlamasından sonra diğer form nesneleri kayıttan gelen değeri otomatik alır. İstisna olarak checkbox, radio butonlar ve select nesnesinin kullanımı farklıdır.

Radio Buton

Radio butonların seçili olabilmesi için verilen değerin gelen kayıttaki değer ile eşleşmesi gerekmektedir.

Male  /: @Form::radio('gender', 1)
Female/: @Form::radio('gender', 2)

Yukarıdaki tanımlamada gender kolonuna ait değer hangisi ile eşleşirse o buton seçili hale gelir.

Checkbox Buton

Checkbox butonların seçili olabilmesi için verilen değerin gelen kayıttaki değer ile eşleşmesi gerekmektedir. Ancak genellikle checkbox değerleri [1,2,5,10] gibi json formunda saklanır. Json çözümlemesi otomatik olarak yapılarak ilgili butonlar seçilir.

@Form::checkbox('colors', 1)
@Form::checkbox('colors', 2)
@Form::checkbox('colors', 5)
@Form::checkbox('colors', 20)

Yukarıdaki butonlardan hangileri eşleşirse o butonlar seçili hale gelir.

Select List

Select nesnesinin seçili gelebilmesi için değerlerinin tanımlanmış olması gerekmektedir.

Gender/: @Form::select('gender', [1 => 'Male', 2 => 'Female'])

Yukarıdaki tanımlamada gender kolonuna ait değer hangisi ile eşleşirse o değer seçili hale gelir.

Eğer kompleks sorguları tabloya bağlamak isterseniz bu yöntemden istifade edebilirsiniz. DB::query() yönteminin kullanımı ile aynıdır.

Parametreler

Kullanımı

{{ Form::query(DB::string()->where('id', URI::get('id'))->accounts())->open('accounts') }}

Form'un güncellenme ve ekleme işlemini otomatik olarak yaptırabilmeniz içindir.

Parametreler

Kullanımı

@Form::where('id', 1)->process('update')->open('users')
@Form::postback()->validate('required', 'xss')->text('name')
@Form::postback()->validate('email', 'required')->text('email')
@Form::select('gender', [1 => 'Male', 2 => 'Female'])
@Form::validate('required')->textarea('about')
@Form::submit('submit', 'Submit')
@Form::close()
@Form::validateErrorMessage()

Validasyon Hata Mesajını Yakalamak

Submit sonrası oluşan validasyon hatasını yakalamak için aşağıdaki 2 yöntemden yararlanılır.

Form::validateErrorMessage()
Form::validateErrorArray()

Uyarı: Bu yöntemlerin değer üretebilmesi için process() yönteminin kullanılıyor olması gerekmektedir.

Form::process('update') kullanımınında form nesnelerine gelen tablo verilerini tutar.

Parametreler

Kullanımı

@Form::where('id', 1)->process('update')->open('users')
{[ $row = Form::getUpdateRow() ]}
@Form::close()

Form::process('insert') yöntemi ile birlikte kullanılır. Insert işlemi sırasında aynı verinin tekrar kayıt edilmesini engeller. DB::duplicateCheck() yönteminin kullanımıdır.

Parametreler

...$columns = '*'

Kullanımı

@Form::duplicateCheck('message', 'subject')->process('insert')->open('accounts')

Form'un submit buton ile sayfa yenilenmesini önlemek için kullanılır. Yani bir Form::submit() nesnesi ile formun post edilmesi durumunda sayfanın  yenilenmesini engellemek için kullanılır. Özellikle Form::submit() ile ajax gönderimleri yapmak istediğinizde kullanabilirsiniz.

Parametreler

Kullanımı

@Form::prevent()->open('accounts')
@Form::vRequired()->text('name')
@Form::submit('send', 'SEND')
@Form::close()

# Close (ZN >= 1.0.0)

Html </form> kullanımının karşılığıdır.

Parametreler

Kullanımlar

@Form::close()

# Text (ZN >= 1.0.0)

Html <form input="text"> kullanımının karşılığıdır.

Parametreler

Kullanımlar

@Form::id('example-text')
     ->maxlength(10)
     ->text('textBox', 'Welcome!')

# Password (ZN >= 1.0.0)

Html <form input="password"> kullanımının karşılığıdır.

Parametreler

Kullanımlar

@Form::password('password', '*****', ['maxlength' => 10])

# Textarea (ZN >= 1.0.0)

Html <textarea> kullanımının karşılığıdır.

Parametreler

Kullanımlar

@Form::cols(50)->rows(5)->textarea('address', 'Address')

# Submit (ZN >= 1.0.0)

Html <form input="submit"> kullanımının karşılığıdır.

Parametreler

Kullanımlar

@Form::submit('sendSubmit', 'Send')

# Reset (ZN >= 1.0.0)

Html <form input="reset"> kullanımının karşılığıdır.

Parametreler

Kullanımlar

@Form::reset('clear', 'Clear')

# Button (ZN >= 1.0.0)

Html <form input="submit"> kullanımının karşılığıdır.

Parametreler

Kullanımlar

@Form::button('sendButton', 'Send')

# Radio (ZN >= 1.0.0)

Html <form input="radio"> kullanımının karşılığıdır.

Parametreler

Kullanımlar

@Form::checked()->radio('gender', 'Female')
@Form::radio('gender', 'Male')

# Checkbox (ZN >= 1.0.0)

Html <form input="checkbox"> kullanımının karşılığıdır.

Parametreler

Kullanımlar

@Form::checked()->checkbox('trueType', 'true')
@Form::checkbox('trueType', 'false')

# Select / Multiselect (ZN >= 1.0.0)

Html <select> kullanımının karşılığıdır.

Parametreler

Opsiyonel Yöntemler

Kullanımlar

$options = [ '34' => 'Istanbul', '19' => 'Corum' ];

echo Form::select('cities', $options, '19');

v.3.0.1 sürümü ve sonrasında seçenekleri doğrudan veritabanından çekmek isterseniz table() veya query() yöntemlerinden yararlanabilirsiniz.

echo Form::table('accounts')
         ->select('accountList', ['keyColumn' => 'valueColumn']);

İlk eleman için varsayılan anahtar değer tanımlaması yapmak isterseniz aşağıdaki gibi kullanabilirsiniz.

echo Form::table('accounts')->select('accountList',
[
//  'keyColumn'  => 'valueColumn'
    'id'         => 'name',
//  'defaultKey' => 'defaultValue'
    '0'          => 'Musteri seciniz'
]);

Ya da

$query = DB::string()->accounts();

echo Form::query($query)->select('accountList', ['id' => 'name']);

v.3.1.0 sürümünde seçeneklerde görüntülenmesini istediğiniz veya istemediğiniz öğreleri including() ve excluding() yöntemlerini kullanarak belirleyebilirsiniz.

6.0.19 Güncellemesi

Bu güncelleme ile Form::table() kullanımına bağlı olarak value parametresi manipüle edilebilir hale getirildi. Özellikle çok dilli sistemlerde value'nin seçili dile bağlı olarak değiştirlmesinin istenmesi durumunda kullanılabilir.

echo Form::table('categories')->select('Category', ['ID' => function($row)
{ 
    return $row->name; 
}])

6.0.41 Güncellemesi

Bu güncelleme ile Form::multiselect() yönteminin 3. parametresi JSON türünde olması halinde dizi gibi algılanıp çoklu seçim yapılabilmesi sağlandı.

@Form::table('categories')->multiselect('categories[]',  ['ID' => 'Name'], $row->categories)

echo Form::including([2, 3])
         ->select('cityList',
         [
             1 => 'Istanbul', 
             2 => 'Londra', 
             3 => 'Paris'
         ]); 

// output: Londra, Paris

echo Form::excluding([2, 3])
         ->select('cityList',
         [
             1 => 'Istanbul',
             2 => 'Londra',
             3 => 'Paris'
         ]); 

// output: İstanbul

# File (ZN >= 1.0.0)

Html <form input="file"> kullanımının karşılığıdır.

Parametreler

$multiple = false

Kullanımlar

@Form::file('upload')

Çoklu upload yapılmak istendiğinde ise aşağıdaki gibi bir kullanım mümkündür.

@Form::file('upload', true)

# HTML5 Nesneleri

Tüm HTML5 nesnelerinden form nesnelerinin kullanımı aynı yapıda olduğu için aşağıda html5InputName yerine HTML5 ile gelen form nesnelerinin adı yazılarak kullanılabilir. 

Parametreler

Kullanımlar

@Form::tel('phone')

# __toString (ZN >= 5.8.6.6)

Form yöntemlerini sıralı olarak kullanabilmenizi sağlar.

Parametreler

Kullanımlar

@style('bootstrap')

@container
    @row
        @Form::open('contact')
             ->group()->label('name', 'Name:')->text('name')
             ->group()->label('subject', 'Subject:')->text('subject')
             ->group()->label('message', 'Message:')->textarea('message')
             ->close()
    @endrow
@endcontainer

@script('jquery', 'bootstrap')

Yukarıdaki kullanımda dikkat edilirse form nesneleri her defasında Form:: deyimi kullanılmayarak zincirleme bir kullanım oluşturulmuştur..

# Postback (ZN >= 4.0.0)

Form submit edildiğinde form öğelerinin son değerinin korunmasını sağlamak için kullanılır.

Parametreler

$type = 'post'

Kullanımlar

@Form::postback()->text('name')

# Validate (ZN >= 5.4.2)

Validation::rules() yönteminin görevini üstlenir. Farklı olarak kuralları form nesnesi ile birlikte kullanabilmenizi sağlar.

Parametreler

Kullanımlar

@Form::validate('required', 'xss', ['minchar' => 10])->text('name')

Takma isim validasyon kontrolünün başarısızlığı durumunda dönen metinde form nesnesi isminin nasıl görüntüleneceğini ayarlarmak için kullanılır.

@Form::validate('required', 'xss', ['minchar' => 10])->alias('Name:')->text('name')

Form nesnesi üzerinden gönderilen kurallar Controller ayağında Validation::check($submitName) yöntemi ile kontrol edilmesi gerekmektedir.

@Form::open()

@Form::postback()
     ->validate('email', 'required')
     ->alias('Email/:')
     ->text('email')

@Form::submit('submit', 'Submit')

@Form::close()

{{ $error ?? NULL }}

<?php namespace Project\Controllers;

use Validation, Post;

class Home extends Controller
{
    public function main()
    {
        if( ! Validation::check('submit') )
        {
            View::error(Validation::error('string'));
        }
    }
}

# vMethod (ZN >= 5.8.2.8)

Html ile ZN Framework'ün validasyon yöntemlerinin harmanlanmış halidir. Kullanıcıya daha kısa sürede geri bildirim sağlaması açısından html'nin validasyonu devreye girerken arkaplanda ZN'nin validasyonu devreye girer. Standart olarak bu yöntemler v harfi ile başlar. İşlev olarak ZN validasyon yöntemleri gibidir.

Yöntemler

vLimit(Int $min = 0, Int $max = NULL)

vBetween(Int $min = 0, Int $max = 0)

vMessage(String $message)

Kullanım

@Form::open()
@Form::vMinchar(3)->text('name')
@Form::vEmail()->vMaxchar(100)->text('email')
@Form::vPhone('***-***-**-**')->text('phone')
@Form::vLimit(5, 200)->text('subject')
@Form::vMinchar(3)->vMessage('Bu alan en az 3 karakterli olmalıdır!')->textarea('message')
@Form::submit('send', 'SEND')
@Form::close()

<?php namespace Project\Controllers;

use Validation, DB;

class Home extends Controller
{
    public function main()
    {
        if( Validation::check('send') )
        {
            DB::duplicateCheck()->insert('post:tickets');
        }
    }
}

# Serializer (ZN >= 5.8.4.1)

Bir formun tüm verilerinin ajax ile bir kontrolcüye gönderilmesini sağlar. Genellikle Form::button() yöntemi ile kullanılır.

Ön Bilgiler

● Veriler post yöntemi ile gönderilmektedir. Dolayısı ile değerlere Post::inputName() ile erişilir.
● Ajax işleminin başarılı ile gerçekleştirilmesi durumunda dönen değer javascript'in data isimli değişkeninde saklanmaktadır.

Parametreler

$datatype = 'standart'

Kullanımlar

@Form::open('contact-form')
@Form::text('name')
@Form::textarea('message')
@Form::serializer('Contact/ajaxSendForm', '#successDiv')->button('send', 'SEND')
@Form::close()

Yukarıda Contact/ajaxSendForm yöntemine ajax ile tüm formun verilerini gönderdik. Bu giden verileri işledikten sonra işlem sonucunu $('#successDiv').html(data) nesnesine yazdırdık. Giden veriler post yöntemi ile gönderilmektedir.

2. parametrenin {< kodlarınız >} biçiminde kullanımı ile yöntem içerisine doğrudan javascript yazabilmenizin önünü açıyor. Ajax işleminin success durumunda gelen veri data isimli javascript değişkeninde saklanmaktadır.

@Form::open('contact-form')
@Form::text('name')
@Form::textarea('message')
@Form::serializer('Contact/ajaxSendForm', 
{<
    if( data.success === true )
    {
        $('#successDiv').html('İşlem başarılı.');
    }
    else
    {
        $('#errorDiv').html('İşlem başarısız!');
    }
>}, 'json')->button('send', 'SEND') 
@Form::close()

Ajax işlemine datatype dışında farklı parametreler de eklemek isterseniz 3. parametrenin dizi olarak gönderilmesi gerekmektedir.

@Form::open('contact-form')
@Form::text('name')
@Form::textarea('message')
@Form::serializer('Contact/ajaxSendForm', {< swal(data) >}, 
[
    'dataType' => 'json',
    'async'    => true
])->button('send', 'SEND')
@Form::close()

# Trigger (ZN >= 5.8.4.1)

Bir form nesnesinin değerinin ajax ile bir kontrolcüye gönderilmesini sağlar. Form::serializer() kullanımına çok benzer farklı olarak hangi olay ile tetikleneceğinin ayarlanabiliyor olmasıdır. Bunun dışında ajax ile sadece kendi değerini yollar. Bu kullanımından dolayı Form::text() vb. gibi form nesneleri ile kullanımı önerilir.

Ön Bilgiler

● Form nesnesinin değeri post yöntemi ve kendi ismi ile gönderilir. Yani nesnenin değeri sunucu tarafında Post::inputName() ile alınır.
● Ajax işleminin başarılı ile gerçekleştirilmesi durumunda dönen değer javascript'in data isimli değişkeninde saklanmaktadır.
● Geriçağrım kullanımında ilgili nesnenin karşılığı javascript'in element isimli değişkeninde saklanmaktadır. Örn: $(element).val() gibi kullanım gerektiren durumlar için kullanabilirsiniz.

Parametreler

$datatype = 'standart'

Kullanımlar

@Form::open('contact-form')
@Form::trigger('keyup', 'Validations/control', 
{< 
    if(data === false) swal('Geçersiz girdi!'); 
>})->text('name') 
@Form::textarea('message')
@Form::serializer('Contact/ajaxSendForm', '#successDiv')->button('send', 'SEND')
@Form::close()

Diğer parametrelerin kullanımları Form::serializer() yöntemi ile aynıdır.

# Modal (ZN >= 5.8.4.1)

Bootstrap modalbox'ını modal id değerine göre açmak için kullanılır.

Parametreler

Kullanımlar

@Form::modal('myModal')->button('openModal', 'Open Modal') 

# Modalbox (ZN >= 5.8.4.1)

Bootstrap modalbox'ı oluşturmak için kullanılır.

Parametreler

Kullanımlar

@Form::modal('myModal')->button('openModal', 'Open Modal') 
@Form::modalbox('myModal')

@Form::modal('myModal')->button('openModal', 'Open Modal') 

@Form::modalHeader('Hi!')->modalBody('ZN Framework')->modalbox('myModal') 

String parametre yerine geri çağrım işlevi (Callable) de uygulanabilir.

@Form::modal('myModal')->button('openModal', 'Open Modal') 

@Form::modalSize('lg')->modalHeader('Hi!')->modalBody
({<
    @Form::text('Name')
>})->modalbox('myModal') 

# Group (ZN >= 5.8.5)

Bootstrap form nesnelerinin gruplanması için kullanılan elementine karşılık gelmektedir. 2 tür parametre dağılımı vardır.

Parametreler - Nesne

Parametreler - Kapsayıcı

Kullanımlar

@Form::group()->text('email') 
@Form::group()->password('pass') 

Kapsayıcı Kullanım

Birden fazla form nesnesinin aynı grup içerisinde yer alması için aşağıdaki gibi de kullanılmaktadır.

@Form::group
({<
   @Form::text('email')
   @Form::password('pass')
>}) 

# Label (ZN >= 5.8.5)

Bootstrap form nesnelerine etiket eklemek için kullanılır. 2 tür parametre dağılımı vardır.

Parametreler - Text / Textarea / Select

Parametreler - Checkbox / Radio

Kullanımlar

@Form::group()->label('email', 'E-posta:')->text('email') 
@Form::group()->label('pass', 'Şifre:')->password('pass')

Checkbox ve radio elementleri için kullanım aşağıdaki gibidir.

@Form::group()->label('Bay')->radio('gender')
@Form::group()->label('Bayan')->radio('gender')

# Col (ZN >= 5.8.5)

Bootstrap form nesnelerine sütun genişliği uygulamak için kullanılır.

Parametreler

Kullanımı

@Form::group()->label('email', 'Email:')->col('sm-4')->text('email')

# Helptext (ZN >= 5.8.5)

Bootstrap form nesnelerine yardım yazısı için kullanılır.

Parametreler

Kullanımı

@Form::helptext('Bu bölüm e-posta alanıdır.')
     ->group()
     ->label('email', 'Email:')->col('sm-4')
     ->text('email')

# Popover (ZN >= 5.8.5.3)

Bootstrap'ın popover bileşenin Form::button() veya Html::anchor() ile kullanılmasını sağlar. Kaynak dosyalarının nasıl dahil edilmesi gerektiği konusunda detaylar için tıklayınız. 

2 parametre dizilimi vardır. 1.si nesne oluşturmak için özellik olarak kullanılırken 2.si popover nesnesini aktif etmek için javascriptlerden sonra kullanılır.

Parametreler - Html

Parametreler -  Javascript

Kullanımı

@style('css/bootstrap4.css')

@Form::class('btn btn-danger')->popover('right', 'ZN Framework')->button('name', 'NAME')

@script('jquery', 'js/bootstrap4.js', 'js/popper.min.js')

@Form::popover('all', ['delay' => 100])

Yukarıda kullanılan style ve script yolları örnek amaçlı kullanılmıştır.

Olay Yönetimi

Popover nesnesinin javascriptine olay eklemek için on() yöntemi kullanılır.

@Form::on('shown', 'alert(1)')->popover('all', ['delay' => 100])

Daha fazla olay türü için tıklayınız.

# Tooltip (ZN >= 5.8.5.3)

Kullanımı popover() yöntemi ile aynıdır. detaylar için tıklayınız.