javascript - jquery datepicker not working inside <h:form> -
i got datepicker code https://jqueryui.com/datepicker/
the source works such not work (no calendar pops up) inside tags inside jsp. source works fine (popup calendar comes) if input text placed outside h:form. using eclipse , jsf develop page
here code:
<%@ page language="java" contenttype="text/html; charset=iso-8859-1" pageencoding="iso-8859-1"%> <%@ taglib prefix="f" uri="http://java.sun.com/jsf/core"%> <%@ taglib prefix="h" uri="http://java.sun.com/jsf/html"%> <!doctype html public "-//w3c//dtd html 4.01 transitional//en" "http://www.w3.org/tr/html4/loose.dtd"> <html> <head> <meta http-equiv="content-type" content="text/html; charset=iso-8859-1"> <link rel="stylesheet" href="http://code.jquery.com/ui/1.11.4/themes/smoothness/jquery-ui.css"> <script src="http://code.jquery.com/jquery-1.10.2.js"></script> <script src="http://code.jquery.com/ui/1.11.4/jquery-ui.js"></script> <script> $(function() { $( "#datepicker" ).datepicker(); }); </script> <title>insert title here</title> </head> <body> <f:view> <h:form> <h:outputtext value="select date" /> <h:inputtext id="datepicker"/> </h:form> </f:view> </body> </html>
try see in firebug or developer console real id of datepicker. jsf adds form's id element, "formid:datepicker", if $('#datepicker'), jquery can't find it.