0

There is a command button with an onclick js call where the values of input elements in the form is checked. If any of the input values is empty, CSS effect is applied in the Javascirpt logic to highlight the empty input elements inline. However since there is rerender of the part of the form containing the input elements also happening, the CSS effect effect does not persist. It comes and goes away. Is there any way that we can keep the CSS effect while still having to rerender the form.

<apex:commandbutton onlcick="func1();" rerender="opPanel"/>
<apex:outputPanel id="opPanel">
    <apex:inputText value="{!val1}" id="elem1" />
</apex:outputPanel>

Inside func1():

jQuery$("#elem1").addClass('err_Red'); 
  • you need to call JS after rerender to add them again. – Tushar Sharma Sep 29 '17 at 6:43
3

Tags like apex:commandButton have an oncomplete attribute that provides a place to put:

The JavaScript invoked when the result of an AJAX update request completes on the client.

So for your code you could do something like this:

<apex:commandbutton onclick="func1();" rerender="opPanel" oncomplete="func2();"/>

<script>
// Called when button clicked
function func1() {
    ...
}
// Called when AJAX request has completed
function func2() {
    jQuery$("#elem1").addClass('err_Red'); 
}

so that the styling is re-applied after the re-rendered area has been setup as the result of the AJAX call.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.