Javascript/Javabean：合作不适用于计数器
我必须使用 javascript 和 javabean 制作一个简单的网络应用程序。实际的分配有点不同（包括 dropcoordinates 等），但这是我的测试文件问题：
每当单击红色方块时，它应该将我的 javabean 中的值加 1 并将其输出到文本字段。它正确显示它，但随后它以某种方式恢复到其原始值。当我调试时，它甚至不会进入我的方法 addUp()。第二个问题：当我刷新页面时，无论我是否单击了方块，它都会进入该方法。
这是我的代码：
网站index.xhtml
<?xml version='1.0' encoding='UTF-8' ?>
<!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"
xmlns:h="http://java.sun.com/jsf/html"
xmlns:f="http://java.sun.com/jsf/core"
xmlns:p="http://primefaces.prime.com.tr/ui">
<h:head>
<title>Facelet Title</title>
<script type="text/javascript"
src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>
</h:head>
<h:body>
<form>
<DIV id="move" style="width:150px;height:150px;background-color:pink;border:1px solid #999999"> </DIV>
<input id="test" value="${countController.counter}" />
<SCRIPT type="text/javascript">
$(document).ready(function(){
$("#move").click(function(event, ui){
alert(${countController.counter});
});
$("#droppable").click(function(event, ui){
alert(${countController.counter});
${countController.telOp()};
document.getElementById("test").value = ${countController.counter};
alert(${countController.counter});
//window.location.reload();
});
});
</SCRIPT>
<div id="droppable" style="width:150px;height:150px;background-color:red;border:1px solid #999999">Drop here</div>
</form>
</h:body>
</html>
CountController.java
/*
* To change this template, choose Tools | Templates
* and open the template in the editor.
*/
package controller;
import java.io.Serializable;
import javax.faces.bean.ManagedBean;
import javax.faces.bean.SessionScoped;
/**
*
* @author Laurent
*/
@ManagedBean
@SessionScoped
public class CountController implements Serializable{
/** Creates a new instance of countController */
public CountController() {
}
private int counter = 0;
public int getCounter() {
return counter;
}
public void setCounter(int counter) {
this.counter = counter;
}
public void telOp(){
counter++;
}
}
I have to make a simple webapplication using javascript and javabeans. The actual assignment is a bit different (including dropcoordinates and such), but here's my testing file problem:
Whenever the red square is clicked, it should add 1 to the value in my javabean and output it to a textfield. It shows it correctly, but then it somehow reverts back to its original value. When I debug, it doesn't even go into my method addUp(). Second problem: when I refresh the page, it DOES go into the method, no matter if I've clicked the square or not.
Here is my code:
Website index.xhtml
<?xml version='1.0' encoding='UTF-8' ?>
<!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"
xmlns:h="http://java.sun.com/jsf/html"
xmlns:f="http://java.sun.com/jsf/core"
xmlns:p="http://primefaces.prime.com.tr/ui">
<h:head>
<title>Facelet Title</title>
<script type="text/javascript"
src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>
</h:head>
<h:body>
<form>
<DIV id="move" style="width:150px;height:150px;background-color:pink;border:1px solid #999999"> </DIV>
<input id="test" value="${countController.counter}" />
<SCRIPT type="text/javascript">
$(document).ready(function(){
$("#move").click(function(event, ui){
alert(${countController.counter});
});
$("#droppable").click(function(event, ui){
alert(${countController.counter});
${countController.telOp()};
document.getElementById("test").value = ${countController.counter};
alert(${countController.counter});
//window.location.reload();
});
});
</SCRIPT>
<div id="droppable" style="width:150px;height:150px;background-color:red;border:1px solid #999999">Drop here</div>
</form>
</h:body>
</html>
CountController.java
/*
* To change this template, choose Tools | Templates
* and open the template in the editor.
*/
package controller;
import java.io.Serializable;
import javax.faces.bean.ManagedBean;
import javax.faces.bean.SessionScoped;
/**
*
* @author Laurent
*/
@ManagedBean
@SessionScoped
public class CountController implements Serializable{
/** Creates a new instance of countController */
public CountController() {
}
private int counter = 0;
public int getCounter() {
return counter;
}
public void setCounter(int counter) {
this.counter = counter;
}
public void telOp(){
counter++;
}
}
如果你对这篇内容有疑问，欢迎到本站社区发帖提问 参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱，如果其他用户或者作者回复了您的评论，将不能在第一时间通知您！
发布评论
评论（1）
您需要在托管 bean 中添加一个事件侦听器，
然后从 ui 中实现 ah:commandLink 或 h:commandButton 来调用操作事件。
You need to add an event listener in your managed bean such as
and then from the ui, you implement a h:commandLink or h:commandButton to invoke the action event.