我对Visualforce和Apex很陌生。我正在尝试将焦点设置在顶点输入文本字段上,该字段放置在 ouputpanel 内,该字段将根据操作函数弹出。我尝试使用javascript函数设置焦点,但没有一个有效。谁能帮我解决这个问题?
视觉力代码:
<apex:outputlabel onclick="fnUpdateName('{!ID}','{!Name}');" style="font-weight:normal !important;" > Edit name </apex:outputlabel>
<apex:actionfunction name="actUpdateName" action="{!ShowPopup}" reRender="UpdateName">
<apex:param name="Id" value="" assignTo="{!Id}"/>
<apex:param name="Name" value="" assignTo="{!Name}"/>
</apex:actionfunction>
输出面板:
<apex:outputPanel id="UpdateName">
<apex:outputPanel styleClass="popupBackground" layout="block" rendered="{!update}"/>
<apex:outputPanel styleClass="customPopup" layout="block" rendered="{!update}">
<apex:pageBlock >
<div class="panel panel-default">
<div class="panel-heading">
<h4><b Style="color:#555">Edit Name</b></h4>
</div>
<div class="panel-body">
<table class="tblPopUp">
<tr>
<td><font style="color:#337ab7">Name: </font></td>
<td> <apex:inputText id="newName" value="{!Name}" styleClass="inputField" onfocus="this.value = this.value;" /></td> <br/>
</tr>
</table>
<br/><br/>
<apex:commandButton value="Update" action="{!UpdateName}" Render="tblBlock"/>
<apex:commandButton value="Cancel" action="{!ClosePopup}" />
</div>
</div>
</apex:pageBlock>
</apex:outputPanel>
</apex:outputPanel>
JS函数:
function fnUpdateName(ID, Name)
{
document.getElementById('{!$Component.frmid.DetBlock.tblBlock.popUpBlock.updatePageBlock.newName}').focus();
actUpdateName(ID, Name);
}
另外,每当我根据组件ID和类名使用setFocus时,我都会收到以下Javascript错误。
未捕获的类型错误: 无法读取 null 的属性"焦点"
任何帮助真的非常感谢..!!
你的apex:inputText字段是嵌套的,因此你应该更完整的组件路径说明符,因为它在这里描述。
您应该在 VF 组件上定义一些 ID:
- 对于顶点:表单
- 对于顶点:页面块
最后,输入的完整路径将如下所示:
'{!$Component.form_id.pageBlock_id.newName}'
输出面板:
<apex:form id="frm">
<apex:outputPanel id="UpdateName">
<apex:outputPanel styleClass="popupBackground" layout="block" rendered="{!update}"/>
<apex:outputPanel styleClass="customPopup" layout="block" rendered="{!update}">
<apex:pageBlock id="updatePageBlock">
<div class="panel panel-default">
<div class="panel-heading">
<h4><b Style="color:#555">Edit Name</b></h4>
</div>
<div class="panel-body">
<table class="tblPopUp">
<tr>
<td><font style="color:#337ab7">Name: </font></td>
<td> <apex:inputText id="newName" value="{!Name}" styleClass="inputField" onfocus="this.value = this.value;" /></td> <br/>
</tr>
</table>
<br/><br/>
<apex:commandButton value="Update" action="{!UpdateName}" Render="tblBlock"/>
<apex:commandButton value="Cancel" action="{!ClosePopup}" />
</div>
</div>
</apex:pageBlock>
</apex:outputPanel>
</apex:outputPanel>
</apex:form>
JS函数:
function fnUpdateName(ID, Name) {
document.getElementById('{!$Component.frm.updatePageBlock.newName}').focus();
actUpdateName(ID, Name);
}