Penulis: Dflying Chen ( http://dflying.cnblogs.com/ )
Setelah memahami konsep dasar dan menyelesaikan prasyarat (silakan merujuk ke: Mengembangkan kontrol Extender sisi server ASP.NET Atlas - konsep dasar dan prasyarat), kita dapat mulai mengembangkan ValidateUserNameExtender ini.
Pertama, buat Proyek Kontrol Atlas baru di Visual Studio dan beri nama ValidateUserName. Setelah dibuat, solusinya akan terlihat seperti gambar berikut:
Seperti yang Anda lihat, rakitan berikut secara otomatis direferensikan untuk kami di Templat Proyek:
Microsoft.Web.Atlas.dll, yang merupakan rakitan inti Atlas dan akan digunakan oleh Microsoft.AtlasControlExtender.dll berikut.
Microsoft.AtlasControlExtender.dll, ini adalah rakitan tempat kelas dasar Extender di Atlas yang disediakan oleh Microsoft berada.
Pada saat yang sama, Templat Proyek ini juga membuat file JavaScript dan tiga file C# untuk kami:
ValidateUserNameBehavior.js, yang merupakan bagian inti dari Extender kami dan juga merupakan file yang menampung semua skrip sisi klien sama seperti menggunakan ASP.NET Atlas mengembangkan konten file ValidateUserNameBehavior.js dalam Perilaku kustom untuk memverifikasi secara real time apakah nama pengguna terdaftar, yang akan dianalisis secara detail nanti. Atlas' Extender sebenarnya merupakan enkapsulasi dari Behavior sisi klien ini, menjadikannya kontrol sisi server untuk menyederhanakan pekerjaan pengembang program situs web saat menggunakannya. Sebagai pengembang kontrol, ini menambah banyak pekerjaan.
ValidateUserNameDesigner.cs, digunakan di sini untuk menulis kode yang menyediakan dukungan waktu desain di Visual Studio.
ValidateUserNameExtender.cs, digunakan di sini untuk mendefinisikan Extender kami.
ValidateUserNameProperties.cs digunakan untuk mendefinisikan properti yang digunakan di Extender kami. Nilai properti ini akan dipetakan ke properti Perilaku klien.
Mari kita mulai dengan file JavaScript ValidateUserNameBehavior.js. Buka file ValidateUserNameBehavior.js. Kita akan menemukan bahwa Templat telah menambahkan 77 baris kode untuk kita, dan ada banyak TODO dalam kode tersebut kodenya. Langkah pertama:
Buat variabel lokal untuk menyimpan nilai atribut.
Tambahkan variabel lokal ini ke Type Descriptor. Langkah ini agar Atlas memahami kelas Anda.
Tambahkan pengakses (pengambil dan penyetel) ke variabel lokal.
Sebelum memulai langkah 1, kita ubah dulu namespace default di Template sesuai kebutuhan kita. Disini saya menggunakan Dflying.Atlas.ControlTookit.ValidateUserName, dan update semua nama class terkait yang muncul di kode.
Kemudian untuk langkah 1 dan langkah 3 kita lakukan bersama-sama. Lihat ValidateUserNameBehavior.js di Custom Behavior yang menggunakan ASP.NET Atlas untuk mengembangkan verifikasi real-time apakah nama pengguna terdaftar InvalidMessage harus ditambahkan atribut, disini saya hanya memberikan contoh:
var _MethodName;
this.get_MethodName = function() {
kembalikan _NamaMetode;
}
this.set_MethodName = fungsi(nilai) {
jika (_NamaMetode != nilai) {
_NamaMetode = nilai;
this.raisePropertyChanged('NamaMetode');
}
}
Kemudian langkah 2: this.getDescriptor = function() {
var td = Dflying.Atlas.ControlTookit.ValidateUserName.ValidateUserNameBehavior.callBaseMethod(ini, 'getDescriptor');
td.addProperty('CheckResultLabelID', String);
td.addProperty('NamaLayanan', String);
td.addProperty('NamaMetode', String);
td.addProperty('Pesan Valid', String);
td.addProperty('Pesan Tidak Valid', String);
kembali td;
}
Terakhir, ada fungsi konstruktor dan analisis, yang juga muncul di TODO:
this.initialize = function() {
Dflying.Atlas.ControlTookit.ValidateUserName.ValidateUserNameBehavior.callBaseMethod(ini, 'inisialisasi');
_blurHandler = Fungsi.createDelegate(ini, blurHandler);
this.control.element.attachEvent('onblur', _blurHandler);
}
ini.buang = fungsi() {
jika (_blurHandler) {
this.control.element.detachEvent('onblur', _blurHandler);
_blurHandler = nol;
}
Dflying.Atlas.ControlTookit.ValidateUserName.ValidateUserNameBehavior.callBaseMethod(ini, 'buang');
}
Ditambah Handler yang memanggil Layanan Web dan CallBack terkait:
this.initialize = function() {
Dflying.Atlas.ControlTookit.ValidateUserName.ValidateUserNameBehavior.callBaseMethod(ini, 'inisialisasi');
_blurHandler = Fungsi.createDelegate(ini, blurHandler);
this.control.element.attachEvent('onblur', _blurHandler);
}
ini.buang = fungsi() {
jika (_blurHandler) {
this.control.element.detachEvent('onblur', _blurHandler);
_blurHandler = nol;
}
Dflying.Atlas.ControlTookit.ValidateUserName.ValidateUserNameBehavior.callBaseMethod(ini, 'buang');
}
Ada juga bagian Kode yang dihasilkan secara otomatis oleh Templat, yang digunakan untuk menghubungkan interaksi status antara server dan klien. Dalam contoh ini, kita tidak perlu menggunakannya. Tentu saja tidak ada salahnya menyimpannya:
ini.getClientState = fungsi() {
var value = Dflying.Atlas.ControlTookit.ValidateUserName.ValidateUserNameBehavior.callBaseMethod(ini, 'get_ClientState');
jika (nilai == '') nilai = nol;
nilai kembalian;
}
this.setClientState = fungsi(nilai) {
return Dflying.Atlas.ControlTookit.ValidateUserName.ValidateUserNameBehavior.callBaseMethod(ini, 'set_ClientState',[nilai]);
}
Hal terakhir yang perlu diperhatikan adalah baris terakhir JavaScript ini:
Sys.TypeDescriptor.addType('dflying', 'ValidateUserNameBehavior', Dflying.Atlas.ControlTookit.ValidateUserName.ValidateUserNameBehavior);
Diantaranya, dflying mewakili awalan deklarasi kontrol klien yang dihasilkan oleh Extender kami, dan ValidateUserNameBehavior mewakili nama tag kontrol klien. Kedua nama ini harus dipilih dan diingat, dan juga akan digunakan dalam file CS berikut.
Dengan cara ini, source code ValidateUserNameBehavior.js selengkapnya adalah sebagai berikut:
ValidateUserNameBehavior.js
// (c) Hak Cipta Microsoft Corporation.
// Sumber ini tunduk pada Lisensi Permisif Microsoft.
// Lihathttp://www.microsoft.com/resources/sharedsource/licensingbasics/sharedsourcelicenses.mspx .
// Semua hak lainnya dilindungi undang-undang.
Type.registerNamespace('Dflying.Atlas.ControlTookit.ValidateUserName');
Dflying.Atlas.ControlTookit.ValidateUserName.ValidateUserNameBehavior = function() {
Dflying.Atlas.ControlTookit.ValidateUserName.ValidateUserNameBehavior.initializeBase(ini);
var _blurHandler;
var _CheckResultLabelID;
var _checkResultLabel;
var_NamaLayanan;
var_NamaMetode;
var _ValidMessage = "Anda dapat menggunakan nama pengguna ini.";
var _InvalidMessage = "Nama pengguna ini telah digunakan, silakan pilih yang lain.";
this.get_CheckResultLabelID = fungsi() {
kembalikan _CheckResultLabelID;
}
this.set_CheckResultLabelID = fungsi(nilai) {
if (_CheckResultLabelID != nilai) {
_checkResultLabel = $(nilai);
debug.assert(_checkResultLabel != null, "CheckResultLabelID harus disetel ke elemen DOM yang valid.");
_CheckResultLabelID = nilai;
this.raisePropertyChanged('CheckResultLabelID');
}
}
ini.get_ServiceName = fungsi() {
kembalikan _NamaLayanan;
}
this.set_ServiceName = fungsi(nilai) {
jika (_NamaLayanan!= nilai) {
_NamaLayanan = nilai;
this.raisePropertyChanged('NamaLayanan');
}
}
this.get_MethodName = fungsi() {
kembalikan _NamaMetode;
}
this.set_MethodName = fungsi(nilai) {
jika (_NamaMetode != nilai) {
_NamaMetode = nilai;
this.raisePropertyChanged('NamaMetode');
}
}
this.get_ValidMessage = fungsi() {
kembalikan _ValidMessage;
}
this.set_ValidMessage = fungsi(nilai) {
jika (_ValidMessage != nilai) {
_ValidMessage = nilai;
this.raisePropertyChanged('ValidMessage');
}
}
this.get_InvalidMessage = fungsi() {
kembalikan _Pesan Tidak Valid;
}
this.set_InvalidMessage = fungsi(nilai) {
if (_InvalidMessage != nilai) {
_Pesan Tidak Valid = nilai;
this.raisePropertyChanged('Pesan Tidak Valid');
}
}
ini.inisialisasi = fungsi() {
Dflying.Atlas.ControlTookit.ValidateUserName.ValidateUserNameBehavior.callBaseMethod(ini, 'inisialisasi');
_blurHandler = Fungsi.createDelegate(ini, blurHandler);
this.control.element.attachEvent('onblur', _blurHandler);
}
ini.buang = fungsi() {
jika (_blurHandler) {
this.control.element.detachEvent('onblur', _blurHandler);
_blurHandler = nol;
}
Dflying.Atlas.ControlTookit.ValidateUserName.ValidateUserNameBehavior.callBaseMethod(ini, 'buang');
}
ini.getDescriptor = fungsi() {
var td = Dflying.Atlas.ControlTookit.ValidateUserName.ValidateUserNameBehavior.callBaseMethod(ini, 'getDescriptor');
td.addProperty('CheckResultLabelID', String);
td.addProperty('NamaLayanan', String);
td.addProperty('NamaMetode', String);
td.addProperty('Pesan Valid', String);
td.addProperty('Pesan Tidak Valid', String);
kembali td;
}
fungsi blurHandler() {
if (ini.kontrol.elemen.nilai == '') {
_checkResultLabel.innerHTML = '';
kembali;
}
Sys.Net.ServiceMethod.invoke(
_NamaLayanan,
_Nama Metode,
'',
{ userNameCandidate : this.control.element.value},
_onMethodComplete
);
}
fungsi _onMethodComplete(hasil)
{
_checkResultLabel.innerHTML = hasil ? _ValidMessage : _InvalidMessage;
}
ini.getClientState = fungsi() {
var value = Dflying.Atlas.ControlTookit.ValidateUserName.ValidateUserNameBehavior.callBaseMethod(ini, 'get_ClientState');
jika (nilai == '') nilai = nol;
nilai kembalian;
}
this.setClientState = fungsi(nilai) {
return Dflying.Atlas.ControlTookit.ValidateUserName.ValidateUserNameBehavior.callBaseMethod(ini, 'set_ClientState',[nilai]);
}
}
Dflying.Atlas.ControlTookit.ValidateUserName.ValidateUserNameBehavior.registerSealedClass('Dflying.Atlas.ControlTookit.ValidateUserName.ValidateUserNameBehavior', Microsoft.AtlasControlExtender.BehaviorBase);
Sys.TypeDescriptor.addType('dflying', 'ValidateUserNameBehavior', Dflying.Atlas.ControlTookit.ValidateUserName.ValidateUserNameBehavior)
; file.