Changing button value on button click

Question

Just starting out in Xpages and ran into a silly problem:

I have a button (id- "button2") and it has label "aaa". What I'm trying to do is to change the value of the button on the button click to value "kappa123". I've included my JavaScript in the "Client" tab in Script Editor.

JavaScript:

var elem = document.getElementById("button2");
if (elem.value=="aaa") elem.value="kappa123";
else elem.value = "aaa";

I don't even a error and nothing happens. What am I doing wrong?

Answer 1

Use

var elem = document.getElementById("#{id:button2}");
if (elem.innerHTML=="aaa") elem.innerHTML="kappa123";
else elem.innerHTML = "aaa";

You can't use the element id in client side code direct as the id gets "renamed" by XPages. With #{id:button2} you get the rendered id.

Answer 2

Demo

   jQuery('#button2').click(function(){
   var elem = document.getElementById("button2");
    if (elem.value=="aaa") jQuery("#button2").attr('value', 'If');
     else jQuery("#button2").attr('value', 'Else');
     alert(elem.value);
   });