我已经使用 Struts2 和它的 JQuery 插件工作了大约一个星期,但我有点不知所措。
我尝试做的最后一件事是在页面上显示的 jqGrid 中按日期执行搜索。为此,我关注了this tutorial here.。
问题是它不起作用,因为当我单击应该弹出日期选择器的搜索字段时,它不会弹出任何内容。
我调试了 javascript 代码,发现当它尝试调用 datepicker()
时函数,出现错误“Uncaught TypeError: Undefined is not a function”。
我不确定为什么会这样,因为我正在使用 Struts2-jquery-plugin 3.7.1
.我在下面发布我的 JSP 代码(我省略了所有与问题无关的网格行):
<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<%@taglib prefix="s" uri="/struts-tags"%>
<%@ taglib prefix="sj" uri="/struts-jquery-tags"%>
<%@ taglib prefix="sjg" uri="/struts-jquery-grid-tags"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<sj:head jqueryui="true" jquerytheme="south-street" locale="es" />
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<script type="text/javascript">
datePick = function(elem) {
$(elem).datepicker({
firstDay : 1
});
$('#ui-datepicker-div').css("z-index", 2000);
}
</script>
<title>Testing</title>
</head>
<body>
<s:url var="remoteurl" action="reservationList"/>
<div id="grid">
<sjg:grid
id="reservationsGrid"
caption="%{getText('reservationTable.title')}"
dataType="json"
href="%{remoteurl}"
pager="true"
gridModel="gridModel"
rowList="10,15,30"
rowNum="15"
navigator="true"
navigatorSearch="true"
autowidth="true"
navigatorSearchOptions="{multipleSearch:true, closeAfterSearch:true}">
...
<sjg:gridColumn name="date" index="date" title="Date" search="true" formatter="date" sortable="true" formatoptions="{newformat : 'd/m/Y H:i', srcformat : 'Y-m-d H:i'}" searchoptions="{sopt:['eq','lt','le','gt','ge'], dataInit:datePick}"/>
...
</sjg:grid>
</div>
</body>
</html>
我是否遗漏了任何导入/引用或类似的东西?
更新
最近我发现了一个黑客,它告诉我这个问题与日期选择器的导入/引用有关:
我所做的只是在我的 JSP 中添加一个新标签:
<sj:datepicker style="display:none" disabled="true"></sj:datepicker>
通过这样做,我想我是在强制框架自动导入和初始化一个日期选择器,所以它可以工作,但这不是我正在寻找的解决方案。
那么我的问题是: 如何导入/引用和初始化日期选择器?
最佳答案
默认 <sj:head>
不会加载所有 jQuery ui 资源,而是按需加载。当您添加 <sj:datepicker>
标记它还加载了所需的资源,并且您的脚本能够运行。
为了一次加载所有资源设置loadAtOnce
<sj:head>
的属性标记为 true
.
<sj:head jqueryui="true" loadAtOnce="true"
jquerytheme="south-street" locale="es" />
关于javascript - Datepicker 在搜索弹出窗口中不起作用,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/27292484/