1. Клієнтський сценарій asp.Net

ASP.NET передбачає два підходи до використання клієнтських можливостей. Перший підхід - використання функцій Ajax платформи ASP.NET. Система Microsoft Ajax включає файли бібліотеки скриптів, що містять функції клієнтських скриптів, що дозволяє використовувати в клієнтських скриптах багато переваг об'єктно-орієнтованого програмування і моделі ASP.NET. Microsoft Ajax також забезпечує серверну підтримку, в тому числі серверні веб-елементи управління, автоматично створюють клієнтські скрипти, необхідні для функціональних можливостей Microsoft Ajax.

Другий підхід - створення клієнтського скрипта і самостійна інтеграція його в веб-сторінки ASP.NET. Цей підходом зручно користуватися, якщо фрагменти клієнтського скрипта дуже невеликі або якщо потрібно інтегрувати існуючий клієнтський скрипт в додаток. Цей підхід використовується багатьма серверними веб-елементами управління ASP.NET (наприклад, елементами перевірки ASP.NET) для додавання клієнтської функціональності.

1.1. Клієнтський сценарій на веб-сторінках asp.Net

Веб-додатки ASP.NET не обмежені серверними інструментами і мовами. У веб-сторінки ASP.NET можна включати ECMAScript (JavaScript або JScript) для створення ефективних веб-додатків. У ASP.NET доступні різноманітні можливості для підтримки клієнтських сценаріїв.

Однією з можливостей є створення і додавання на веб-сторінки ASP.NET окремих фрагментів клієнтських сценаріїв для підтримки необхідного поводження додатка в браузері. Цей підхід є практичним, тільки якщо потрібно додати кілька невеликих частин коду JavaScript, або якщо використовується вже наявний код JavaScript. Такий спосіб також дозволяє зберегти розмір веб-сторінки ASP.NET мінімальним.

Альтернативне рішення - скористатися перевагами функцій AJAX, що надаються ASP.NET. Реалізація AJAX в ASP.NET є закінченою інфраструктуру, що включає:

• Об'єктно-орієнтоване програмування в JavaScript.

• Асинхронна зворотна передача.

• Веб-служби додатків для перевірки автентичності та роботи з профілями.

• Серверні елементи управління, які керують клієнтським сценарієм за допомогою розширених функцій налагодження і трасування.

Застосування можливостей AJAX ASP.NET дозволяє скористатися перевагами JavaScript з меншими витратами на ручне кодування. Вони надають розширені функціональні можливості JavaScript і платформу для створення клієнтської функціональності, інтегровані в ASP.NET.

Оскільки веб-сторінки ASP.NET просто відображають розмітку HTML, на сторінки ASP.NET можна додавати власні клієнтські сценарії. Підтримка сторінками ASP.NET клієнтських сценаріїв визначається можливостями оглядача, що запитує сторінку. Якщо сторінка виконується в браузері на мобільному телефоні або іншому пристрої, ступінь підтримки клієнтських сценаріїв залежить від оглядача.

Існує кілька можливостей включення клієнтських сценаріїв в сторінки ASP.NET:

• Можна включити клієнтський сценарій статично в блок script, що містить код сценарію або використовує атрибут include для посилання на файл JavaScript (з розширенням JS). Використовуйте цей метод для вставки блоків сценарію або файлів JavaScript, що містять клієнтський сценарій, динамічне створення якого не потрібно і який не використовує додаткові функції AJAX (ці функції надає Microsoft AJAX (бібліотека)).

• Можна динамічно створювати і додавати клієнтські сценарії на веб-сторінку ASP.NET за допомогою класу ClientScriptManager. Використовуйте цей метод, якщо потрібно створювати сценарії, які залежать від даних, доступних тільки під час виконання.

• Якщо планується використовувати можливості AJAX ASP.NET, можна управляти файлами клієнтських сценаріїв за допомогою серверного елемента управління ScriptManager. Серверний елемент управління ScriptManager також гарантує, що Microsoft AJAX (бібліотека) завантажується в оглядач перед виконанням сценаріїв.

Можна додавати блоки script на сторінку ASP.NET так само, як і на будь-яку HTML-сторінку. Клієнтський сценарій може реалізовувати обробку подій, наприклад події сторінки onload. Коли сторінка ASP.NET виконується в браузері, елементи розмітки сторінки є доступними з клієнтського сценарію. HTML-елементи викликають відповідні обробники клієнтських подій.

Зберігання клієнтських сценаріїв у зовнішніх JS-файлах, а не в самих сторінках, сприяє поліпшенню організації клієнтських сценаріїв. Завдяки цьому також спрощується управління контролем версій сценаріїв і полегшується спільне використання сценаріїв різними сторінками.

Зовнішні JS-файли кешуються оглядачем так само, як веб-сторінки і зображення. Після завантаження сценарію оглядачем із зовнішнього файлу він доступний в кеші для будь-якої іншої веб-сторінки, яку він буде потрібно. Це підвищує швидкодію веб-додатків.

У більшості випадків клієнтські сценарії створюються для сторінки декларативно, зазвичай у вигляді блоків сценаріїв. Однак можливо і динамічне створення клієнтського сценарію. Це корисно, коли сценарій залежить від інформації, доступної тільки під час виконання. Наприклад, клієнтський сценарій звертається до серверного елементу управління, ім'я (ідентифікатор) якого невідомо до виконання програми, або сценарій залежить від даних, одержуваних від користувача.

Методи класу ClientScriptManager вимагають вказівки типу і ключа, з якими буде асоційований блок сценарію. Вказівка типу допомагає уникнути неоднозначності, якщо і сторінка, і призначені для користувача елементи управління додають блоки сценаріїв на одну і ту ж сторінку. Використання ключа допомагає уникнути дублювання. Якщо викликається один з методів для додавання сценарію, а сценарій з таким ключем і типом вже існує, то цей сценарій повторно доданий не буде.

Якщо використовується AJAX ASP.NET, елемент управління ScriptManager надає можливість додавання файлів сценарію на сторінку - статичних файлів сценаріїв, що зберігаються на диску (з розширенням JS), і файлів сценарію, впроваджених в якості ресурсів в збірку. Файли сценаріїв в цьому елементі управління можна вказати декларативно. Крім того, методи реєстрації елемента управління ScriptManager дозволяють програмно управляти існуючими файлами клієнтських сценаріїв і використовувати сценарії для підтримки часткового оновлення сторінки.

При використанні клієнтських (але не серверних) можливостей AJAX ASP.NET застосовуйте методи класу ClientScriptManager для вставки сценаріїв на веб-сторінку ASP.NET. Наприклад, якщо не використовуєте локалізації для сценаріїв або елемент управління UpdatePanel, то елемент управління ScriptManager не потрібно. Тому не можна викликати його методи для вставки клієнтського сценарію на сторінку. Використання методів класу ClientScriptManager, як правило, більш ефективно, ніж використання методів елемента управління ScriptManager. Це пояснюється тим, що методи класу ClientScriptManager не вимагають додаткової обробки для серверних функцій, підтримуваних елементом управління ScriptManager. Якщо необхідно створити сценарій клієнта динамічно (а не управляти існуючим сценарієм), використовуйте клас ClientScriptManager для вставки клієнтського сценарію на сторінку. Наприклад, використовуйте клас ClientScriptManager, якщо потрібно створити клієнтський сценарій програмними засобами на основі відомостей, доступ до яких неможливий в разі статичного файлу сценарію.

ASP.NET підтримує інфраструктуру AJAX, що дозволяє використовувати клієнтські сценарії для додавання розширених функціональних можливостей до веб-сторінці. До них відносяться асинхронні зворотні передачі, бистрореагірующій призначений для користувача інтерфейс і т.д. Функціональні можливості AJAX реалізує Microsoft AJAX (бібліотека). Вона містить клієнтські сценарії, які використовують не залежать від оглядача технології ECMAScript (JavaScript) і динамічного HTML (DHTML). Функціональність AJAX інтегрована з платформою серверної розробки ASP.NET.

Microsoft AJAX (бібліотека) надає достатній рівень сумісності сценаріїв AJAX для роботи з найбільш поширеними браузерами (включаючи Microsoft Internet Explorer, Mozilla Firefox і Apple Safari). Це дозволяє створювати сценарії, які не залежать від того, в якому з підтримуваних оглядачів вони будуть виконуватися.

Функціональність деяких серверних елементів управління ASP.NET залежить від клієнтських сценаріїв. Наприклад, елемент управління LinkButton вимагає, щоб клієнтський сценарій підтримував зворотну передачу. Клієнтський сценарій, необхідний для серверних веб-елементів управління ASP.NET, додається автоматично на сторінку при її відображенні. Клієнтський сценарій, що генерується для цих елементів управління, не залежить від будь-яких клієнтських сценаріїв, що створюються розробником.

Елементи управління ASP.NET відображаються на сторінці як HTML-елементи. (Якими саме HTML-елементами представляється елемент управління, визначається мовою розмітки для сторінки - HTML, XHTML або іншою мовою.) Тому можна додавати клієнтський сценарій обробки подій для елементів управління, як і для будь-яких HTML-елементів на сторінці. Однак в деяких випадках необхідно знати, яким саме чином інтерпретується елемент управління і які атрибути елемент управління резервує для себе.

Якщо додати атрибут, який не відображається на якесь властивість елемента керування, ASP.NET під час обробки сервером проігнорує цей атрибут. Він передається без змін як частина розмітки, що генерується елементом управління для оглядача. Наприклад, елемент управління TextBox не має властивості з ім'ям onkeyup. Тому, якщо включити атрибут onkeyup в розмітку для елемента управління TextBox, цей атрибут буде переданий в оглядач. Така поведінка дозволяє додавати прив'язку подій до серверних елементів управління шляхом оголошення їх в розмітці.

При відображенні серверного елемента управління ASP.NET властивість ClientID елемента управління інтерпретується на сторінці як атрибути id і name кінцевого елемента. (Значення властивості ClientID автоматично генерується з властивості ID.)

Таким чином, використання цих атрибутів дозволяє звертатися до серверного елемент управління з клієнтського сценарію. Звернення до елементу управління з клієнтського сценарію зазвичай виконується по повній посиланням на цей елемент.

Точний синтаксис, необхідний для доступу до серверного елементу управління, визначається тим, який елемент управління використовується, і тим, чи є він дочірнім по відношенню до іншого елемента керування. Якщо немає впевненості в тому, як слід звертатися до елементу управління, можна запустити сторінку, подивитися її вихідний код і визначити, як саме елемент управління був інтерпретований.

Деякі елементи управління відображають на сторінці дочірні елементи управління. До таких елементів належать елементи управління списками даних, наприклад ListView, GridView, DetailsView, FormView, DataList і Repeater, а також призначені для користувача елементи управління і веб-частини.

У цих випадках дочірні елементи управління можуть не мати унікальних ідентифікаторів, тому що вони визначені в шаблоні, який створює нові екземпляри елементів управління для кожного рядка даних (елементи управління списками даних), або тому, що батьківський елемент управління доданий на сторінку з зовнішнього джерела ( призначені для користувача елементи управління і веб-частини). Тому ці батьківські елементи управління є контейнерами іменування (вони реалізують інтерфейс INamingContainer). Контейнер іменування гарантує, що його дочірні елементи управління мають унікальні ідентифікатори на сторінці.

Наприклад, нехай в елементі управління DataList створено властивість ItemTemplate, а в шаблон доданий елемент управління CheckBox, ідентифікатор якого встановлений в checkEnabled. При інтерпретації елемента DataList, для кожного елемента даних створюється новий елемент управління checkEnabled. Видима сторінка не повинна містити кілька примірників елементів з ім'ям checkEnabled. Тому елемент управління DataList створює унікальний ідентифікатор для кожного з дочірніх елементів управління.

Якщо відобразити сторінку, яка містить контейнер іменування, в браузері, можна відкрити вихідний код сторінки і переглянути унікальні ідентифікатори, згенеровані як атрибути name і id для дочірніх елементів контейнера іменування. Однак не рекомендується використовувати безпосереднє звернення до елементів за допомогою ідентифікаторів, що містяться в вихідному коді, тому що формула, яка використовується для генерації унікальних ідентифікаторів для дочірніх елементів управління, може змінитися. Замість цього в серверному коді отримуйте значення властивості ClientID дочірнього елемента управління і використовуйте його для звернення до дочірньому елементу управління. Наприклад, нехай на сторінці динамічно створений клієнтський сценарій. Якщо клієнтський сценарій звертається до дочірньому елементу управління, отримаєте властивість ClientID дочірнього елемента управління і використовуйте його в динамічному сценарії.

Як було зазначено раніше, можна додати клієнтське подія клацання в більшість серверних елементів управління ASP.NET шляхом додавання атрибута onclick в розмітку елемента управління. Однак деякі елементи управління резервують атрибут onclick для прив'язки до серверного події. Це відноситься до елементів управління Button, LinkButton і ImageButton. У цих елементах управління для додавання обробника клієнтського сценарію до елементу управління можна використовувати атрибут onclick декларативно.

Крім використання стандартних зворотних передач, веб-сторінки ASP.NET можуть організовувати взаємодію між клієнтським сценарієм і серверним кодом декількома способами. Такі серверні елементи управління з підтримкою AJAX в ASP.NET, як UpdatePanel, автоматизують завдання асинхронного часткового оновлення сторінки. Крім того, AJAX ASP.NET підтримує виклик веб-служб в асинхронному режимі.

Якщо не використовувати можливості AJAX ASP.NET, можна виконувати зворотні виклики клієнта безпосередньо і обмінюватися даними між браузером і сервером різноманітними методами. У наступному підрозділі містяться відомості про доступні методи.

Клієнтський сценарій може викликати серверний код безпосередньо шляхом реалізації зворотного виклику клієнта. У стандартній послідовності дій для веб-сторінок ASP.NET кожна дія користувача, що ініціює виконання серверного коду, вимагає зворотної передачі. Проте, також можна ініціювати з оглядача обробку на сервері без виконання повної зворотної передачі. В цьому випадку оглядач не подає на сервер запит на повне перезавантаження сторінки. Замість цього оглядач посилає на сервер невеликий об'єм даних. Коли сервер відправляє відповідь, клієнтський сценарій в браузері обробляє отримані дані без перезавантаження сторінки. Під час серверної обробки стан клієнта (наприклад, локальні змінні) зберігається. Цей процес називається асинхронної зворотного передачею і є ключовим при частковій відображенні сторінки.

Можна розділяти дані між клієнтським сценарієм і серверним кодом, додавши на сторінку елемент управління HiddenField, і звертатися до прихованого полю за його ідентифікатором і в клієнтському сценарії, і в серверному коді. Це дозволить зберігати значення в одному блоці коду і зачитувати їх в іншому. Для передачі інформації з серверного коду клієнтського сценарієм можна створити приховане поле програмно за допомогою методу RegisterHiddenField. Цей метод дозволяє вказати ідентифікатор і значення поля. Можна використовувати поле для зберігання динамічних значень на сторінці, щоб клієнтський сценарій міг зачитати їх.

При використанні можливостей AJAX ASP.NET можна відправити призначені для користувача дані у вигляді рядка від сервера до клієнта при виконанні асинхронних повторних передач (часткової відображенні сторінки) за допомогою методу RegisterDataItem. Метод RegisterDataItem дозволяє використовувати серверний код для реєстрації поля, яке приєднується до елементу управління. Значення цього поля є в клієнтському сценарії за допомогою об'єктів AJAX ASP.NETSys.WebForms.PageLoadingEventArgs, Sys.WebForms.PageLoadedEventArgs і Sys.WebForms.PageLoadedEventArgs. Метод RegisterDataItem можна викликати тільки під час асинхронної зворотної передачі.

Клієнтські компоненти - це об'єкти багаторазового використання, які інкапсулюють JavaScript і в основі яких лежить Microsoft AJAX (бібліотека). Ця бібліотека надає наступні базові клієнтські класи: Component (базовий клас для невізуальних компонентів), Control і Behavior.

Будь яка існуюча або призначений для користувача серверний елемент управління ASP.NET може бути перетворений в керуючий елемент-розширювач AJAX ASP.NET. Елемент розширення є серверним веб-елементом управління, який використовує можливості оглядача ECMAScript (JavaScript), DHTML і AJAX для додавання таких функцій, як інтерактивність і асинхронне взаємодія з сервером.

Функціональні можливості деяких серверних елементів управління ASP.NET залежать від клієнтського сценарію. Крім того, від клієнтського сценарію залежать також і деякі функціональні можливості сторінок ASP.NET. Корисно знати, яким чином елементи управління і сторінки ASP.NET використовують клієнтський сценарій, щоб розуміти, як відмінності в підтримці оглядачами клієнтських сценаріїв можуть впливати на веб-сторінки ASP.NET.