我有一个XPage,它使用JQuery对话框和客户端验证来验证用户处理的输入。问题是,当我单击“添加”按钮时,客户端验证有效,但是在服务器端找不到这些字段的属性。当用户单击“打开对话框”按钮时,将显示对话框,这是魔术发生的地方,这是我的按钮(例如,只有一个属性):
<xp:button id="save_part_btn" value="+Add" style="float:right;">
<xp:eventHandler event="onclick" submit="true"
refreshMode="complete">
<xp:this.action><![CDATA[#{javascript:
/*
var estdoc:NotesDocument=database.getDocumentByUNID(doc_source.getDocument().getParentDocumentUNID())
var estPartdoc:NotesDocument=estdoc.getParentDatabase().createDocument()
Ignore it
estPartdoc.replaceItemValue('Form','Estimate_Cost_Part')
estPartdoc.replaceItemValue('Predoc',estdoc.getUniversalID())
estPartdoc.replaceItemValue('$OSN_IsSaved','1')
*/
estPartdoc.replaceItemValue('TSNB_All',getComponent('input_tsnb_all').getValue())
}]]></xp:this.action>
<xp:this.script><![CDATA[
var isValid = true;
var result = "";
function isStringEmpty(string2Check)
{
return string2Check == "" || string2Check[0] == " ";
}
function isNumberCorrect(number2Check)
{
return /^[1-9]\d*(,\d{1,3})?$/.test(number2Check.toString());
}
if(isStringEmpty(document.getElementById("#{id:input_tsnb_all}").value))
{
wholeValid = false;
result += '-The field cannot be empty\n'
}
else if(!isNumberCorrect(document.getElementById("#{id:input_tsnb_all}").value))
{
wholeValid = false;
result += '-The field is not correct\n'
}
if(!isValid)
alert(result)
return isValid;
]]></xp:this.script>
</xp:eventHandler>
</xp:button>
客户端验证非常有效-当用户输入不正确时,将显示
alert
消息。但是,在服务器端找不到input_tsbn_all
,并且无法创建具有此属性的文档。确实可以,但是null
中的input_tsbn_all的值。问题是什么?该属性的标记为:
<xp:tr>
<xp:td><xp:label value="All:"/></xp:td>
<xp:td>
<xp:inputText id="input_tsnb_all"
disableClientSideValidation="true"
styleClass="doc_field_textinput" size="40" >
<xp:this.converter>
<xp:convertNumber pattern="0.000"></xp:convertNumber>
</xp:this.converter>
</xp:inputText>
</xp:td>
</xp:tr>
我的JQuery代码:
var dialogAddPartDiv = $('.dialogAddPart');
$('.addButton').click(function()
{
dialogAddPartDiv.dialog('open');
});
dialogAddPartDiv.dialog(
{
create: function (event, ui) {
$(".ui-corner-all").css('border-bottom-right-radius','8px');
$(".ui-corner-all").css('border-bottom-left-radius','8px');
$(".ui-corner-all").css('border-top-right-radius','8px');
$(".ui-corner-all").css('border-top-left-radius','8px');
$(".ui-dialog").css('border-bottom-left-radius','0px');
$(".ui-dialog").css('border-bottom-right-radius','0px');
$(".ui-dialog").css('border-top-left-radius','0px');
$(".ui-dialog").css('border-top-right-radius','0px');
$('.ui-dialog-titlebar-close').css('margin', '-25px -20px 0px 0px').css('border', 'solid 2px').css('border-radius', '15px').css('border-color', '#05788d');
$('.ui-dialog-titlebar-close').css('width', '25px').css('height', '25px');
},
autoOpen: false,
modal: true,
beforeClose : function(event)
{
if(!confirm("This won't be saved. Continue?"))
{
return false;
}
else
{
}
},
width:600,
resizable: false
});
document.getElementsByClassName('ui-dialog-titlebar-close')[0].setAttribute('title', 'Close it?');
就像这样在页面上声明隐藏的div:
<xp:div styleClass="dialogAddPart">
最佳答案
您需要将输入绑定到通过请求持久存在的对象属性。一个愚蠢的例子可能是利用作为Map的viewScope
对象。
<xp:inputText id="input_tsnb_all" value="#{viewScope.myInput}">
...
您稍后在代码中要做的是查找
viewScope.myInput
变量以执行所需的操作,而不是在ViewRoot
树中查找组件。对您来说,我最好的建议是鼓励您建立一些JSF基础知识,以便理解为什么要这样做。
ages,XPages使JSF的最坏迭代成为可能,从而可以正确地学习事物。它大多数都推动了一个基础概念-旧的Notes开发人员思维方式-阻止您按照框架的预期方式(即MVC)工作。
我不会告诉您避免这样做,因为您在Internet上看到的有关该主题的大部分内容都是老式汤。但是,即使您稍加关心,也可以阅读一本不太新的JSF书籍并从那里学习。或者,免费,您可能想看看here。当然,您需要将阅读的内容与XPages中实际可用的内容进行中介,因为很遗憾,XPages本身就是对JSF的解释。
关于javascript - XPages getComponent()无法正常工作,我们在Stack Overflow上找到一个类似的问题:https://stackoverflow.com/questions/48320750/