YUI Class AutoComplete : สอน method และ property ของ Class AutoComplete, เรียน method และ property ของ Class AutoComplete
 

Reference

Reference ในเว็บไซต์ Function.in.th เป็นการนำเสนอความรู้ในรูปแบบของแหล่งอ้างอิงของคำสั่งต่าง ๆ ที่ใช้ในการเขียนโปรแกรม โดยผู้ที่สนใจสามารถเข้ามาเรียนรู้การใช้งานคำสั่งของการเขียนโปรแกรมเหล่านี้ได้ ผ่านทาง URL code.function.in.th ทั้งนี้ผู้อ่านยังสามารถร่วมแสดงความคิดเห็นบนเนื้อหาที่มีสอนได้ ซึ่งถือเป็นการส่งเสริมให้มีการแลกเปลี่ยนประสบการณ์และความรู้ระหว่างผู้อ่านด้วยกันเอง
  • YAHOO.widget.AutoComplete ( element_input, element_container, objectDataSource, objectConfigs ) ใช้สร้าง Object AutoComplete
    alwaysShowContainer ใช้กำหนดค่า หรือคืนค่า ว่าต้องการให้ แสดง container ตอลดเวลาใช่หรือไม่ ( default = false )
    animHoriz ใช้กำหนดค่า หรือคืนค่า ว่าต้องการให้ container ที่จะแสดงขึ้นมา ให้แสดงขึ้นมา ในลักษณะแนวนอน ใช่หรือไม่ ( default = false )
    animVert ใช้กำหนดค่า หรือคืนค่า ว่าต้องการให้ container ที่จะแสดงขึ้นมา ให้แสดงขึ้นมาใน ลักษณะแนวตั้ง ใช่หรือไม่ ( default = true )
    animSpeed ใช้กำหนดค่า หรือคืนค่า ความเร็ว ที่จะให้ container แสดงขึ้นมา หน่วยวินาที ( default = 0.3 )
    autoHighlight ใช้กำหนดค่า หรือคืนค่า ว่าต้องการให้ container มี highlight โดยอัติโนมัติหรือไม่
    dataSource ใช้กำหนดค่า หรือคืนค่า Object DataSoruce ที่เป็นข้อมูลของการแสดง autocomplete
    delimChar ใช้กำหนดค่า หรือคืนค่า ตัวแบ่ง ในกรณีที่มีการเลือกข้อมูล จาก autocomplete มามากกว่า 1 ข้อมูล
    forceSelection ใช้กำหนดค่า หรือคืนค่า ว่าไม่สามารถกรอกข้อมูลที่นอกเหนือจาก autocomplete ใช่หรือไม่
    highlightClassName ใช้กำหนดค่า หรือคืนค่า class ที่เป็นการกำหนด ลักษณะ highlight ของ item ใน container
    prehighlightClassName ใช้กำหนดค่า หรือคืนค่า class ที่เป็นการกำหนด ลักษณะของ item ใน container
    maxResultsDisplayed ใช้กำหนดค่า หรือคืนค่า จำนวนสูงสุด ที่จะแสดง item บน container ( default = 10 )
    minQueryLength ใช้กำหนดค่า หรือคืนค่า จำนวนสูงสุด ที่จะแสดง item บน container ( default = 1 )
    queryDelay ใช้กำหนดค่า หรือคืนค่า การหน่วงเวลา ก่อนที่จะแสดง container ขึ้นมา หน่วยวินาที ( default = 0.2 )
    queryMatchCase ใช้กำหนดค่า หรือคืนค่า ว่าการตรวจสอบข้อมูลระหว่าง ข้อมูลที่กรอก กับข้อมูลใน autocomplete สนใจ ตัวพิมพ์เล็กหรือตัวพิมพ์ใหญ่หรือไม่
    useShadow ใช้กำหนดค่า หรือคืนค่า ว่าต้องการให้มี เงา ตรง container หรือไม่ ( default = false )
    clearList() ใช้กำหนดให้ ล้างข้อมูล ใน container
    collapseContainer() ใช้กำหนดให้ container พับลง คือ ปิดไป
    destroy() ใช้กำหนดให้ ทำลาย Object AutoComplete
    expandContainer() ใช้กำหนดให้ container แผ่ออก คือ เปิดขึ้น
    getContainerEI() ใช้คืนค่า Dom Element ที่ใช้เป็น container
    getInputEI() ใช้คืนค่า Dom Element ที่ใช้เป็น text
    getListEI() ใช้คืนค่า item ของ container โดยจะคืนมาในลักษณะ Dom Element ของ tag ul
    isContainerOpen() ใช้ตรวจสอบว่า contaner ถูกแสดงอยู่ ( expanded ) ใช่หรือไม่
    isFocused() ใช้ตรวจสอบว่า autocomplete กำลังได้รับ focus อยู่ ใช่หรือไม่
    containerCollapseEvent() เป็นการกำหนดให้ function ทำงาน เมื่อ container ถูกปิดการใช้งาน
    containerExpandEvent() เป็นการกำหนดให้ function ทำงาน เมื่อ container ถูกแสดงออกมา
    containerPopulateEvent() เป็นการกำหนดให้ function ทำงาน เมื่อ container ถูก populate
    itemArrowFromEvent() เป็นการกำหนดให้ function ทำงาน เมื่อ focus การออกจาก item ใน container
    itemArrowToEvent() เป็นการกำหนดให้ function ทำงาน เมื่อ focus การเข้าไปใน item ใน container
    itemMouseOutEvent() เป็นการกำหนดให้ function ทำงาน เมื่อ mouse ออกจาก item ใน container
    itemMouseOverEvent() เป็นการกำหนดให้ function ทำงาน เมื่อ mouse อยู่เหนือ item ใน container
    itemSelectEvent() เป็นการกำหนดให้ function ทำงาน เมื่อ มีการเลือก item ใน container
    textboxBlurEvent() เป็นการกำหนดให้ function ทำงาน เมื่อ textbox สูบเสีย focus
    textboxChangeEvent() เป็นการกำหนดให้ function ทำงาน เมื่อมีการเปลี่ยนแปลงข้อมูลใน textbox
    textboxFocusEvent() เป็นการกำหนดให้ function ทำงาน เมื่อ textbox ได้รับ focus
    textboxKeyEvent() เป็นการกำหนดให้ function ทำงาน เมื่อมีการกดปุ่มลงบน textbox
  • method :
    YAHOO.widget.AutoComplete ( element_input, element_container, objectDataSource, objectConfigs )

    return type :
    AutoComplete

    content :
    ใช้สร้าง Object AutoComplete

    example :
    YAHOO.example.Data.arrayStates = [ "Alabama", "Alaska", "Arizona", "Arkansas" ]; 
    YAHOO.example.BasicLocal = function () 
    { 
         var oDS = new YAHOO.util.LocalDataSource( YAHOO.example.Data.arrayStates ); 
         oDS.responseSchema = { fields : ["state"] }; 
         
         var oAC = new YAHOO.widget.AutoComplete ( "myInput", "myContainer", oDS ); 
         oAC.prehighlightClassName = "yui-ac-prehighlight"; 
         oAC.useShadow = true; 
     
         return { oDS: oDS, oAC: oAC }; 
    }(); 

    comment :
    ตัวแปร element_input คือ id ของ tag input หรือ dom element input
    ตัวแปร element_container คือ id ของ div container หรือ dom element div 
    ตัวแปร objectDataSource คือ object จาก Yahoo.widget.DataSource

  • property :
    alwaysShowContainer

    return type :
    void, boolean

    content :
    ใช้กำหนดค่า หรือคืนค่า ว่าต้องการให้ แสดง container ตอลดเวลาใช่หรือไม่ ( default = false )

    example :
    YAHOO.example.Data.arrayStates = [ "Alabama", "Alaska", "Arizona", "Arkansas" ]; 
    YAHOO.example.BasicLocal = function () 
    { 
         var oDS = new YAHOO.util.LocalDataSource( YAHOO.example.Data.arrayStates ); 
         oDS.responseSchema = { fields : ["state"] }; 
         
         var oAC = new YAHOO.widget.AutoComplete ( "myInput", "myContainer", oDS ); 
         oAC.alwaysShowContainer = true; 
     
         return { oDS: oDS, oAC: oAC }; 
    }(); 

  • property :
    animHoriz

    return type :
    void, boolean

    content :
    ใช้กำหนดค่า หรือคืนค่า ว่าต้องการให้ container ที่จะแสดงขึ้นมา ให้แสดงขึ้นมา
    ในลักษณะแนวนอน ใช่หรือไม่ ( default = false )

    example :
    YAHOO.example.Data.arrayStates = [ "Alabama", "Alaska", "Arizona", "Arkansas" ]; 
    YAHOO.example.BasicLocal = function () 
    { 
         var oDS = new YAHOO.util.LocalDataSource( YAHOO.example.Data.arrayStates ); 
         oDS.responseSchema = { fields : ["state"] }; 
         
         var oAC = new YAHOO.widget.AutoComplete ( "myInput", "myContainer", oDS ); 
         oAC.animHoriz = true; 
     
         return { oDS: oDS, oAC: oAC }; 
    }(); 

  • property :
    animVert

    return type :
    void, boolean

    content :
    ใช้กำหนดค่า หรือคืนค่า ว่าต้องการให้ container ที่จะแสดงขึ้นมา ให้แสดงขึ้นมาใน
    ลักษณะแนวตั้ง ใช่หรือไม่ ( default = true )

    example :
    YAHOO.example.Data.arrayStates = [ "Alabama", "Alaska", "Arizona", "Arkansas" ]; 
    YAHOO.example.BasicLocal = function () 
    { 
         var oDS = new YAHOO.util.LocalDataSource( YAHOO.example.Data.arrayStates ); 
         oDS.responseSchema = { fields : ["state"] }; 
         var oAC = new YAHOO.widget.AutoComplete ( "myInput", "myContainer", oDS ); 
         oAC.animVert = true; 
         return { oDS: oDS, oAC: oAC }; 
    }(); 

  • property :
    animSpeed

    return type :
    void, number

    content :
    ใช้กำหนดค่า หรือคืนค่า ความเร็ว ที่จะให้ container แสดงขึ้นมา 
    หน่วยวินาที ( default = 0.3 )

    example :
    YAHOO.example.Data.arrayStates = [ "Alabama", "Alaska", "Arizona", "Arkansas" ]; 
    YAHOO.example.BasicLocal = function () 
    { 
         var oDS = new YAHOO.util.LocalDataSource( YAHOO.example.Data.arrayStates ); 
         oDS.responseSchema = { fields : ["state"] }; 
         var oAC = new YAHOO.widget.AutoComplete ( "myInput", "myContainer", oDS ); 
         oAC.animSpeed = 0.8; 
         return { oDS: oDS, oAC: oAC }; 
    }(); 

  • property :
    autoHighlight

    return type :
    void, boolean

    content :
    ใช้กำหนดค่า หรือคืนค่า ว่าต้องการให้ container มี highlight โดยอัติโนมัติหรือไม่ ( default = true )
    คือลักษณะของ highlight จะเป็นลักษณะตามค่าเริ่มต้น

    example :
    YAHOO.example.Data.arrayStates = [ "Alabama", "Alaska", "Arizona", "Arkansas" ]; 
    YAHOO.example.BasicLocal = function () 
    { 
         var oDS = new YAHOO.util.LocalDataSource( YAHOO.example.Data.arrayStates ); 
         oDS.responseSchema = { fields : ["state"] }; 
         var oAC = new YAHOO.widget.AutoComplete ( "myInput", "myContainer", oDS ); 
         oAC.autoHighlight = true; 
         return { oDS: oDS, oAC: oAC }; 
    }(); 

  • property :
    dataSource

    return type :
    void, Yahoo.widget.DataSource

    content :
    ใช้กำหนดค่า หรือคืนค่า Object DataSoruce ที่เป็นข้อมูลของการแสดง autocomplete

    example :
    YAHOO.example.Data.arrayStates = [ "Alabama", "Alaska", "Arizona", "Arkansas" ]; 
    YAHOO.example.BasicLocal = function () 
    { 
         var oDS = new YAHOO.util.LocalDataSource( YAHOO.example.Data.arrayStates ); 
         oDS.responseSchema = { fields : ["state"] }; 
         var oAC = new YAHOO.widget.AutoComplete ( "myInput", "myContainer", oDS ); 
         oAC.dataSource = YAHOO.example.Data.arrayStates; 
         return { oDS: oDS, oAC: oAC }; 
    }(); 

  • property :
    delimChar

    return type :
    void, String

    content :
    ใช้กำหนดค่า หรือคืนค่า ตัวแบ่ง ในกรณีที่มีการเลือกข้อมูล จาก autocomplete
     มามากกว่า 1 ข้อมูล ( default = "" )

    example :
    YAHOO.example.Data.arrayStates = [ "Alabama", "Alaska", "Arizona", "Arkansas" ]; 
    YAHOO.example.BasicLocal = function () 
    { 
         var oDS = new YAHOO.util.LocalDataSource( YAHOO.example.Data.arrayStates ); 
         oDS.responseSchema = { fields : ["state"] }; 
         var oAC = new YAHOO.widget.AutoComplete ( "myInput", "myContainer", oDS ); 
         oAC.delimChar = ", "; 
         return { oDS: oDS, oAC: oAC }; 
    }(); 

  • property :
    forceSelection

    return type :
    void, boolean

    content :
    ใช้กำหนดค่า หรือคืนค่า ว่าไม่สามารถกรอกข้อมูลที่นอกเหนือจาก autocomplete ใช่หรือไม่ ( default = false )
    คือถ้าหากว่าได้พิมพ์ข้อมูลที่นอกเหนือจากนั้น สุดท้ายแล้วข้อมูลก็จะถูกเปลี่ยนมาเป็นข้อมูลที่ใกล้เคียงกับ 
    autocomplete มากที่สุด

    example :
    YAHOO.example.Data.arrayStates = [ "Alabama", "Alaska", "Arizona", "Arkansas" ]; 
    YAHOO.example.BasicLocal = function () 
    { 
         var oDS = new YAHOO.util.LocalDataSource( YAHOO.example.Data.arrayStates ); 
         oDS.responseSchema = { fields : ["state"] }; 
         var oAC = new YAHOO.widget.AutoComplete ( "myInput", "myContainer", oDS ); 
         oAC.forceSelection = true; 
         return { oDS: oDS, oAC: oAC }; 
    }(); 

  • property :
    highlightClassName

    return type :
    void, String

    content :
    ใช้กำหนดค่า หรือคืนค่า class ที่เป็นการกำหนด ลักษณะ highlight ของ item ใน 
    container ( default = "yui-ac-highlight" )

    example :
    YAHOO.example.Data.arrayStates = [ "Alabama", "Alaska", "Arizona", "Arkansas" ]; 
    YAHOO.example.BasicLocal = function () 
    { 
         var oDS = new YAHOO.util.LocalDataSource( YAHOO.example.Data.arrayStates ); 
         oDS.responseSchema = { fields : ["state"] }; 
         var oAC = new YAHOO.widget.AutoComplete ( "myInput", "myContainer", oDS ); 
         oAC.highlightClassName = "my-highlight-item"; 
         return { oDS: oDS, oAC: oAC }; 
    }(); 

  • property :
    prehighlightClassName

    return type :
    void, String

    content :
    ใช้กำหนดค่า หรือคืนค่า class ที่เป็นการกำหนด ลักษณะของ item ใน container

    example :
    YAHOO.example.Data.arrayStates = [ "Alabama", "Alaska", "Arizona", "Arkansas" ]; 
    YAHOO.example.BasicLocal = function () 
    { 
         var oDS = new YAHOO.util.LocalDataSource( YAHOO.example.Data.arrayStates ); 
         oDS.responseSchema = { fields : ["state"] }; 
         var oAC = new YAHOO.widget.AutoComplete ( "myInput", "myContainer", oDS ); 
         oAC.prehighlightClassName = "my-pre-highlight-item"; 
         return { oDS: oDS, oAC: oAC }; 
    }(); 

  • property :
    maxResultsDisplayed

    return type :
    void, number

    content :
    ใช้กำหนดค่า หรือคืนค่า จำนวนสูงสุด ที่จะแสดง item บน container ( default = 10 )

    example :
    YAHOO.example.Data.arrayStates = [ "Alabama", "Alaska", "Arizona", "Arkansas" ]; 
    YAHOO.example.BasicLocal = function () 
    { 
         var oDS = new YAHOO.util.LocalDataSource( YAHOO.example.Data.arrayStates ); 
         oDS.responseSchema = { fields : ["state"] }; 
         var oAC = new YAHOO.widget.AutoComplete ( "myInput", "myContainer", oDS ); 
         oAC.maxResultsDisplayed = 20; 
         return { oDS: oDS, oAC: oAC }; 
    }(); 

  • property :
    minQueryLength

    return type :
    void, number

    content :
    ใช้กำหนดค่า หรือคืนค่า จำนวนสูงสุด ที่จะแสดง item บน container ( default = 1 )

    example :
    YAHOO.example.Data.arrayStates = [ "Alabama", "Alaska", "Arizona", "Arkansas" ]; 
    YAHOO.example.BasicLocal = function () 
    { 
         var oDS = new YAHOO.util.LocalDataSource( YAHOO.example.Data.arrayStates ); 
         oDS.responseSchema = { fields : ["state"] }; 
         var oAC = new YAHOO.widget.AutoComplete ( "myInput", "myContainer", oDS ); 
         oAC.minQueryLength = 5; 
         return { oDS: oDS, oAC: oAC }; 
    }(); 

  • property :
    queryDelay

    return type :
    void, number

    content :
    ใช้กำหนดค่า หรือคืนค่า การหน่วงเวลา ก่อนที่จะแสดง container 
    ขึ้นมา หน่วยวินาที ( default = 0.2 )

    example :
    YAHOO.example.Data.arrayStates = [ "Alabama", "Alaska", "Arizona", "Arkansas" ]; 
    YAHOO.example.BasicLocal = function () 
    { 
         var oDS = new YAHOO.util.LocalDataSource( YAHOO.example.Data.arrayStates ); 
         oDS.responseSchema = { fields : ["state"] }; 
         var oAC = new YAHOO.widget.AutoComplete ( "myInput", "myContainer", oDS ); 
         oAC.queryDelay = 0; 
         return { oDS: oDS, oAC: oAC }; 
    }(); 

  • property :
    queryMatchCase

    return type :
    void, boolean

    content :
    ใช้กำหนดค่า หรือคืนค่า ว่าการตรวจสอบข้อมูลระหว่าง ข้อมูลที่กรอก กับข้อมูลใน 
    autocomplete สนใจ ตัวพิมพ์เล็กหรือตัวพิมพ์ใหญ่หรือไม่ ( default = false )

    example :
    YAHOO.example.Data.arrayStates = [ "Alabama", "Alaska", "Arizona", "Arkansas" ]; 
    YAHOO.example.BasicLocal = function () 
    { 
         var oDS = new YAHOO.util.LocalDataSource( YAHOO.example.Data.arrayStates ); 
         oDS.responseSchema = { fields : ["state"] }; 
         var oAC = new YAHOO.widget.AutoComplete ( "myInput", "myContainer", oDS ); 
         oAC.queryMatchCase = true; 
         return { oDS: oDS, oAC: oAC }; 
    }(); 

  • property :
    useShadow

    return type :
    void, boolean

    content :
    ใช้กำหนดค่า หรือคืนค่า ว่าต้องการให้มี เงา ตรง container หรือไม่ ( default = false )

    example :
    YAHOO.example.Data.arrayStates = [ "Alabama", "Alaska", "Arizona", "Arkansas" ]; 
    YAHOO.example.BasicLocal = function () 
    { 
         var oDS = new YAHOO.util.LocalDataSource( YAHOO.example.Data.arrayStates ); 
         oDS.responseSchema = { fields : ["state"] }; 
         var oAC = new YAHOO.widget.AutoComplete ( "myInput", "myContainer", oDS ); 
         oAC.useShadow = true; 
         return { oDS: oDS, oAC: oAC }; 
    }(); 

  • method :
    clearList ()

    return type :
    void

    content :
    ใช้กำหนดให้ ล้างข้อมูล ใน container

    example :
    var oAC = null;
    YAHOO.example.Data.arrayStates = [ "Alabama", "Alaska", "Arizona", "Arkansas" ]; 
    YAHOO.example.BasicLocal = function () 
    { 
         var oDS = new YAHOO.util.LocalDataSource( YAHOO.example.Data.arrayStates ); 
         oDS.responseSchema = { fields : ["state"] }; 
         oAC = new YAHOO.widget.AutoComplete ( "myInput", "myContainer", oDS ); 
         oAC.useShadow = true;
         return { oDS: oDS, oAC: oAC }; 
    }();
    oAC.clearList (); 

  • method :
    collapseContainer ()

    return type :
    void

    content :
    ใช้กำหนดให้ container พับลง คือ ปิดไป

    example :
    var oAC = null;
    YAHOO.example.Data.arrayStates = [ "Alabama", "Alaska", "Arizona", "Arkansas" ]; 
    YAHOO.example.BasicLocal = function () 
    { 
         var oDS = new YAHOO.util.LocalDataSource( YAHOO.example.Data.arrayStates ); 
         oDS.responseSchema = { fields : ["state"] }; 
         oAC = new YAHOO.widget.AutoComplete ( "myInput", "myContainer", oDS ); 
         oAC.useShadow = true; 
         return { oDS: oDS, oAC: oAC }; 
    }();
    oAC.collapseContainer ();

  • method :
    destroy ()

    return type :
    void

    content :
    ใช้กำหนดให้ ทำลาย Object AutoComplete

    example :
    var oAC = null;
    YAHOO.example.Data.arrayStates = [ "Alabama", "Alaska", "Arizona", "Arkansas" ]; 
    YAHOO.example.BasicLocal = function () 
    { 
         var oDS = new YAHOO.util.LocalDataSource( YAHOO.example.Data.arrayStates ); 
         oDS.responseSchema = { fields : ["state"] }; 
         oAC = new YAHOO.widget.AutoComplete ( "myInput", "myContainer", oDS ); 
         oAC.useShadow = true; 
         return { oDS: oDS, oAC: oAC }; 
    }();
    oAC.destroy ();

  • method :
    expandContainer ()

    return type :
    void

    content :
    ใช้กำหนดให้ container แผ่ออก คือ เปิดขึ้น

    example :
    var oAC = null;
    YAHOO.example.Data.arrayStates = [ "Alabama", "Alaska", "Arizona", "Arkansas" ]; 
    YAHOO.example.BasicLocal = function () 
    { 
         var oDS = new YAHOO.util.LocalDataSource( YAHOO.example.Data.arrayStates ); 
         oDS.responseSchema = { fields : ["state"] }; 
         oAC = new YAHOO.widget.AutoComplete ( "myInput", "myContainer", oDS ); 
         oAC.useShadow = true; 
         return { oDS: oDS, oAC: oAC }; 
    }();
    oAC.expandContainer ();

  • method :
    getContainerEI ()

    return type :
    Object

    content :
    ใช้คืนค่า Dom Element ที่ใช้เป็น container

    example :
    var oAC = null;
    YAHOO.example.Data.arrayStates = [ "Alabama", "Alaska", "Arizona", "Arkansas" ]; 
    YAHOO.example.BasicLocal = function () 
    { 
         var oDS = new YAHOO.util.LocalDataSource( YAHOO.example.Data.arrayStates ); 
         oDS.responseSchema = { fields : ["state"] }; 
         oAC = new YAHOO.widget.AutoComplete ( "myInput", "myContainer", oDS ); 
         oAC.useShadow = true; 
         return { oDS: oDS, oAC: oAC }; 
    }();
    var container = oAC.getContainerEI ();

  • method :
    getInputEI ()

    return type :
    Object

    content :
    ใช้คืนค่า Dom Element ที่ใช้เป็น text

    example :
    var oAC = null;
    YAHOO.example.Data.arrayStates = [ "Alabama", "Alaska", "Arizona", "Arkansas" ]; 
    YAHOO.example.BasicLocal = function () 
    { 
         var oDS = new YAHOO.util.LocalDataSource( YAHOO.example.Data.arrayStates ); 
         oDS.responseSchema = { fields : ["state"] }; 
         oAC = new YAHOO.widget.AutoComplete ( "myInput", "myContainer", oDS ); 
         oAC.useShadow = true; 
         return { oDS: oDS, oAC: oAC }; 
    }();
    var text = oAC.getInputEI ();

  • method :
    getListEI ()

    return type :
    Object Array

    content :
    ใช้คืนค่า item ของ container โดยจะคืนมาในลักษณะ Dom Element ของ tag ul 

    example :
    var oAC = null;
    YAHOO.example.Data.arrayStates = [ "Alabama", "Alaska", "Arizona", "Arkansas" ]; 
    YAHOO.example.BasicLocal = function () 
    { 
         var oDS = new YAHOO.util.LocalDataSource( YAHOO.example.Data.arrayStates ); 
         oDS.responseSchema = { fields : ["state"] }; 
         oAC = new YAHOO.widget.AutoComplete ( "myInput", "myContainer", oDS ); 
         oAC.useShadow = true; 
         return { oDS: oDS, oAC: oAC }; 
    }();
    var list_item = oAC.getListEI ();

  • method :
    isContainerOpen ()

    return type :
    boolean

    content :
    ใช้ตรวจสอบว่า contaner ถูกแสดงอยู่ ( expanded ) ใช่หรือไม่

    example :
    var oAC = null;
    YAHOO.example.Data.arrayStates = [ "Alabama", "Alaska", "Arizona", "Arkansas" ]; 
    YAHOO.example.BasicLocal = function () 
    { 
         var oDS = new YAHOO.util.LocalDataSource( YAHOO.example.Data.arrayStates ); 
         oDS.responseSchema = { fields : ["state"] };
         oAC = new YAHOO.widget.AutoComplete ( "myInput", "myContainer", oDS ); 
         oAC.useShadow = true; 
         return { oDS: oDS, oAC: oAC }; 
    }();
    if ( oAC.isContainerOpen () )
    {
         oAC.collapseContainer ();
    }

  • method :
    isFocused ()

    return type :
    boolean

    content :
    ใช้ตรวจสอบว่า autocomplete กำลังได้รับ focus อยู่ ใช่หรือไม่

    example :
    var oAC = null;
    YAHOO.example.Data.arrayStates = [ "Alabama", "Alaska", "Arizona", "Arkansas" ]; 
    YAHOO.example.BasicLocal = function () 
    { 
         var oDS = new YAHOO.util.LocalDataSource( YAHOO.example.Data.arrayStates ); 
         oDS.responseSchema = { fields : ["state"] }; 
         oAC = new YAHOO.widget.AutoComplete ( "myInput", "myContainer", oDS ); 
         oAC.useShadow = true; 
         return { oDS: oDS, oAC: oAC }; 
    }();
    if ( oAC.isFocused () )
    {
         alert ( "autocomplete alive" );
    }

  • method :
    containerCollapseEvent ()

    return type :
    void

    content :
    เป็นการกำหนดให้ function ทำงาน เมื่อ container ถูกปิดการใช้งาน

    example :
    var oAC = null;
    YAHOO.example.Data.arrayStates = [ "Alabama", "Alaska", "Arizona", "Arkansas" ]; 
    YAHOO.example.BasicLocal = function () 
    { 
         var oDS = new YAHOO.util.LocalDataSource( YAHOO.example.Data.arrayStates ); 
         oDS.responseSchema = { fields : ["state"] }; 
         oAC = new YAHOO.widget.AutoComplete ( "myInput", "myContainer", oDS ); 
         oAC.useShadow = true; 
         oAC.containerCollapseEvent.subscribe ( function () { alert ( "container collapse" ); } );
         return { oDS: oDS, oAC: oAC }; 
    }();

  • method :
    containerExpandEvent ()

    return type :
    void

    content :
    เป็นการกำหนดให้ function ทำงาน เมื่อ container ถูกแสดงออกมา

    example :
    var oAC = null;
    YAHOO.example.Data.arrayStates = [ "Alabama", "Alaska", "Arizona", "Arkansas" ]; 
    YAHOO.example.BasicLocal = function () 
    { 
         var oDS = new YAHOO.util.LocalDataSource( YAHOO.example.Data.arrayStates ); 
         oDS.responseSchema = { fields : ["state"] }; 
         oAC = new YAHOO.widget.AutoComplete ( "myInput", "myContainer", oDS ); 
         oAC.useShadow = true; 
         oAC.containerExpandEvent.subscribe ( function () { alert ( "container expand" ); } );
         return { oDS: oDS, oAC: oAC }; 
    }();

  • method :
    containerPopulateEvent ()

    return type :
    void

    content :
    เป็นการกำหนดให้ function ทำงาน เมื่อ container ถูก populate

    example :
    var oAC = null;
    YAHOO.example.Data.arrayStates = [ "Alabama", "Alaska", "Arizona", "Arkansas" ]; 
    YAHOO.example.BasicLocal = function () 
    { 
         var oDS = new YAHOO.util.LocalDataSource( YAHOO.example.Data.arrayStates ); 
         oDS.responseSchema = { fields : ["state"] }; 
         oAC = new YAHOO.widget.AutoComplete ( "myInput", "myContainer", oDS ); 
         oAC.useShadow = true; 
         oAC.containerPopulateEvent.subscribe ( function () { alert ( "container populate" ); } );
         return { oDS: oDS, oAC: oAC }; 
    }();

  • method :
    itemArrowFromEvent ( element_item )

    return type :
    void

    content :
    เป็นการกำหนดให้ function ทำงาน เมื่อ focus การออกจาก item ใน container

    example :
    var oAC = null;
    YAHOO.example.Data.arrayStates = [ "Alabama", "Alaska", "Arizona", "Arkansas" ]; 
    YAHOO.example.BasicLocal = function () 
    { 
         var oDS = new YAHOO.util.LocalDataSource( YAHOO.example.Data.arrayStates ); 
         oDS.responseSchema = { fields : ["state"] }; 
         oAC = new YAHOO.widget.AutoComplete ( "myInput", "myContainer", oDS ); 
         oAC.useShadow = true; 
         oAC.itemArrowFromEvent.subscribe ( function ( item ) { alert ( "item arrow from" ); } );
         return { oDS: oDS, oAC: oAC }; 
    }();

  • method :
    itemArrowToEvent ( element_item )

    return type :
    void

    content :
    เป็นการกำหนดให้ function ทำงาน เมื่อ focus การเข้าไปใน item ใน container

    example :
    var oAC = null;
    YAHOO.example.Data.arrayStates = [ "Alabama", "Alaska", "Arizona", "Arkansas" ]; 
    YAHOO.example.BasicLocal = function () 
    { 
         var oDS = new YAHOO.util.LocalDataSource( YAHOO.example.Data.arrayStates ); 
         oDS.responseSchema = { fields : ["state"] }; 
         oAC = new YAHOO.widget.AutoComplete ( "myInput", "myContainer", oDS ); 
         oAC.useShadow = true; 
         oAC.itemArrowToEvent.subscribe ( function ( item ) { alert ( "item arrow to" ); } );
         return { oDS: oDS, oAC: oAC }; 
    }();

  • method :
    itemMouseOutEvent ( element_item )

    return type :
    void

    content :
    เป็นการกำหนดให้ function ทำงาน เมื่อ mouse ออกจาก item ใน container

    example :
    var oAC = null;
    YAHOO.example.Data.arrayStates = [ "Alabama", "Alaska", "Arizona", "Arkansas" ]; 
    YAHOO.example.BasicLocal = function () 
    { 
         var oDS = new YAHOO.util.LocalDataSource( YAHOO.example.Data.arrayStates ); 
         oDS.responseSchema = { fields : ["state"] }; 
         oAC = new YAHOO.widget.AutoComplete ( "myInput", "myContainer", oDS ); 
         oAC.useShadow = true; 
         oAC.itemMouseOutEvent.subscribe ( function ( item ) { alert ( "mouse out item" ); } );
         return { oDS: oDS, oAC: oAC }; 
    }();

  • method :
    itemMouseOverEvent ( element_item )

    return type :
    void

    content :
    เป็นการกำหนดให้ function ทำงาน เมื่อ mouse อยู่เหนือ item ใน container

    example :
    var oAC = null;
    YAHOO.example.Data.arrayStates = [ "Alabama", "Alaska", "Arizona", "Arkansas" ]; 
    YAHOO.example.BasicLocal = function () 
    { 
         var oDS = new YAHOO.util.LocalDataSource( YAHOO.example.Data.arrayStates ); 
         oDS.responseSchema = { fields : ["state"] }; 
         oAC = new YAHOO.widget.AutoComplete ( "myInput", "myContainer", oDS ); 
         oAC.useShadow = true; 
         oAC.itemMouseOverEvent.subscribe ( function ( item ) { alert ( "mouse over item" ); } );
         return { oDS: oDS, oAC: oAC }; 
    }();

  • method :
    itemSelectEvent ( element_item, object_data )

    return type :
    void

    content :
    เป็นการกำหนดให้ function ทำงาน เมื่อ มีการเลือก item ใน container

    example :
    var oAC = null;
    YAHOO.example.Data.arrayStates = [ "Alabama", "Alaska", "Arizona", "Arkansas" ]; 
    YAHOO.example.BasicLocal = function () 
    { 
         var oDS = new YAHOO.util.LocalDataSource( YAHOO.example.Data.arrayStates ); 
         oDS.responseSchema = { fields : ["state"] }; 
         oAC = new YAHOO.widget.AutoComplete ( "myInput", "myContainer", oDS ); 
         oAC.useShadow = true; 
         oAC.itemSelectEvent.subscribe ( function ( item, data ) { alert ( "select item" ); } );
         return { oDS: oDS, oAC: oAC }; 
    }();

  • method :
    textboxBlurEvent ()

    return type :
    void

    content :
    เป็นการกำหนดให้ function ทำงาน เมื่อ textbox สูบเสีย focus

    example :
    var oAC = null;
    YAHOO.example.Data.arrayStates = [ "Alabama", "Alaska", "Arizona", "Arkansas" ]; 
    YAHOO.example.BasicLocal = function () 
    { 
         var oDS = new YAHOO.util.LocalDataSource( YAHOO.example.Data.arrayStates ); 
         oDS.responseSchema = { fields : ["state"] }; 
         oAC = new YAHOO.widget.AutoComplete ( "myInput", "myContainer", oDS ); 
         oAC.useShadow = true; 
         oAC.textboxBlurEvent.subscribe ( function () { alert ( "textbox blur" ); } );
         return { oDS: oDS, oAC: oAC }; 
    }();

  • method :
    textboxChangeEvent ()

    return type :
    void

    content :
    เป็นการกำหนดให้ function ทำงาน เมื่อมีการเปลี่ยนแปลงข้อมูลใน textbox

    example :
    var oAC = null;
    YAHOO.example.Data.arrayStates = [ "Alabama", "Alaska", "Arizona", "Arkansas" ]; 
    YAHOO.example.BasicLocal = function () 
    { 
         var oDS = new YAHOO.util.LocalDataSource( YAHOO.example.Data.arrayStates ); 
         oDS.responseSchema = { fields : ["state"] }; 
         oAC = new YAHOO.widget.AutoComplete ( "myInput", "myContainer", oDS ); 
         oAC.useShadow = true; 
         oAC.textboxChangeEvent.subscribe ( function () { alert ( "textbox change" ); } );
         return { oDS: oDS, oAC: oAC }; 
    }();

  • method :
    textboxFocusEvent ()

    return type :
    void

    content :
    เป็นการกำหนดให้ function ทำงาน เมื่อ textbox ได้รับ focus

    example :
    var oAC = null;
    YAHOO.example.Data.arrayStates = [ "Alabama", "Alaska", "Arizona", "Arkansas" ]; 
    YAHOO.example.BasicLocal = function () 
    { 
         var oDS = new YAHOO.util.LocalDataSource( YAHOO.example.Data.arrayStates ); 
         oDS.responseSchema = { fields : ["state"] }; 
         oAC = new YAHOO.widget.AutoComplete ( "myInput", "myContainer", oDS ); 
         oAC.useShadow = true; 
         oAC.textboxFocusEvent.subscribe ( function () { alert ( "textbox focus" ); } );
         return { oDS: oDS, oAC: oAC }; 
    }();

  • method :
    textboxKeyEvent ( key_code )

    return type :
    void

    content :
    เป็นการกำหนดให้ function ทำงาน เมื่อมีการกดปุ่มลงบน textbox

    example :
    var oAC = null;
    YAHOO.example.Data.arrayStates = [ "Alabama", "Alaska", "Arizona", "Arkansas" ]; 
    YAHOO.example.BasicLocal = function () 
    { 
         var oDS = new YAHOO.util.LocalDataSource( YAHOO.example.Data.arrayStates ); 
         oDS.responseSchema = { fields : ["state"] }; 
         oAC = new YAHOO.widget.AutoComplete ( "myInput", "myContainer", oDS ); 
         oAC.useShadow = true; 
         oAC.textboxKeyEvent.subscribe ( function ( keycode ) { alert ( "textbox key" ); } );
         return { oDS: oDS, oAC: oAC }; 
    }();

 
Share This Chapter Login with Facebook