我对 Dojo 很陌生,并且正在尝试使用 JSF 编写关于 DOJO 的教程。我通过许多链接了解如何将 DOJO 与 JSF 集成。
DOJO 版本:1.9 JSF 版本:2.0 带 JSP
我编写了一个同时具有 JSF 和 DOJO 的代码,但显然它不能正常工作。
首先,在 Eclipse (IDE) 中无法识别 dojo 标记。记住每一个标签是一种痛苦。IDE 中的每个标签都以黄色突出显示,表示未定义的属性名称。我不知道为什么我不能按 ALT+Space 并获取 dojo 的组件。为什么即使在包含所有脚本之后,组件也没有解析。
代码片段:
<%@ 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"%>
<%@ taglib uri="http://richfaces.org/rich" prefix="rich"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<!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">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<style type="text/css">
@import url("${pageContext['request'].contextPath}/script/
dojo_lib/dijit/themes/claro/claro.css");
@import url("${pageContext['request'].contextPath}/script/
dojo_lib/dojo/resources/dojo.css");
</style>
<script type="text/javascript">
var djConfig = {
parseOnLoad: true,
isDebug: false,
};
</script>
<script type="text/javascript" src="${pageContext['request'].contextPath}/script/dojo_lib/dojo/dojo.js"></script>
<script type="text/javascript">
dojo.require("dojo.parser");
dojo.require("dijit.form.ValidationTextBox");
dojo.require("dijit.form.Textarea");
</script>
<script type="text/javascript">
function dojoInit(){
dijit.registry.byClass('dijit.form.ValidationTextBox').forEach(function(pane){
pane.setValue(pane.domNode.previousSibling.value);
});
dijit.registry.byClass('dijit.form.Textarea').forEach(function(pane){
pane.setValue(pane.domNode.previousSibling.value);
});
}
dojo.addOnLoad(dojoInit);
</script>
<script type="text/javascript">
function setDojoValue(){
dijit.registry.byClass('dijit.form.ValidationTextBox').forEach(function(pane){
pane.domNode.previousSibling.value = pane.getValue();
});
dijit.registry.byClass('dijit.form.Textarea').forEach(function(pane){
pane.domNode.previousSibling.value = pane.getValue();
});
}
</script>
</head>
<body class="claro">
<f:view>
<h3>Project</h3>
<h:form id="project">
<table>
<tbody>
<tr>
<td>Project name:</td>
<td><h:inputHidden value="#{projectFormBean.projectName}"/><f:verbatim>
<input type="text" name="projectName" dojotype="dijit.form.ValidationTextBox" regExp="[\w]+"
required="true" invalidMessage="Invalid.Only Alphabets required" requiredMessage="Input Required"/></f:verbatim>
</td>
</tr>
<tr>
<td>Project description: </td>
<td><h:inputHidden value="#{projectFormBean.projectDescription}"/><f:verbatim>
<textarea dojotype="dijit.form.Textarea" style="width:80%">
</textarea></f:verbatim>
</td>
</tr>
</tbody>
</table>
<h:commandButton id="button_submit" actionListener="#{projectFormBean.invokeAction}"
value="Submit" type="submit" onclick="setDojoValue();"></h:commandButton>
</h:form>
</f:view>
<script>
require([
'dojo/parser',
'dojo/domReady!'
], function(parser){
parser.parse(); // tell dojo to check the DOM for widgets
});
</script>
</body>
</html>
当页面加载时,3 个组件可见,而不是 2 个。
一个。输入带有“X”标记的文本。我无法写入此组件 b。项目名称的输入文本。C。项目描述的文本区域。
面临以下问题:
一个。出现了不应出现的带有 X 的组件。湾。项目名称字段具有验证。但是,只有在我输入空格后,验证才会触发。否则它不会触发。C。验证消息显示在文本区域下方,而理想情况下它应该显示在相应组件的正下方。d。在表单提交时,不会触发验证。我不知道输入值是否正确。e. 在 Backing bean 操作侦听器中未获得任何值。两个字段都打印为空白。
请有人指导。