Anasayfa / Genel / JQuery UI Button Kullanımı

JQuery UI Button Kullanımı

Düğmeleri gruplamak için, Düğme, “Buttonet” adı verilen ek bir widgetla sağlanır. “Buttonet”, bir konteyner elemanı (radyo düğmelerini içerir.) seçerek ve .buttonset () öğesini çağırarak kullanılır.

Button () yöntemi iki şekilde kullanılabilir :

  1. $(selector, context).button (options)
  2. $(selector, context).button (“action”, params) 

I.$(selector, context).button (options) :

Düğme (seçenekler) yöntemi, bir HTML öğesinin düğme olarak ele alınması gerektiğini bildirir.”Options” parametresi, düğmenin davranışını ve görünümünü belirten bir nesnedir.

  1. HTML sayfamıza indirdiğimiz JQuery uı hazır kütüphanesinde gerekli olan kodları yapıştırıyoruz.

 

  1. <Head> Etiketi içerisine Butonu tanımlayacak <script> kodunu yazıyoruz.

 

GÖRÜNÜMÜ :

  • $( “#button-5” ).buttonset(); 

Bu özellik sayesinde butona bastığımız zaman buton basılı bir şekilde  kalır. 

 

GÖRÜNÜMÜ :
Yanda gördüğünüz gibi buton-5 diğer butonlara tıkladığımızda bile basılı durumdadır.

 

 

 

 

 

 

                          Birden çok butonu aynı yöntem ile seçebilirsiniz : 

 

 

GÖRÜNÜMÜ:

 

  • disabled:true (BUTONU DEVRE DIŞI BIRAKMA):
  1. <head> etiketleri içerisine button <script> kodlarımızı ekliyoruz.

 

 

  1. Daha sonra <body> etiketi içerisine butonumuzu tanımlıyoruz ve devre dışı bırakmak istediğimiz butonun etiketinin arasına disabled:true kodunu ekliyoruz.

GÖRÜNÜMÜ: 

 

 

  • USE OF ICONS (DÜĞMEYE İKON EKLEME) :

    Butonumuza icon eklemek için aşağıdaki kodu kullanacağız :

GÖRÜNÜMÜ :

II.$(selector, context).button (“options”, params) :

Düğme (“eylem”, params) yöntemi, düğmeyi devre dışı bırakma gibi işlemleri gerçekleştirir.

  • Aşağıdaki metodlar bu yöntemle kullanılabilir.
destroy

Bu eylem, bir öğenin düğme işlevini tamamen kaldırır. Öğeler, öntanımlı durumuna geri döner.

disable

Bu eylem, bir öğenin düğme işlevini devre dışı bırakır.

enable

Bu eylem, bir öğenin düğme işlevini etkinleştirir.

option( optionName )

Bu eylem, optionName’de belirtilen seçeneğin değerini alır. OptionName bir String’dir.

option

Bu eylem, geçerli düğme seçenekleri özetini temsil eden anahtar / değer çiftlerini içeren bir nesneyi alır.

option( optionName, value )

Bu eylem belirtilen optionName ile ilişkili düğme seçeneğinin değerini ayarlar.

option( options )

Bu eylem, düğme için bir veya daha fazla seçenek ayarlar.

refresh

Bu eylem, düğmenin ekranını yeniler.

widget

Bu eylem, düğme öğesini içeren bir jQuery nesnesi döndürür.

About Kübra Altın

Bunu da incele

JQUERY UI MENÜ

                              …

Bir Cevap Yazın

E-posta hesabınız yayımlanmayacak. Gerekli alanlar * ile işaretlenmişlerdir

%d blogcu bunu beğendi: