Introduction:
Here I will explain how to use jQuery to show all autocomplete list / options on focus with example or jQuery UI display all autocomplete list / options on focus with example or jQuery open autocomplete menu on focus of textbox with example. In jQuery autocomplete by using focus event we can show all autocomplete options on focus.
Description:
In previous articles I explained jQuery highlight matching text in search results, jQuery ui autocomplete textbox from database in asp.net, jQuery autocomplete textbox with web service in asp.net, jQuery autocomplete textbox in master page using webservice in asp.net, jQuery autocomplete textbox with multiple words separated by commas, jQuery bootstrap autocomplete textbox from database in asp.net and many articles relating to css, AngularJS, jQuery, JavaScript and asp.net. Now I will explain how to show all autocomplete options on focus in jQuery with example.
In previous articles I explained jQuery highlight matching text in search results, jQuery ui autocomplete textbox from database in asp.net, jQuery autocomplete textbox with web service in asp.net, jQuery autocomplete textbox in master page using webservice in asp.net, jQuery autocomplete textbox with multiple words separated by commas, jQuery bootstrap autocomplete textbox from database in asp.net and many articles relating to css, AngularJS, jQuery, JavaScript and asp.net. Now I will explain how to show all autocomplete options on focus in jQuery with example.
To show all autocomplete
options on focus in textbox using jQuery
we need to write the code like as shown below
$('#txtUsers').autocomplete({
source: users,
minLength: 0
}).focus(function()
{
$(this).autocomplete("search", "");
});
|
If you want
to full example to show autocomplete list on textbox focus in jQuery
write the code like as shown below
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>jQuery Show All AutoComplete Options on Focus Example</title>
<link rel="stylesheet"
href="//code.jquery.com/ui/1.12.0-rc.2/themes/base/jquery-ui.css">
<script src="//code.jquery.com/jquery-1.11.3.js"></script>
<script src="//code.jquery.com/ui/1.12.0-rc.2/jquery-ui.min.js"></script>
<script type="text/javascript">
$(function(){
var users = ['Suresh Dasari',
'Rohini Alavala',
'Sudheer Rayana',
'Madhav Sai',
'Siva Prasad',
'Praveen Alavala',
'Sateesh Chandra',
'Mahendra Dasari'];
$('#txtUsers').autocomplete({
source: users,
minLength: 0
}).focus(function()
{
$(this).autocomplete("search", "");
});
})
</script>
</head>
<body>
<form id="form1">
<div>
Enter Name:<input type="text" id="txtUsers" placeholder="Focus in Textbox" style="padding:10px; width:250px" />
</div>
</form>
</body>
</html>
|
Demo
Check following demo to show
all autocomplete list on focus in jQuery.
 |
|
If you enjoyed this post, please support the blog below. It's FREE! Get the latest Asp.net, C#.net, VB.NET, jQuery, Plugins & Code Snippets for FREE by subscribing to our Facebook, Twitter, RSS feed, or by email. |
|||
Subscribe by RSS
Subscribe by Email
|
|||
1 comments :
i have one doubt how to bind the image in gridview from the server folder..not using database.and i have bind particular image only not the all images in gridview
Note: Only a member of this blog may post a comment.