--Scenario I am given a task for autocomplete feature where the autocomplete feature will be in div tag instead of the showing like dropdown in textbox. Initially i thought its easy. But one problem i faced when i tried to do it in div tag. --Suppose i have a textbox. And suppose i have set of records as below. Anurag Antony Ajay Alex When i start typing A. I get all the autocomplete suggestion in div tag. But when i hit the last backspace, the suggestion in div tag doesnt get clear. So i started comparing with the normal autocomplete where the suggestion comes just below the textbox and the autocomplete which i was trying in a div tag. when i enter something in the textbox and and press backspace and when i hit last backspace to clear the textbox it doesnt go to the debugger. So is there any way to perform autocomplete in a div tag ?
--------------What i was trying ------ <style type="text/css"> .searchBox { background-image: url('Images/perfectlens.PNG'); background-repeat: no-repeat; padding-left: 20px; } .text-label { color: #cdcdcd; font-weight: bold; } .focus { border: 2px solid #AA88FF; background-color: #FFEEAA; } </style> <link rel="stylesheet" href="http://code.jquery.com/ui/1.10.3/themes/smoothness/jquery-ui.css" /> <script src="http://code.jquery.com/jquery-1.9.1.js"></script> <script src="http://code.jquery.com/ui/1.10.3/jquery-ui.js"></script> <script type="text/javascript"> $(document).ready (function () { $("#Employee").autocomplete ({ source: function (request, response) { $.ajax({ url: "/SearchStore/Employeename", type: "POST", dataType: "json", data: { term: request.term }, success: function (data) { $('#autocompleteindiv').text(''); if (data.length > 0) { response($.map(data, function (item) { $('#autocompleteindiv').append(item.EmployeeNames+ '</br>'); })) } else { $('#autocompleteindiv').text(''); $('#autocompleteindiv').append('No Results Found'); } } }) }, minLength: 1 }); }) </script> <div style="font-family: Arial"> <input type="text" class="searchBox" value="StoreNumber" name="StoreNumber" id="Employee" title="Enter Store Number" onfocus="if (value == 'StoreNumber') {value=''};this.style.color='#000';" önblur="if (value== '') {value='StoreNumber'};this.style.color='#999';" size="15" style="font-weight: bold; color: #808080" /> </div> <div id="autocompleteindiv" style="background-color:gray;width:600px;height:600px"></div> ---kindly help me.
var
This content, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)