การควบคุมซีรีส์ AjaxControlToolkit ที่เปิดตัวพร้อมกับ Asp.net Ajax 1.0 ได้มอบความสะดวกสบายให้กับนักพัฒนาเป็นอย่างมาก แต่การควบคุมหลายอย่างดูเหมือนจะไม่สมบูรณ์แบบเท่าที่เราจินตนาการไว้ ฉันใช้การควบคุมการทำให้สมบูรณ์อัตโนมัติบ่อยครั้งเมื่อเร็วๆ นี้ และพบข้อบกพร่องหรือข้อผิดพลาดหลายประการ:
1. ในบางกรณี ข้อผิดพลาด "สององค์ประกอบที่มีรหัสเดียวกัน" จะเกิดขึ้น
2. ง่ายต่อการทำให้เกิดปัญหา "ไม่สามารถเปิดเว็บไซต์อินเทอร์เน็ต,..., การดำเนินการถูกยกเลิก" ใน IE;
3. แม้ว่าผู้ใช้จะป้อนอักขระจำนวนมาก แม้ว่าจะไม่มีผลลัพธ์ที่ตรงกัน ก็จะยังคงเรียกเมธอดเซิร์ฟเวอร์เพื่อพยายามรับค่าที่ตรงกัน ซึ่งจะเพิ่มภาระบนเซิร์ฟเวอร์โดยเปล่าประโยชน์
4. รูปแบบของรายการเติมข้อความอัตโนมัติไม่ค่อยดีนัก
5. ลายเซ็นของวิธีการเซิร์ฟเวอร์ต้องเป็น: string[] GetCompletionList(string prefixText, int count) ไม่สามารถรับข้อมูลที่จำเป็นอื่น ๆ จากไคลเอนต์ได้ กรณีนี้เป็นอันตรายอย่างยิ่งเมื่อมีตัวควบคุมการทำให้สมบูรณ์อัตโนมัติหลายตัวในเพจที่ต้องการรับข้อมูลจากแหล่งข้อมูลที่แตกต่างกัน
เพื่อแก้ไขปัญหาเหล่านี้ ก่อนอื่นคุณต้องรู้วิธีแก้ไขโค้ดที่เกี่ยวข้องและทำให้โค้ดมีประสิทธิภาพในแอปพลิเคชันของคุณเอง โชคดีที่ชุดควบคุม AjaxControlToolkit เป็นโอเพ่นซอร์ส ดังนั้นเราจึงสามารถปรับเปลี่ยนได้ตามความต้องการของเรา เปิดโซลูชัน AjaxControlToolkit ด้วย VS2005 เปิดไฟล์ AutoCompleteBehavior.js ในโฟลเดอร์ AutoComplete แก้ไขและคอมไพล์ใหม่ และอัปเดตไฟล์ AjaxControlToolkit.dll ที่สร้างขึ้นเป็นการอ้างอิงโปรเจ็กต์ของคุณเองเพื่อใช้การควบคุมการทำให้สมบูรณ์อัตโนมัติที่ได้รับการปรับปรุงและเพิ่มประสิทธิภาพของเรา
แล้วต้องแก้ไขโค้ดอะไรเป็นพิเศษ?
สำหรับคำถามแรก คุณต้องเพิ่มหน้าบรรทัด AjaxControlToolkit.AutoCompleteBehavior.callBaseMethod(this, 'dispose');:
ถ้า (this._popupBehavior) {
this._popupBehavior.dispose();
this._popupBehavior = โมฆะ;
-
คำถามที่สองคือการเปลี่ยนบรรทัด 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 ตัวอักษร จะไม่มี จำเป็นต้องเรียกเซิร์ฟเวอร์เพื่ออ่านค่าที่ตรงกัน
คำถามที่สี่ ในการปรับรูปแบบของรายการเติมข้อความอัตโนมัติ คุณสามารถแก้ไขโค้ดต่อไปนี้ได้โดยตรงในเมธอด InitializeCompletionList:
เสร็จสิ้นรายการสไตล์.พื้นหลังสี = this._textBackground;
completeListStyle.color = this._textColor;
completeListStyle.border = 'ปุ่มเงาขนาด 1px ทึบ';
completeListStyle.cursor = 'ค่าเริ่มต้น';
completeListStyle.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 ข้อมูลสามารถอ่านได้ในลักษณะที่เป็นเป้าหมายตามค่าพารามิเตอร์ที่ส่งผ่านโดยไคลเอนต์