• Telegram
  • Google Plus
  • Linked In

ایجاد typeahead در Bootstrap

ایجاد typeahead در Bootstrap

تاریخ درج: خلاصه

bootstrap ، طراحی سایت، طراحی وب سایت، آموزش بوت استرپ، typeahead

ایجاد typeahead در Bootstrap

در این بخش نحوه ایجاد typeahead را در بوت استرپ خواهید آموخت.

درد نیای وب امروزی، فیلدهای ورودی ( input ) از نوع typeahead بسیار رایج و پرکاربرد میباشند. هدف اصلی typeahead ، بهبود تجربه کاربر از طریق ارائه پیشنهادها یا لیستی از انتخابات احتمالی با توجه به متنی که کاربر در زمان پر کردن فرم یا جستجو کردن وارد کرده، میباشد. مانند Google . همچنین باعث صرفه جویی در زمان و کاهش خطاهای احتمالی میشود زیرا کمتر احتمال اشتباه لغتی و تایپی از سمت کاربر وجود دارد.
نکته : پلاگین typeahead به دلیل استفاده از twitter typeahead ، از آخرین نسخه بوت استرپ حذف شده است.
twitter typeahead یک کتابخانه سریع و با امکانات کامل میباشد که مطابق با عملکرد جستجو در سایت twitter.com ، ایجاد شده است. جهت ایجاد twitter typeahead ، ابتدا فایل typeahead.js را از طریق GitHub دانلود کرده و آن را در پروژه خود وارد نمایید. سپس میتوانید با استفاده از آن، هر input بر مبنای متن (یعنی["input[type="text) را به یک typeahead تبدیل نمایید.

ایجاد twitter typeahead با مجموعه داده های داخلی (local) :











خروجی مثال بالا به شکل زیر خواهد بود :






ایجاد twitter typeahead با مجموعه داده های خارجی :










تاکنون نظری ارسال نشده است،شما اولین نفر باشید

سؤال یا نظر خود را ارسال کنید

  • Telegram
  • Google Plus
  • Linked In