[easyUI] autocomplete 簡單自動完成以及ajax從服務器端完成

阿新 • • 發佈：2018-06-24

request 調用 fun eas () rip back erl asp

　　通過id取input標簽對象,調用autocomplete方法

<script>
    var sources = [
            "ActionScript",
            "AppleScript",
            "Asp",
            "COBOL",
            "ColdFusion",
            "Erlang",
            "Fortran",
            "Groovy",
            "Haskell",
            "Java",
             
"JavaScript",
            "Lisp",
            "Perl",
            "PHP",
            "Python",
            "Ruby",
            "Scala",
            "Scheme"
          ]; 
    $(function() {
        $( "#tags" ).autocomplete({
            source:sources
        });
    });
</script>
<body> 

    <div class="ui-widget">
        <h2>查詢：<input id="tags"></h2>
    </div>
</body>

{source:sources}將多個sources的String類型數組,包裝成JSON.

Ajax服務器端完成:

服務器端網頁的Java代碼,也只有java代碼.

    String query = request.getParameter("term");//獲取要匹配的參數
    String[] sources = {"ActionScript",
             
"AppleScript",
            "Asp",
            "BASIC",
            "C",
            "C++",
            "Clojure",
            "COBOL",
            "ColdFusion",
            "Erlang",
            "Fortran",
            "Groovy",
            "Haskell",
            "Java",
            "JavaScript",
            "Lisp",
            "Perl",
            "PHP",
            "Python",
            "Ruby",
            "Scala",
            "Scheme"};
    StringBuilder builder = new StringBuilder("[");
    for(int i=0;i<sources.length;i++){//遍歷目標數組，返回符合條件的結果
        if(null != query){
            if(sources[i].indexOf(query) >= 0){//表示如果輸入了query,sources[i]的String包含String query
                builder.append("{\"label\":\""+sources[i]+"\"},");//拼接成{"label":sources[i]}的JSON數據
            }
        }else{//如果不輸入query,返回所有的sources[i]成為JSON數組.
            builder.append("{\"label\":\""+sources[i]+"\"},");
        }
    }
    String result = builder.toString();//轉換為字符串.
    if(result.endsWith(",")){//因為拼接的結果轉換成字符串後,數組內會多出","
        result = result.substring(0,result.length()-1);//需要截去最後一個逗號.
    }
    result+="]";//拼接"]"
    out.print(result);

View Code

script:

    $(function() {
        $( "#tags" ).autocomplete({
            source:function(request,response){
            //request.term估計是將input內容提交後的字符串."term=‘字符串‘",其實等價於傳入一個
            //{"term":"字符串"}的JSON數據. 具體在jQuery1.11.10的幫助文檔中有所描述,搜get第二個即是.
                $.get("server/demo4_server.jsp","term="+request.term,function(data){
                //url(目標地址),data(傳入數據),callback(回調函數)
                    var result = $.parseJSON(data);
                    response(result);// 輸出返回結果
                });
            }
        });
    });

View Code

parseJSON(String strJSON)函數:

技術分享圖片

[easyUI] autocomplete 簡單自動完成以及ajax從服務器端完成

request 調用 fun eas () rip back erl asp 　　通過id取input標簽對象,調用autocomplete方法 <script> var sources = [ "ActionScript",

Ajax——從服務器獲取各種文件

實時更新解析json php文件 black state ret java text 通過 ajax.js內容 function ajax(url,fnWin,fnFaild){ //1.創建ajax對象 var xhr = window.XMLHttp

ajax從服務器獲取信息並拼接顯示在table

姓名 thead nbsp 進行 head 信息準備 script oca 1、頁面代碼 <body> <h1>顯示所有員工信息</h1> <div> <table clas

通過Ajax從Servlet獲取資料完成登入例項

Ajax的好處就是可以在頁面不進行重新整理的情況下，完成當前頁面某些收據的更新，速度快且使用者體驗好。剛開始學習，就著幾行程式碼也要搞很長時間才能明白。 login.jsp--登入介面 <span style="white-space:pre"> </

ajax跨域之---服務器端代理實現

通過 str 分享介紹 hello js實現 pre ucc ref 介紹一種不是通過js實現跨域的方式：通過服務器端代理實現。具體的思路：由於瀏覽器有同源策略限制，（同源策略即：https://developer.mozilla.org/zh-CN/docs/Web

【Swoole】簡單安裝與創建TCP服務器

客戶編寫程序 lac nco 版本 size sock ear light pecl install swoole PHP的異步、並行、高性能網絡通信引擎，使用純C語言編寫，提供了php語言的異步多線程服務器，異步TCP/UDP網絡客戶端，異步MySQL

簡單扒一下幾家雲服務器使用感受

雲服務器使用感受百度雲的可用區太少了，百度按月還挺便宜的，買的時候直接就有彈性IP，彈性ip收費，RDS 貴，技術支持免費。阿裏按需價格還可以，感覺還好，RDS 比百度便宜一些，阿裏有個坑如果用彈性IP不能設帶寬，不然掛不上彈性ip,也不能解綁自動分配的公網ip，彈性IP收費，RDS 便宜些，基礎技術支持免費

HTTP請求中的form data,request payload,query string parameters以及在node服務器中如何接收這些參數

orm function log tab 參數 title 方法 ext head http://www.cnblogs.com/hsp-blog/p/5919877.html 今天，在工作（倒騰微信小程序）的時候，發現發送post請求到node後臺服務器接收不

bind主從同步，從服務器區域文件亂碼

bind 亂碼故障現象：今天搭建一套bind主從的時候，同步的時候，查看了下發現區域文件居然亂碼，截圖如下：處理過程：# vim /etc/named.rfc1912.zones /* wanwan zone config */ zone "wanwan.com" IN { type slav

愛創課堂每日一題第五十五天- WEB應用從服務器主動推送Data到客戶端有那些方式？

前端前端學習前端入門Javascript數據推送Commet：基於HTTP長連接的服務器推送技術基於WebSocket的推送方案SSE（Server-Send Event）：服務器推送數據新方式愛創課堂每日一題第五十五天- WEB應用從服務器主動推送Data到客戶端有那些方式？

2017.12.07 Ajax獲取服務器數據並發送到前端

ice com 周期 react ack log 導出 ring 方法 1.前端：在React渲染頁面之前就加載服務器數據： componentWillMount() { console.log("aaaaaaaa"); var d

DNS從服務器的配置詳解

dns從服務器作用 dns從服務器的配置過程 dns的主從配置 DNS從服務器的配置詳解一、DNS從服務器的作用 DNS從服務器也叫輔服DNS服務器，如果網絡上某個節點只有一臺DNS服務器的話，首先服務器的抗壓能力是有限的，當壓力達到一定的程度，服務器就會宕機罷工，其次如果這臺服務器出現了硬件

未能分析從服務器收到的消息,.cs文件裏面用response.write輸出js彈框出錯，用了局部跟新

scrip hive htm onclick orm pda 但是 parser 彈框轉載：https://www.cnblogs.com/shenyixin/archive/2012/03/08/2385376.html 中文：Sys.WebForms.PageRequ

mysql 新增從服務器配置出錯

mysql新增一臺從服務器配置完server-id = 117log-bin = mysql-binbinlog-format = mixedrelay-log = mysql-relaygrant replication client,replication slave on . to centos7@‘1

用Ajax請求服務器的圖片，並顯示在瀏覽器中(轉)

時間比較是否 ktr 而不是標簽設置 gpo 異常 ping 瀏覽器中前言一直在數據庫裏面存的都是圖片在服務器的地址，然後再到瀏覽器中顯示，但是發現兩個問題第一：為了安全起見，js是無法讀取本地的圖片的，不然你寫一個js，豈不是可以獲取任何人電腦裏面的文件了。第

SVN使用鉤子函數（post-commit）自動推送到業務服務器

svn方法對比：update和export對比update會產生隱藏文件,存在安全隱患，update是增量的，在代碼比較大的時候適用export直接導出幹凈的代碼，不會存在隱藏文件，不適合較大的庫方法一：update 鉤子模版: 倉庫中hooks目錄下post-commint模版可以觸發shell>c

dotnet服務器端框架從精通到棄坑

不能服務器端 cor 服務也不能 linu 完全事務管理 .com 當你們看到這篇經驗分享的時候，我已經把服務器端主要力量轉到JAVA了。純當留念。另外裏面實現oauth2.0的部分就不寫了，因為特殊性太強，完全根據自家需求結合它的理念改寫的。為什麽

Linux-dns基礎知識和BIND的簡單配置-3（主從DNS服務器及轉發）

-m 區域解析庫 com window 完成 file 發的 new 配置 rndc的相關知識：1.什麽是rndc：Remote Name Domain Controller，遠程名稱域控制器rndc 通過一個 TCP 連接與名字服務器通信，發送經過數字簽名認證的命令。在當

jenkins主從從服務器發布腳本執行成功但總提示失敗 FATAL: Remote call on XXXX failed

wid 版本發現 remote 腳本成功分享發布腳本不同　　主從jenkins當調用 slave 執行編譯腳本後提示如下錯誤，找了半天怎麽也沒有問題，後來忽然發現slave上java的版本和master不同，一個 1.8 一個 1.10，將slave降回1.8一

對存在過期 binlog 的 MySQL5.7 添加從服務器

存在 flush -i ORC .so binlog user gtid_mode top 數據庫版本：MySQL 5.7原數據庫：mysql01從數據庫：mysql02 原數據庫配置文件 datadir=/var/lib/mysql socket=/var/lib/mys

[easyUI] autocomplete 簡單自動完成以及ajax從服務器端完成

相關推薦