First of All Create a Text box
<label for="tags">Tags:</label>
<input id="tags">
Then to integrate autocomplete jquery Library Download JQuery UI file from Link HERE or Add server Link in your Head Section.
Just Like:
<script src="js/jquery-ui.js"></script>
OR
<script src="http://code.jquery.com/ui/1.10.3/jquery-ui.js"></script>
Then add items you want autocomplete to an array
var availableTags = [
"shihab",
"sabeer",
"Tholhath",
"Anju",
"Anu",
"shivin",
"Jacob",
"Sajeesh",
"Jinesh",
"Shibu",
"Kiran",
"Arjun",
"Jamsheer",
"Jam",
"Boby",
"Aji",
"Subash",
"Kumari",
"Shahid",
"Siraj",
"Hari",
"Radha"];
Then integrate Auto completion to a Control means TextBox.
$("#tags").autocomplete({
source: availableTags,
position: {
my: "left top",
at: "left bottom",
}
});
Use this styles for Good Look for auto Completion List
.footer-auto {
background: gray;
color: white;
}
<label for="tags">Tags:</label>
<input id="tags">
Then to integrate autocomplete jquery Library Download JQuery UI file from Link HERE or Add server Link in your Head Section.
Just Like:
<script src="js/jquery-ui.js"></script>
OR
<script src="http://code.jquery.com/ui/1.10.3/jquery-ui.js"></script>
Then add items you want autocomplete to an array
var availableTags = [
"shihab",
"sabeer",
"Tholhath",
"Anju",
"Anu",
"shivin",
"Jacob",
"Sajeesh",
"Jinesh",
"Shibu",
"Kiran",
"Arjun",
"Jamsheer",
"Jam",
"Boby",
"Aji",
"Subash",
"Kumari",
"Shahid",
"Siraj",
"Hari",
"Radha"];
Then integrate Auto completion to a Control means TextBox.
$("#tags").autocomplete({
source: availableTags,
position: {
my: "left top",
at: "left bottom",
}
});
Use this styles for Good Look for auto Completion List
.footer-auto {
background: gray;
color: white;
}
https://communication.aau.ac.ae/
ReplyDeletehttps://aau.ac.ae/en/contact-alain-university/
https://aau.ac.ae/en/units/students-recruitment/overview
https://aau.ac.ae/en/units/students-recruitment/mission-and-vision
https://aau.ac.ae/en/units/students_recruitment/staff
https://aau.ac.ae/en/units/students_recruitment/community_engagement
https://aau.ac.ae/en/professional-development/overview
https://aau.ac.ae/en/policies/full-time-and-part-time
https://aau.ac.ae/en/policies/evaluation
https://aau.ac.ae/en/policies/promotions
https://aau.ac.ae/en/policies/teaching-load
https://aau.ac.ae/en/admission/undergraduate/financial-aid-and-scholarship
https://aau.ac.ae/en/admission/undergraduate/course-grading-system
http://students.aau.ac.ae/about-the-deanship
http://students.aau.ac.ae/student-welfare
http://students.aau.ac.ae/student-affairs-staff
http://students.aau.ac.ae/news
https://aau.ac.ae/en/news
https://aau.ac.ae/en/events
https://aau.ac.ae/en/announcements
https://aau.ac.ae/en/videos
https://aau.ac.ae/en/publication
https://aau.ac.ae/en/newsletter
https://aau.ac.ae/en/keep-in-touch-with-aau
https://aau.ac.ae/en/blog
https://aau.ac.ae/en/brand-guidelines