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
Arine YonArine Yon 

alert issue in page

JavaScript Problem
    I have a problem with the following code:
    <apex:page >
        
        <apex:form >
            <apex:commandButton value="Click" onclick="document.getElementById('sp').innerHTML='Hello'" />
    <span id="sp"></span>
        </apex:form>

    </apex:page>

    When I click on the button the value I  am setting in the span tag ('Hello' in span)  appears for 1 second and again disappears, I want the text 'Hello' to remain in span after clicking on the button. Can anyone please help me with this?
Best Answer chosen by Arine Yon
Ajay K DubediAjay K Dubedi
Hello Arine,

You are close enough try this one :
  
<apex:page >
       <apex:form >
       <apex:commandButton value="Click" onclick="document.getElementById('sp').innerHTML='Hello'" reRender="sp"/>
<span id="sp"></span>
   </apex:form>
</apex:page>



Do you notice the rerender attribute set to span id?
The commandButton refresh the complete page whereas
rerender attribute only refresh the particular block.

Hope it helps
If this answers solve your query please mark this question as a solved and best answer.
Feel Free to ask.

Regards
Ajay

All Answers

Virendra ChouhanVirendra Chouhan
Use HTML input tag instead of commnad button, Because command button will refersh page after click. 
<input type="button" value="Click" onclick="document.getElementById('sp').innerHTML='Hello'" />

 
Shruti SShruti S
It is because, a form submit takes place. You can use the normal button tag instead of <apex:commandButton> . It should solve your problem. Here is the code for the button -  
<apex:page >
    <button type="button" value="Click" onclick="document.getElementById('sp').innerHTML='Hello'" />
    <span id="sp"></span>
</apex:page>
Please feel free to ask if you have any more doubts.
Devanshu soodDevanshu sood
<apex:page >
        
        <apex:form >
            <apex:commandButton reRender="sp" value="Click" onclick="document.getElementById('sp').innerHTML='Hello'" />
    <span id="sp"></span>
        </apex:form>

    </apex:page>
Try this ,its working fine
In order to solve this issue use reRender in apex command button.


 
Ajay K DubediAjay K Dubedi
Hello Arine,

You are close enough try this one :
  
<apex:page >
       <apex:form >
       <apex:commandButton value="Click" onclick="document.getElementById('sp').innerHTML='Hello'" reRender="sp"/>
<span id="sp"></span>
   </apex:form>
</apex:page>



Do you notice the rerender attribute set to span id?
The commandButton refresh the complete page whereas
rerender attribute only refresh the particular block.

Hope it helps
If this answers solve your query please mark this question as a solved and best answer.
Feel Free to ask.

Regards
Ajay
This was selected as the best answer