لقد وفرت عناصر التحكم في سلسلة AjaxControlToolkit التي تم إصدارها مع Asp.net Ajax 1.0 الكثير من الراحة للمطورين، ولكن لا يبدو أن الكثير منها مثالي كما تخيلنا. لقد كنت أستخدم عنصر تحكم الإكمال التلقائي كثيرًا مؤخرًا ووجدت العديد من أوجه القصور أو الأخطاء:
1. في بعض الحالات، سيحدث الخطأ "مكونان لهما نفس المعرف"؛
2. من السهل التسبب في مشكلة "تعذر فتح موقع الإنترنت،...، تم إنهاء العملية" في IE؛
3. حتى إذا قام المستخدم بإدخال الكثير من الأحرف، حتى لو لم تكن هناك نتيجة مطابقة، فسوف يستمر في استدعاء طريقة الخادم لمحاولة الحصول على قيمة المطابقة، مما يزيد العبء على الخادم دون جدوى؛
4. أسلوب قائمة الإكمال التلقائي ليس لطيفًا جدًا؛
5. يجب أن يكون توقيع طريقة الخادم: string[] GetCompletionList(string prefixText, int count) ولا يمكن الحصول على البيانات المطلوبة الأخرى من العميل. يعد هذا أمرًا خطيرًا بشكل خاص عندما تكون هناك عناصر تحكم متعددة للإكمال التلقائي في الصفحة والتي تحتاج إلى الحصول على البيانات من مصادر بيانات مختلفة.
لحل هذه المشكلات، عليك أولاً معرفة كيفية تعديل الكود المقابل وجعله فعالاً في تطبيقك الخاص. ولحسن الحظ، فإن عناصر التحكم في سلسلة AjaxControlToolkit مفتوحة المصدر، لذا يمكننا تعديلها وفقًا لاحتياجاتنا الخاصة. افتح حل AjaxControlToolkit باستخدام VS2005، وافتح ملف AutoCompleteBehavior.js في مجلد الإكمال التلقائي، وقم بتعديل وإعادة ترجمة، وتحديث ملف AjaxControlToolkit.dll الذي تم إنشاؤه إلى مرجع المشروع الخاص بك لتطبيق عنصر التحكم في الإكمال التلقائي المحسّن والمحسّن.
إذًا، ما هو الكود المحدد الذي يحتاج إلى تعديل؟
بالنسبة للسؤال الأول، تحتاج إلى إضافة قبل السطر AjaxControlToolkit.AutoCompleteBehavior.callBaseMethod(this, 'dispose');:
إذا (هذا._popupBehavior) {
this._popupBehavior.dispose();
this._popupBehavior = null;
}
السؤال الثاني هو تغيير السطر document.body.appendChild(this._completionListElement); إلى element.parentNode.appendChild(this._completionListElement);
السؤال الثالث هو استخدام if (text.trim().length < this._minimumPrefixLength ) يضيف هذا الحكم شرطًا ويصبح: if (text.trim().length < this._minimumPrefixLength || text.trim(). length > 10) ، مما يجعل، عندما يتجاوز إدخال المستخدم 10 أحرف، لا يوجد تحتاج إلى الاتصال بالخادم لقراءة القيمة المطابقة.
السؤال الرابع، لضبط نمط قائمة الإكمال التلقائي، يمكنك تعديل الكود التالي مباشرة في طريقة التهيئة CompletionList:
CompleteListStyle.backgroundColor = this._textBackground;
CompleteListStyle.color = this._textColor;
CompleteListStyle.border = 'solid 1px Buttonshadow';
CompleteListStyle.cursor = 'افتراضي'؛
CompleteListStyle.unselectable = 'unselectable';
CompleteListStyle.overflow = 'hidden'؛
أو احذف هذه الأسطر وأضف: element.className = "completionList"؛ ثم أضف تعريف فئة النمط "completionList" في الصفحة
لحل المشكلة الأخيرة، ويجب أن يكون في { prefixText: this._currentPrefix, count: this._completionSetCount} أضف معلمة مرسلة إلى الخادم في هذا السطر، والتي تصبح:
{ prefixText: this._currentPrefix، العد: this._completionSetCount، srcId: this.get_element().getAttribute("srcid") }
لذلك، يمكن كتابة توقيع الأسلوب من جانب الخادم لقراءة عناصر قائمة الإكمال التلقائي على النحو التالي: string[] GetCompletionList(string prefixText, int count, string srcId). هذا يعني أنه يمكننا تعيين سلسلة تعريف مسبقًا لتحديد مصدر البيانات الخاص بها لمربع النص الذي يحتاج إلى تطبيق وظيفة الإكمال التلقائي، ويكون رمز C# مثل: tb.Attributes.Add("srcid", "xxx" ); ثم، في طريقة GetCompletionList، يمكن قراءة البيانات بطريقة مستهدفة بناءً على قيمة المعلمة التي تم تمريرها من قبل العميل.