Question

我试图以不同的方式进行自动完成，但根本没有任何作用。来自here和here

希望你帮助我们。我有一个使用Spring MVC + jsp + hibernate的项目。我想创建一个搜索文本框，它也可以作为客户姓氏的自动填充功能。

当我在控制器的帮助下打开客户端页面时，我通过模型发送一个包含客户端的列表和带有姓氏的列表，最后一个用于自动完成。

这是我的控制器：

@Controller
@RequestMapping("/clients")
public class ClientsController {

@Autowired
public ClientsService clientsService;

@Autowired
private ServicesService servicesService;

@Autowired
private OrdersService ordersService;

@Autowired
private Order_serviceService order_serviceService;

@Autowired
private ObjectMapper objectMapper;


@RequestMapping(method = RequestMethod.GET)
public String listClients(Model model) {
    List<Clients> allClients = clientsService.listClients(
            new RequestAllClientsEvent()).getClients();

    List<String> lastNamesList = new ArrayList<>();
    for(int i = 0; i < allClients.size(); i++){
        lastNamesList.add(allClients.get(i).getLast_name());    
    }
    Collections.sort(lastNamesList);
    String json = "";
    try{
        json = objectMapper.writeValueAsString(lastNamesList);
    } catch(Exception e){}

    model.addAttribute("clientsList", allClients);
    model.addAttribute("lastNamesList", json);
    return "clients";
}

然后在jsp页面中我想添加一些我的lastNamesList到脚本源：

<head>
<script type="text/javascript" src="http://code.jquery.com/jquery-1.10.2.js"> </script>
<script type="text/javascript" src="http://code.jquery.com/ui/1.10.3/jquery-ui.js"> </script>
<link rel="stylesheet" href="http://code.jquery.com/ui/1.10.2/themes/smoothness/jquery-ui.css" />
<script>
$(function() {
$( "#query" ).autocomplete({
source: lastNamesList
});
});
</script>
</head>

我的输入文本框是：

<div class="ui-widget">
<input class="form-control" type="search" id="query" name="query" required>
</div>

如果我只写source: lastNamesList：

，我想我可以得到类似的东西

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

能帮助我以正确的方式做到这一点。如果我能够使用我的控制器中的列表或数组，那将是很棒的。谢谢。

upd.changed我的控制器，添加了json转换，但它没有帮助。看起来脚本在我的页面上不起作用...更加困惑O_o

UPD。这是我的工作代码：

控制器：

@RequestMapping(value = "/searchlastname", method = RequestMethod.GET, headers = "Accept=*/*")
public
@ResponseBody
List<String> searchLastName(@RequestParam("term") String query) {
    List<Clients> clientsList = clientsService.searchClient(new SearchClientEvent(query)).getClients();
    List<String> lastnameList = new ArrayList<>();
    System.out.println("Found clients size: " + clientsList.size());

    for (Clients clients : clientsList) {
        lastnameList.add(clients.getLast_name());
    }

    Collections.sort(lastnameList);
    return lastnameList;
}

脚本：

$(document).ready(function () {
    $("#lastNameAuto").autocomplete({
        source: 'clients/searchlastname'
    });
});

jsp中的

：

<form class="form-horizontal" role="form" action="<c:url value="/clients/search"/>" method="get">
            <div class="input-group input-group-sm">
                <span class="input-group-addon"><spring:message code="label.enterClientInfo"/></span>

                <input class="form-control" type="search" id="lastNameAuto" name="query" required>

                    <span class="input-group-btn">
                        <button class="btn btn-default" type="submit">
                            <spring:message code="label.searchClient"/>
                        </button>
                    </span>
            </div>

        </form>

希望它可以帮助别人！ ;）

Answer 1

从您的更新中

您应该有一个模型类并进行显式转换以发送json对象。使用gson库，或者您可以通过发送列表来使用现有方法。

对于初学者，我建议您学习nice example here

希望这会有所帮助!!

使用数组或列表在JSP中自动完成文本框

1 个答案: