jquery - Spring MVC autocomplete works just in one page in the eclipse project -
i applied tutorial doing autocomplete in project alright when put autocomplete in page want put same code in page , not working. input fileds in 2 pages have same name of "id" , include necessary files in second page in first. wrong ? thank you.
this code of second page :
<!doctype html public "-//w3c//dtd html 4.01 transitional//en" "http://www.w3.org/tr/html4/loose.dtd"> <%@ page import="org.springframework.security.core.context.securitycontextholder"%> <%@ page import="org.springframework.security.core.userdetails.userdetails"%> <%@ page import="org.springframework.security.core.grantedauthority"%> <%@ page language="java" contenttype="text/html; charset=utf-8" pageencoding="utf-8"%> <%@ taglib prefix='security' uri='http://www.springframework.org/security/tags'%> <%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%> <%@ taglib prefix="form" uri="http://www.springframework.org/tags/form"%> <html> <head> <meta http-equiv="content-type" content="text/html; charset=utf-8"> <title>gestion des fiches de service</title> <link rel="stylesheet" href="${pagecontext.request.contextpath}/css/style.css" type="text/css" /> <link rel="stylesheet" href="${pagecontext.request.contextpath}/css/tabcookie.css" type="text/css" /> <script type="text/javascript" src="${pagecontext.request.contextpath}/js/jquery-ui.js"></script> <script src="${pagecontext.request.contextpath}/js/jquery-1.9.1.min.js"></script> <script src="${pagecontext.request.contextpath}/js/functions.js"></script> <link rel="stylesheet" type="text/css" href="${pagecontext.request.contextpath}/css/jquery-ui.css" /> <link rel="stylesheet" type="text/css" href="${pagecontext.request.contextpath}/css/tcal.css" /> <script type="text/javascript" src="${pagecontext.request.contextpath}/js/tcal.js"></script> <script src="${pagecontext.request.contextpath}/js/jquery.easytabs.min.js"></script> <script src="${pagecontext.request.contextpath}/js/jquery.easytabs.js"></script> <script src="${pagecontext.request.contextpath}/js/jquery.hashchange.min.js"></script> <script type="text/javascript"> function split(val) { return val.split(/,\s*/); } function extractlast(term) { return split(term).pop(); } $(document).ready(function() { $('#tab-container').easytabs(); $("#nom").autocomplete({ source : '${pagecontext.request.contextpath}/get_names' }); $("#cin").autocomplete({ source : '${pagecontext.request.contextpath}/get_cin' }); $("#technologies").autocomplete({ source : function(request, response) { $.getjson("${pagecontext. request. contextpath}/get_nam", { term : extractlast(request.term) }, response); }, search : function() { // custom minlength var term = extractlast(this.value); if (term.length < 1) { return false; } }, focus : function() { // prevent value inserted on focus return false; }, select : function(event, ui) { var terms = split(this.value); // remove current input terms.pop(); // add selected item terms.push(ui.item.value); // add placeholder comma-and-space @ end terms.push(""); this.value = terms.join(", "); return false; } }); }); </script> </head> <body> <div id="look"> <form:form method="get" action="${pagecontext.request.contextpath}/#" modelattribute="ag"> <table id="tabmenu" class="test"> <tr> <td><input type="radio" name="choice" id="np" onclick="affichenp();" />nom et prenom :</td> <td><input type="text" name="nom" id="nom" class="round default-width-input" /></td> <td><input class="button round blue image-right ic-right-arrow" type="submit" value="" id="nombut"></td> </tr> </table> </form:form> <form:form method="get" action="${pagecontext.request.contextpath}/#" modelattribute="ag"> <table id="tabmenu" class="test"> <tr> <td><input type="radio" name="choice" id="ns" onclick="affichecin();" />cin :</td> <td><input type="text" name="cin" id="cin" class="round default-width-input" /></td> <td><input class="button round blue image-right ic-right-arrow" type="submit" value="" id="cinbut"></td> </tr> </table> </form:form> <form:form method="get" action="${pagecontext.request.contextpath}/#" modelattribute="ag"> <table id="tabmenu" class="test"> <tr> <td><input type="radio" name="choice" id="ns" onclick="afficheppr();" />numéro de somme :</td> <td><input type="text" name="ppr" id="ppr" class="round default-width-input" /></td> <td><input class="button round blue image-right ic-right-arrow" type="submit" value="" id="pprbut"></td> </tr> </table> </form:form> </div> </body> </html> just 1 thing, in first page scipt working have 1 script in second page have 2 scripts : jquery tabs , autocomplete
include jquery first , jqueryui
<script src="${pagecontext.request.contextpath}/js/jquery-1.9.1.min.js"></script> <script type="text/javascript" src="${pagecontext.request.contextpath}/js/jquery-ui.js"></script>
Comments
Post a Comment