function readOnly(count){ }
Sign Up ›
Starting November 20, the site will be set to read-only. On December 4, 2023,
forum discussions will move to the Trailblazer Community.
Learn More

Browse by Topic
ShowAll Questionssorted byDate Posted
+ Start a Discussion
Ashish BiswasAshish Biswas 

JS Query not called

I have written a simple Javascript query as given below. The function are not called on click event. No error being displayed though - need help

<apex:page controller="clsEmployee">
    <apex:form id="frmEmp">
        <apex:pageBlock title="Enter Employee Name" id="pbEmp">
            <apex:pageBlockSection columns="2" id="pbsEmp">
                <apex:inputText label="Employee Name" value="{!empName}" id="txtEmpName"/>
            </apex:pageBlockSection>
            <apex:pageBlockSection columns="2">
                <apex:commandButton value="Save Data"  onclick="CheckField()" action="{!InsertName}"/>
                <apex:commandButton value="Clear Text" onclick="ClearValue()"/>
            </apex:pageBlockSection>
        </apex:pageBlock>
    </apex:form>
    <script>
        function ClearValue(){
            document.getElimentById('{!$Component.frmEmp.pbEmp.pbsEmp.txtEmpName}').value = '';
            alert("Value cleared");
        }
    
        function CheckField(){
            if(document.getElimentById('{!$Component.frmEmp.pbEmp.pbsEmp.txtEmpName}').value == null ||
                  document.getElimentById('{!$Component.frmEmp.pbEmp.pbsEmp.txtEmpName}').value = ''){
                
                alert("Employee Name can not be empty, Please enter Employee Name!");
            }
        }
    </script>
</apex:page>
ManojjenaManojjena
Hi Ashish ,

Try to change the script to some other place ,may be within the form or to the top of the page .

**If it solve you rproblem then chose this as best answer to help others .
AnjaneyluAnjaneylu
Hi Manoj,
What is the function of
document.getElimentById('{!$Component.frmEmp.pbEmp.pbsEmp.txtEmpName}').value = '';
Thanking you in Advance..
Regards,
Anji reddy
 
ManojjenaManojjena
Hi Anji ,
Document is a class in javascipt.
getElemenyById() is a method in that class .
$Component.frmEmp.pbEmp.pbsEmp.txtEmpName  -
$component is a global varibale to access component in salesforce .
all dot separated are id of your parent.child.grandchild
.Value() fumction will return the value of the particular component .
You are assigning that value a null value means you are amking that particular field value null through this code .
Please let me know still you are not clear .
Ashish BiswasAshish Biswas
Unfortunately, still not working... 
<apex:page controller="clsEmployee">
    <apex:form id="frmEmp">
    <script>
        function ClearValue(){
            document.getElimentById('{!$Component.pbEmp.pbsEmp.txtEmpName}').value = '';
            alert("Value cleared");
        }
    
        function CheckField(){
            if(document.getElimentById('{!$Component.pbEmp.pbsEmp.txtEmpName}').value == null ||
                  document.getElimentById('{!$Component.pbEmp.pbsEmp.txtEmpName}').value = ''){
                
                alert("Employee Name can not be empty, Please enter Employee Name!");
            }
        }
    
        function Show()
        {
            alert("You have clicked me.");
        }
    </script>
        <apex:pageBlock title="Enter Employee Name" id="pbEmp">
            <apex:pageBlockSection columns="2" id="pbsEmp">
                <apex:inputText label="Employee Name" value="{!empName}" id="txtEmpName"/>
            </apex:pageBlockSection>
            <apex:pageBlockSection columns="2">
                <apex:commandButton value="Save Data"  onclick="Show()" action="{!InsertName}"/>
                <apex:commandButton value="Clear Text" onclick="Show()"/>
            </apex:pageBlockSection>
        </apex:pageBlock>
    </apex:form>
</apex:page>

Do you find anything wrong in the code...?
Ashish BiswasAshish Biswas
Even I have tried with sample Show(), for test. that too not even working...
ManojjenaManojjena
Hey Ashish,

Just test below code and check where your dom structure support Script .Some times happens like this . 
<apex:page controller="clsEmployee">
    <script>
       function test(){
	     alert(123);
	   } 
    </script> 
    <apex:form id="frmEmp">
   
        <apex:pageBlock title="Enter Employee Name" id="pbEmp">
		<script>
			function test1(){
				alert(243);
			} 
		</script>
            <apex:pageBlockSection columns="2" id="pbsEmp">
			<script>
				function test2(){
					alert(345);
				} 
			</script>
                <apex:inputText label="Employee Name" value="{!empName}" id="txtEmpName"/>
            </apex:pageBlockSection>
            <apex:pageBlockSection columns="2">
                <apex:commandButton value="Save Data"  onclick="test();" action="{!InsertName}"/>
                <apex:commandButton value="Clear Text" onclick="test1();" />
				<apex:commandButton value="Clear" onclick="test2();" />
            </apex:pageBlockSection>
        </apex:pageBlock>
    </apex:form>
</apex:page>

Just your script where it will work .
Ashish BiswasAshish Biswas
Hi Manoj,
At the first run Test() does not get called, but after re-executing code all the methods works. Is there any sequesnce of placing of JS in VF pages or its just RnD we have to make.
AnjaneyluAnjaneylu
Thankyou Manoj Kumar..
 
ManojjenaManojjena
HI Ashish,
There is no such sequence to add script in your page. You need to test where actually your comonent identify the script . Still we are adding style ion starting of page and adding script on last of page .Still some times we need to add with hit and trial method where actually it works .
Also we can add script and style in one page and include by using  <apex:include > and <apex:includescript > component provided by salesforce .

**If  it  helps you to solve your problem please mark it as best answer. It will help other to find best answer.
 
Ashish BiswasAshish Biswas
Thanks a lot Manoj :)