AngularJs : ตัวอย่างการสร้าง Angular autocomplete อย่างง่าย

jQuery & Ajax Knowledge ความรู้เกี่ยวกับ Javascript , jQuery และ Ajax

Moderator: mindphp, ผู้ดูแลกระดาน

ภาพประจำตัวสมาชิก
thatsawan
PHP VIP Members
PHP VIP Members
โพสต์: 28508
ลงทะเบียนเมื่อ: 31/03/2014 10:02 am
ติดต่อ:

AngularJs : ตัวอย่างการสร้าง Angular autocomplete อย่างง่าย

โพสต์ที่ยังไม่ได้อ่าน โดย thatsawan »

Autocomplete คืออะไร
การพิมตัวอักษรไปในช่องรับข้อมูลแล้วจะแสดงข้อมูลที่เรากำหนดขึ้นมาให้ตามตัวอักษรที่พบ เช่น เรากำหนด

โค้ด: เลือกทั้งหมด

 'Test1',
        'aaaa',
        'cccc',
        'ooo',
        '***',
เมื่อเราพิมพ์ ตัวอักษร T ระบบก็จะแสดงคำว่า Test1 มาให้เราเลือกใช้โดยไม่ต้องพิมพ์ ทั้งหมด ทั้งนี้การส่งข้อมูลเเบบในตัวอย่างเราสามารถประยุกต์ใช้กับฐานข้อมูลของเราได้เป็นระบบ ค้นหาต่างๆ

โค้ด: เลือกทั้งหมด

<div ng-app="myApp" ng-controller="namesCtrl">

<p>การสร้าง Angular autocomplete:</p>

<p><input type="text" ng-model="test"></p>

<ul>
  <li ng-repeat="x in names | filter:test">
    {{ x }}
  
  </li>
</ul>   

</div> 

โค้ด: เลือกทั้งหมด

<script>
   
angular.module('myApp', []).controller('namesCtrl', function($scope) 
{
    $scope.names = [
        'Test1',
        'aaaa',
        'cccc',
        'ooo',
        '***',
    ];
});


</script>

สามารถศึกษา เพิ่มเติมได้ที่
บทเรียน HTML
บทเรียน-html5
บทเรียน CSS
บทเรียน Javascript
บทเรียน jquery
ตอบกลับโพส
  • Similar Topics
    ตอบกลับ
    แสดง
    โพสต์ล่าสุด

ผู้ใช้งานขณะนี้

สมาชิกกำลังดูบอร์ดนี้: ไม่มีสมาชิกใหม่ และบุคลทั่วไป 72