我正在使用JSF2.0并尝试从javascript调用java函数但无法实现此目的。 我有一个带数据表的jsp，其中2个列（Material和Desc）从弹出窗口jsp中获取数据。用户在其他2个字段（Unit和Qty）中输入数据，将这4个作为输入参数我有一个java返回其余值的函数（在我的示例中为NetPrice和NetTax） 我怎样才能在这里调用java方法，这样我就可以将值传递给我的jsp（test.jsp）文本字段。这是我的踪迹的代码片段
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<script LANGUAGE="JavaScript">
function testPrevSibling(buttonElement) {
try {
// alert(buttonElement);
var inputText = buttonElement.previousSibling;
while (inputText.nodeType!=1)
{
inputText =inputText.previousSibling;
}
// alert(inputText.id);
return inputText.id;
} catch(ex) {
alert("bad " + ex);
}
}
function testNextSibling(buttonElement) {
try {
// alert(buttonElement);
var inputText = buttonElement.nextSibling;
while (inputText.nodeType!=1)
{
inputText =inputText.nextSibling;
}
// alert("next sibling-->"+inputText.innerHTML);
return inputText;
} catch(ex) {
alert("bad " + ex);
}
}
// var inputId;
function popUp(URL,buttonRef) {
var inputId = testPrevSibling(buttonRef);
// alert(inputId);
day = new Date();
id = day.getTime();
URL = URL+"?inputId="+inputId;
eval("page" + id + " = window.open(URL, '" + id + "', 'toolbar=0,scrollbars=0,location=1,statusbar=0,menubar=0,resizable=1,width=250,height=800 left = 630,top = 502');");
}
function getDetails(inputId,matVal,desc){
var inputRef = document.getElementById(inputId);
var tdRef = inputRef.parentNode;
var tdNextRef = testNextSibling(tdRef);
// alert("td Ref-->"+tdRef+"td next Ref-->"+tdNextRef);
var descRef = tdNextRef.firstChild;
// alert("Child ref-->"+descRef);
// alert("Current JSP-->"+matVal+"input Id-->"+inputId+"desc-->"+desc);
document.getElementById(inputId).value = matVal;
descRef.value = desc;
}
</script>
<title>JSP Page</title>
</head>
<body>
<f:view>
<h:form>
<br>
<h:panelGrid bgcolor="#9AC8E6" width="100%">
<h:dataTable id="d" value="#{SalesCreate.orderBean.itemList}" var="iBean" bgcolor="#9AC8E6" border="10" cellpadding="5" cellspacing="3" rows="10" width="100%" dir="LTR" frame="hsides" rules="all" >
<h:column>
<f:facet name="header">
<h:outputText style=""value="Material" />
</f:facet>
<h:inputText id="mat" value="#{iBean.material}" > </h:inputText>
<h:commandButton value="..." onclick="javascript:popUp('MaterialList.jsp',this)" > </h:commandButton>
<h:commandButton style="display:none" value="..." onclick="" > </h:commandButton>
</h:column>
<h:column>
<f:facet name="header">
<h:outputText style=""value="Description" />
</f:facet>
<h:inputText id="desc" value="#{iBean.description}" > </h:inputText>
</h:column>
<h:column>
<f:facet name="header">
<h:outputText style=""value="Unit" />
</f:facet>
<h:inputText value="#{iBean.unit}" > </h:inputText>
</h:column>
<h:column>
<f:facet name="header">
<h:outputText value="Quantity"/>
</f:facet>
<h:inputText value="#{iBean.quantity}"> </h:inputText>
<h:form>
<h:commandLink value="get Pricing" action="#{SalesCreate.pricingForQuotation}" >
<f:param name="mat" value="#{iBean.material}" />
<f:param name="unt" value="#{iBean.unit}" />
<f:param name="qty" value="#{iBean.quantity}" />
</h:commandLink> </h:form>
</h:column>
<h:column>
<f:facet name="header">
<h:outputText style=""value="Unit Price" />
</f:facet>
<h:inputText value="#{iBean.netPrice}" > </h:inputText>
</h:column>
<h:column>
<f:facet name="header">
<h:outputText style=""value="Total Price" />
</f:facet>
<h:inputText value="#{iBean.netTax}" > </h:inputText>
</h:column>
</h:dataTable>
</h:panelGrid>
</h:form>
</f:view>
</body>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<script LANGUAGE="JavaScript">
function testNextSibling(buttonElement) {
try {
// alert(buttonElement);
var inputText = buttonElement.nextSibling;
while (inputText.nodeType!=1)
{
inputText =inputText.nextSibling;
}
alert("next sibling-->"+inputText.innerHTML);
return inputText.innerHTML;
} catch(ex) {
alert("bad " + ex);
}
}
function gup( name )
{
name = name.replace(/[\[]/,"\\\[").replace(/[\]]/,"\\\]");
var regexS = "[\\?&]"+name+"=([^&#]*)";
var regex = new RegExp( regexS );
var results = regex.exec( window.location.href );
if( results == null )
return "";
else
return results[1];
}
function setMaterialValue(mat,matNum){
// alert("mat " + mat);
var desc = testNextSibling(mat);
// alert("Description-->"+desc);
var inputId = gup("inputId");
window.opener.getDetails(inputId,matNum,desc);
// window.opener.document.getElementById(mat).value;
window.close();
}
</script>
<title>JSP Page</title>
</head>
<f:view>
<body>
<h:dataTable id="datatbl" value="#{SalesCreate.inquiryMaterialList}" var="materialList" bgcolor="#9AC8E6" border="10" cellpadding="5" cellspacing="3" rows="3000" width="100%" dir="LTR" rules="all">
<h:column>
<f:facet name="header">
<h:outputText style=""value="Material" />
</f:facet>
<h:form>
<h:commandLink style="" id="materialId" value="#{materialList.material}" onclick="javascript:setMaterialValue(this,#{materialList.material})" ></h:commandLink>
<h:outputText style="display:none" value="#{materialList.description}"></h:outputText>
</h:form>
</h:column>
<h:column>
<f:facet name="header">
<h:outputText style=""value="Description" />
</f:facet>
<h:form>
<h:commandLink style="" value="#{materialList.description}" onclick="javascript:setDescriptionValue(#{materialList.description})" ></h:commandLink></h:form>
</h:column>
</h:dataTable>
</body>
</f:view>
我尝试过使用commandLink，但我希望在文本字段失去焦点或类似内容时完成
答案 0 :(得分：1)
<h:inputText value="#{yourbackingBean.first}">
<f:ajax event="blur" render="cm" listener="#{yourbackingBean.caluculate}"/>
</h:inputText>
h:inputText value="#{yourbackingBean.second}" id="cm"/>
</h:form>
这里的事件可以像你一样选择 模糊，改变，KEYUP，KEYDOWN 等.........
监听器是方法 在特定事件时调用 触发。
这里caluclate是方法 由填充的逻辑组成 jsp中剩余的字段。
你的Backing Bean
private int first=1;
private int second=1;
//Getters and Setters
public void caluculate(AjaxBehaviorEvent evt)
{
second=first*1000;
}
答案 1 :(得分：0)
你做不到。您可以做的最多是发出AJAX请求。类似的问题已经在这里得到解答，How to access a java object in javascript from JSP?