Jquery ui vidjetlar : Datepicker, Dialog. Amaliy ko’rsatmalar

Dialog vidjetini yaratish
Blok darajasidagi elementlarni (odatda divs) dialog oynalariga aylantirish imkonini beruvchi Dialog vidjetini yaratish uchun jQuery bilan elementni tanlang va undagi dialog() usulini chaqiring. Dialog vidjeti toʻgʻri ishlashi uchun HTML elementlarining maʼlum bir tuzilishini talab qiladigan vidjetlardan biridir, garchi bu tuzilma, masalan, Tabs vidjeti talab qilganidan ancha sodda.
Muloqot vidjetini yaratish uchun kerakli elementlar va skriptni o'z ichiga olgan hujjat quyidagi misolda ko'rsatilgan:

Содержимое, которое будет отображаться в диалоговом окне. К этому содержимому могут применяться стили.

Dialog vidjeti sarlavha atributiga ega div elementini talab qiladi. Ushbu atributning qiymati dialog oynasining sarlavhasi sifatida xizmat qiladi. Div elementining mazmuni muloqot oynasida ko'rsatilgan ma'lumot sifatida ishlatiladi va misolda ko'rsatilganidek, boshqa elementlarni o'z ichiga olishi mumkin. Quyidagi misolda bo'lgani kabi dialog() usulini unga hech qanday parametr o'tkazmasdan chaqirish dialog oynasining darhol ochilishiga olib keladi.
Brauzer oynasidagi dialog oynasining ko'rinishi rasmda ko'rsatilgan:

Muloqot oynasi operatsion tizim yordamida emas, balki faqat HTML elementlarining o'ziga xos tuzilishidan foydalangan holda yaratiladi. Bu jQuery UI dialog oynalari odatdagi dialog oynalari kabi harakat qilmasligini anglatadi. Foydalanuvchi ish stolidagi barcha ochiq oynalarni ko'rsatayotganda ular ko'rinmaydi va brauzer oynasining o'lchamini o'zgartirish jQuery UI dialogining bir qismini (yoki butun oynani) yashirishi mumkin.
JQuery UI jamoasi dialog oynasiga mumkin bo'lgan eng keng imkoniyatlarni taqdim etishda ajoyib ish qildi. Foydalanuvchi dialog oynasini sarlavha satrini sudrab, brauzer oynasi ichida siljitishi mumkin. Siz dialog oynasining o'lchamini uning pastki o'ng burchagidagi tutqich tugmasi yordamida o'zgartirishingiz yoki yuqori o'ng burchakdagi yopish tugmasini bosish orqali yopishingiz mumkin. Dialog vidjeti HTML elementlaridan tuzilganligi sababli uning koʻrinishi siz tanlagan jQuery UI mavzusi bilan belgilanadi va u murakkab uslubdagi HTML kontentini oʻz ichiga olishi mumkin.
Ushbu vidjet tomonidan qo'llab-quvvatlanadigan xususiyatlar, usullar va hodisalarni batafsil ko'rib chiqishga o'tishdan oldin, men undan foydalanishning odatiy misolini keltirmoqchiman. Agar dialog() usuli argumentlarsiz chaqirilsa, dialog oynasi ushbu usul o'z ishini tugatgandan so'ng darhol ochiladi. Qoida tariqasida, bu juda qulay emas.
Ko'pgina hollarda, siz hujjat yuklangandan so'ng yaratilgan (lekin element tuzilishi foydalanuvchilarga ko'rinmaydigan tarzda) va keyinchalik ba'zi bir hodisaga javob sifatida ko'rsatilishi mumkin bo'lgan dialog oynasini xohlaysiz. Buni qanday amalga oshirish mumkinligiga misol quyida keltirilgan:

Содержимое, которое будет отображаться в диалоговом окне. К этому содержимому могут применяться стили.

Показать диалоговое окно


Muloqot oynasi darhol ochilishining oldini olish uchun avtomatik ochish opsiyasidan foydalaning. Agar ushbu parametr noto'g'ri bo'lsa, yangi yaratilgan dialog oynasi ko'rinmas qoladi. Uni ko'rsatishga tayyor bo'lgach, ochiq usulni chaqiring.