Jquery UI自動完成：自定義數據

我正在使用jQuery自動完成功能與文本框。Jquery UI自動完成：自定義數據

HTML：

<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%> 
<%@ page session="true"%> 
<html> 
    <head> 
    <title>Autocomplete Example</title> 
    <link href='<c:url value='/views/css/style.css'/>' rel="stylesheet" 
     type="text/css"> 
    <link href='<c:url value='/views/css/jquery-ui-1.10.3.custom.css'/>' 
     rel="stylesheet" type="text/css"> 
    <script type="text/javascript" 
    src="<c:url value='/views/js/jquery-1.9.1.min.js'/>"></script> 
    <script type="text/javascript" 
    src="<c:url value='/views/js/jquery-ui-1.10.3.custom.js'/>"></script> 
<script> 
    $(document).ready(
     function() { 
       $("#txt-search").autocomplete({ 
        minLength : 3, 
        source : "<c:out value="${queryResult}"/>", 
        select : function(evt, ui) { 
         alert(ui.item.firstName); 
         return false; 
        } 
       }).data("txt-search")._renderItem = function(ul, item) { 
        return $("<li></li>").data("item.autocomplete",  item) 
          .append("<a>" + item.firstName + " </a>").appendTo(
           ul); 
       }; 
      }); 
    </script> 
    </head> 
    <body> 
    <div> 
     <div style="width: 240px; height: 50px;"> 
      <input id="txt-search" type="text" 
       style="width: 220px; height: 24px; margin-left: 10px;  margin-top: 10px; font-family: calibri; font-size: 12pt;" /> 
     </div> 
     </div> 
    </body> 
</html>

控制器： 包com.priyank.ac.controller;

import java.util.ArrayList; 
import java.util.List; 

import javax.servlet.http.HttpServletRequest; 
import javax.servlet.http.HttpServletResponse; 

import org.springframework.beans.factory.annotation.Autowired; 
import org.springframework.stereotype.Controller; 
import org.springframework.ui.Model; 
import org.springframework.web.bind.annotation.RequestMapping; 
import org.springframework.web.bind.annotation.RequestMethod; 
import org.springframework.web.bind.annotation.RequestParam; 

import com.priyank.ac.entity.User; 
import com.priyank.ac.service.UserService; 

@Controller 
public class UserController { 

    @Autowired 
    private UserService userService; 

@RequestMapping("/index") 
public String getUser(HttpServletRequest request, 
     HttpServletResponse response) { 
    return "index"; 
} 

@RequestMapping(value = "/queryUsers", method = RequestMethod.GET) 
public void queryUsers(
     @RequestParam(value = "query", required = false, defaultValue = "") String query, 
     Model model) { 

    List<User> usersInCommunity = this.userService 
      .queryUsersByUserId(query); 
    List<User> users = new ArrayList<User>(); 
    users.addAll(usersInCommunity); 
    model.addAttribute("usersInCommunity", users); 
} 
}

我送花兒給人收到以下錯誤：

類型錯誤：$（...）自動完成（...）數據（...）是未定義 [打破這個錯誤]

。（「autocomplete」）._ renderItem = function（ul，item）{

}）。或M}這裏缺少一些點..

來源

2013-07-30 Priyank Thakkar

我做類似的東西，但我的.data（）看起來是這樣的：

$("input#books").autocomplete({ 
       minLength : 3, 
       source : someArray 
}).data("ui-autocomplete")._renderItem = function(ul, item){ 
    //code to do cool stuff 
};

來源

2013-07-30 13:40:17 MonkeyZeus

我與我的代碼，庫不支持數據看到的問題功能。它說它是未定義的。 Js文件已從jquery-ui.com下載（jquery-ui-1.10.3.custom.js）我是否將其與其他庫混合？ –

這似乎是正確的。您是否允許該網站在下載jQuery UI時包含所有必需的組件？此外，我正在使用jQuery 1.10.2，但我認爲1.9.1仍然很好。 – MonkeyZeus

是的，我允許包括所有必需的組件。我會嘗試再次下載並使用它。 –

回答

相關問題