jQuery timepicker addon not work with struts2-jquery

Question

I'm working with Struts 2 and jQuery. The plugin of timepicker doesn't work.

My JSP:

<?xml version="1.0" encoding="ISO-8859-1" ?>
<%@ page language="java" contentType="text/html; charset=ISO-8859-1"
pageEncoding="ISO-8859-1"%>
<%@ taglib prefix="sj" uri="/struts-jquery-tags" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"                 
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1" />
<title>TestPicker</title>
<sj:head jqueryui="true" locale="es" jquerytheme="redmond" />
<script type="text/javascript" src="js/jquery-ui-timepicker-addon.js"></script> 
<style type="text/css">
    .ui-timepicker-div .ui-widget-header { margin-bottom: 8px; }
.ui-timepicker-div dl { text-align: left; }
.ui-timepicker-div dl dt { float: left; clear:left; padding: 0 0 0 5px; }
.ui-timepicker-div dl dd { margin: 0 10px 10px 45%; }
.ui-timepicker-div td { font-size: 90%; }
.ui-tpicker-grid-label { background: none; border: none; margin: 0; padding: 0; }   
.ui-timepicker-rtl{ direction: rtl; }
.ui-timepicker-rtl dl { text-align: right; padding: 0 5px 0 0; }
.ui-timepicker-rtl dl dt{ float: right; clear: right; }
.ui-timepicker-rtl dl dd { margin: 0 45% 10px 10px; }       
</style>
<script type="text/javascript">
$(function(){
   $('#txtTime').timepicker({});
});
</script>
</head> 
<body>
<input id="txtTime" type="text" name="txtTime" value="" ></input>
</body>
</html>

It generates this HTML:

<script type="text/javascript" src="/Asistencia/struts/js/base/jquery-1.10.2.min.js"> 
 </script>
<script type="text/javascript" 
  src="/Asistencia/struts/js/base/jquery.ui.core.min.js?s2j=3.6.1"></script>
 <script type="text/javascript"  
src="/Asistencia/struts/js/plugins/jquery.subscribe.min.js?s2j=3.6.1"></script>

 <script type="text/javascript"   
    src="/Asistencia/struts/js/struts2/jquery.struts2.min.js?s2j=3.6.1"></script>

<script type="text/javascript">
$(function() {
jQuery.struts2_jquery.version="3.6.1";
jQuery.scriptPath = "/Asistencia/struts/";
jQuery.struts2_jquery.local = "es";
jQuery.struts2_jquery.gridLocal = "es";
jQuery.struts2_jquery.timeLocal = "es";
jQuery.ajaxSettings.traditional = true;

jQuery.ajaxSetup ({
    cache: false
});

jQuery.struts2_jquery.require("js/struts2/jquery.ui.struts2.min.js?s2j=3.6.1");

     });
     </script>

        <link id="jquery_theme_link" rel="stylesheet"  
      href="/Asistencia/struts/themes/redmond/jquery-ui.css?s2j=3.6.1"  
         type="text/css"/>


       <script type="text/javascript" src="js/jquery-ui-timepicker-addon.js"></script>

I think this code ?s2j=3.6.1 gets the problem.

Page of TimePicker addon

Now, I will try with ama3+anytime plugin.

Answer 1

This parameter is not the problem, it is just for internal use and tells the plugin about version of plugin. The problem is in your jQuery code because you are trying to bind a timepicker on the element before this element is created. Try

$(document).ready(function(){
   $('#txtTime').timepicker({
     timeFormat: "hh:mm tt"
   });
});

jQuery timepicker addon not work with struts2-jquery

Question

1 answers

solution1
0 2013-12-19 20:01:33

jQuery timepicker addon not work with struts2-jquery

Question

1 answers

solution1 0 2013-12-19 20:01:33

solution1
0 2013-12-19 20:01:33