发表新帖
发表新帖

Is there a way to use Autocomplete without JQuery UI

前端 未结
关注
4 1211
北海茫月
北海茫月 2021-01-14 05:37

Is there a way to use autocomplete without JQuery UI cause JQuery UI\'s footprint is too large (including its CSS) ?

or is there any alternative plugin or something

相关标签:
4条回答
  • 南笙
    2021-01-14 05:39

    No need to include JQuery or any other third party library.

    IP_autoComplete function will automatically concatinate field value to URL (1st parameter). For example textbox has value neeraj then arrjson.php?Name=neeraj will be triggered.

    You can use IP_autocomplete function for static value as well. Just add # sign once at starting in your string (comma sepreated). E.g: "#val1,val2,val3"

    arrjson.php should return json encoded string.

    HTML:

    <script type="text/javascript" src="http://services.iperfect.net/js/IP_generalLib.js">

    Body 

    <input type="text" name="testautocomplete" id="testautocomplete" onkeypress="IP_autoComplete('arrjson.php?Name=',this.id,event)">

    Or simply you can give static:

    <input type="text" name="testneeraj" id="testneeraj" onkeyup="IP_autoComplete('#sachin bhalake,ishwar agam,mohsin khan,neeraj dhekale,sheetal dhekale,ajay bhalake',this.id,event)">
    0 讨论(0)
  • 独厮守ぢ
    2021-01-14 05:57

    You can build your own that does not depend on JQuery UI, its a very simple idea of trigger field onchange(), issue an AJAX call to get result that matches what you typed so far, and populate some field with a div or drop down below or near it. And on select of the div or drop down, you populate your trigger field with selected value.

    I know that Jquery Autosuggest does not use JQuery UI but does require JQuery.

    0 讨论(0)
  • 长发绾君心
    2021-01-14 06:01

    Refer below snippet for autocomplete without using jQuery. This is plain html5 with datalist tag works on all modern browsers.

    <!DOCTYPE html>
<html>
<head>
<!--your stuff-->
</head>
<body>
<!--your stuff-->
<input type="text" id="txtAutoComplete" list="languageList"/><!--your input textbox-->
<datalist id="languageList">
<option value="HTML" />
<option value="CSS" />
<option value="JavaScript" />
<option value="SQL" />
<option value="PHP" />
<option value="jQuery" />
<option value="Bootstrap" />
<option value="Angular" />
<option value="ASP.NET" />
<option value="XML" />
</datalist>
</body>
</html>

    If need help related to implement this, refer this link

    0 讨论(0)
  • 离开以前
    2021-01-14 06:02

    Just found this facebook-style jQuery plugin that is currently maintained and doesn't require the bloat of jQuery UI

    https://github.com/loopj/jquery-tokeninput

    0 讨论(0)
 看不清?
提交回复
热议问题