Apex Code Development You need to sign in to do that
Don't have an account?
Script validation is not working when included from StaticResource, Any Suggestions?
Hi,
I have a VF page that has validation for the field in the form when i include the script in the Static Resource.
Please help me regarding this issue.
VF page that is not working is below,
<apex:page controller="Sample">
<!-- Javascript -->
<apex:includeScript value="{!URLFOR($Resource.scriptValidation, 'jsFolder/jj.js')}"/>
<!-- Javascript -->
<apex:form >
<apex:outputLabel value="Account Name"/>
<apex:inputText value="{!nam}" id="nam"/>
<apex:commandButton value="Insert" onclick=" return validate();"/>
</apex:form>
</apex:page>
VF page that was working fine when have a script inside the page instead of static resource is given below.
<apex:page controller="Sample">
<!-- Javascript -->
<apex:includeScript value="{!URLFOR($Resource.scriptValidation, 'jsFolder/jj.js')}"/>
<script type="text/javascript">
function validate()
{
var a = document.getElementById('{!
$Component.nam}').value;
if(a == '' || a == NULL )
{
alert("Account name is mandatory");
return false;
}
}
</script>
<!-- Javascript -->
<apex:form >
<apex:outputLabel value="Account Name"/>
<apex:inputText value="{!nam}" id="nam"/>
<apex:commandButton value="Insert" onclick=" return validate();"/>
</apex:form>
</apex:page>
Please help me regarding this issue.
Hi,
I have found the solution for this.
This validation in Static resource is not working because of using $Component. If you are usign script in VF page to refer the ID of a VF page component, you can use document.getElementById('{!$Component.PageId.FormID.InputID}').value
But, you can't use the '{!$Component.}'.valueoutside the VF page while refering through static resource. So, the format of referring the id value in the Script is document.getElementById("PageId:FormID:InputID").value.
PageId:FormID:InputID is the id generated by running the VF page. I got this by using Inspect Element option in the browser.
So, My VF page shopuld be like this,
<apex:page controller="Sample" id="pg">
<!-- Javascript -->
<apex:includeScript value="{!$Resource.scriptValidation}"/>
<!-- Javascript -->
<apex:form id="frm">
<apex:outputLabel value="Account Name"/>
<apex:inputText value="{!nam}" id="fn"/>
<apex:commandButton value="Insert" onclick=" validate();"/>
</apex:form>
</apex:page>
Script should be like the following,
<script type="text/javascript">
function validate() {
var a = document.getElementById("pg:frm:fn").value;
if(a == '' || a == NULL ) {
alert("Account name is mandatory");
}
else {
alert("Account has been inserted");
}
}
</script>
Hope this may help for all...!
Anyways thanks for your reply...!
All Answers
Have you checked the source of the page and tried to pull down the resources through the browser to make sure that the script is definitely included?
Hi,
Thanks for your reply. But, the script I include in VF page is not converted to HTML script while running the page.
I think so, that was the problem. Can you guess what should be done for this issue?
My page source shows the following,
<apex:includeScript value="{!URLFOR($Resource.scriptValidation, 'jsFolder/jj.js')}"/>
</head> // This should be converted somthing like '<Script src='<link>'/>
<apex:form id="frm">
<apex:outputLabel value="Account Name"/>
<apex:inputText value="{!nam}" id="nam"/>
<apex:commandButton value="Insert" onclick="validate();"/>
</apex:form>
Are those escape codes actually appearing in the HTML source? Are you including the Visualforce markup from a static resource?
I'm not including those escape codes in VF page. My VF page is what is given below,
VF page that is not working is below,
<apex:page controller="Sample">
<!-- Javascript -->
<apex:includeScript value="{!URLFOR($Resource.scriptValidation, 'jsFolder/jj.js')}"/>
<!-- Javascript -->
<apex:form >
<apex:outputLabel value="Account Name"/>
<apex:inputText value="{!nam}" id="nam"/>
<apex:commandButton value="Insert" onclick=" return validate();"/>
</apex:form>
</apex:page>
Hi,
I have found the solution for this.
This validation in Static resource is not working because of using $Component. If you are usign script in VF page to refer the ID of a VF page component, you can use document.getElementById('{!$Component.PageId.FormID.InputID}').value
But, you can't use the '{!$Component.}'.valueoutside the VF page while refering through static resource. So, the format of referring the id value in the Script is document.getElementById("PageId:FormID:InputID").value.
PageId:FormID:InputID is the id generated by running the VF page. I got this by using Inspect Element option in the browser.
So, My VF page shopuld be like this,
<apex:page controller="Sample" id="pg">
<!-- Javascript -->
<apex:includeScript value="{!$Resource.scriptValidation}"/>
<!-- Javascript -->
<apex:form id="frm">
<apex:outputLabel value="Account Name"/>
<apex:inputText value="{!nam}" id="fn"/>
<apex:commandButton value="Insert" onclick=" validate();"/>
</apex:form>
</apex:page>
Script should be like the following,
<script type="text/javascript">
function validate() {
var a = document.getElementById("pg:frm:fn").value;
if(a == '' || a == NULL ) {
alert("Account name is mandatory");
}
else {
alert("Account has been inserted");
}
}
</script>
Hope this may help for all...!
Anyways thanks for your reply...!