Javascript 日期选择器不是'；t在搜索弹出窗口内工作_Javascript_Jquery_Struts2_Struts2 Jquery

Javascript 日期选择器不是'；t在搜索弹出窗口内工作

javascript jquery struts2

Javascript 日期选择器不是'；t在搜索弹出窗口内工作,javascript,jquery,struts2,struts2-jquery,Javascript,Jquery,Struts2,Struts2 Jquery,我已经用Struts2和它的JQuery插件工作了大约一周，我有点迷路了我尝试做的最后一件事是在我显示在页面上的jqGrid中实现按日期搜索。为了这个，我跟随问题是它不起作用，因为当我点击搜索字段，它应该弹出日期选择器，它不会弹出任何东西。我调试了javascript代码，发现当它试图调用datepicker（）函数时，出现了一个错误：“uncaughttypeerror:Undefined不是函数” 我不知道为什么会发生这种情况，因为我正在使用Struts2 jquery plugin

我已经用Struts2和它的JQuery插件工作了大约一周，我有点迷路了

我尝试做的最后一件事是在我显示在页面上的jqGrid中实现按日期搜索。为了这个，我跟随

问题是它不起作用，因为当我点击搜索字段，它应该弹出日期选择器，它不会弹出任何东西。我调试了javascript代码，发现当它试图调用

datepicker（）

函数时，出现了一个错误：“uncaughttypeerror:Undefined不是函数”

我不知道为什么会发生这种情况，因为我正在使用

Struts2 jquery plugin 3.7.1

。我在下面发布我的JSP代码（我省略了所有与问题无关的网格行）：


日期选择=函数（元素）{
$（元素）.日期选择器({
第一天：1
});
$（'ui datepicker div'）.css（“z-index”，2000年）；
}
测试
...
...

我是否遗漏了任何导入/引用或类似内容

更新
最近我发现了一个黑客，它告诉我这个问题与datepicker的导入/引用有关：

我所做的只是在JSP中添加一个新标记：

通过这样做，我想我是在强迫框架自动导入和初始化一个日期选择器，所以它可以工作，但这不是我正在寻找的解决方案

因此，我的问题是： 如何导入/引用和初始化日期选择器？

默认情况下，

不会加载所有jQuery ui资源，而是按需加载。当您添加了

标记时，它还加载了所需的资源，并且您的脚本能够运行

为了一次加载所有资源，将

标记的

loadOnce

属性设置为

true

尝试用jQuery替换

。要检查datepicker是否存在，请在console中运行

jQuery.fn.datepicker

。@CerlinBoss您能澄清您建议的替换吗？我在控制台中运行了

jQuery.fn.datepicker

，但遗憾的是，它返回的是未定义的。这意味着您尚未包含datepicker库。非常感谢您的回复@AleksandrM。它似乎与您答复的解决方案配合使用，请将其作为答复发布，我将接受：）。我已经搜索了文档并阅读了LoadOnce的功能，但仍然不理解。。你能解释一下吗？@AleksandrM好的，我做了一些研究，终于明白了

loadAtOnce

的意思，但如果你想把它包括进来，让你的答案更充实，我认为社区会更感兴趣：）

 <%@ 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>