dynamically adding field in ui page

[Vanit]

Hi,

Trying to add a fields(Username and Password) on checking a checkbox in UI page. Can anyone please guide.

HTML in UI page:

                      <input type="checkbox" id="accept_terms" name="accept_terms" onChange="isChecked()" value="false" />

Client Script:

function isChecked()

{

var termsOk = gel('accept_terms').value;

if(termsOk == true)

  {

    var form = document.forms['form.' + '${sys_id}'];

    addInput(form, "userName", display.value);

    addInput(form, "user_password", display.value);

  }

}

[Gurpreet07]

Hi Vani,

Yes onChange will work for checkbox as well. I am able to run above code without any issues.

[Vanit · Accepted solution]

Hi Gurpreet,

Somehow it is ".checked" is not working in geneva version.

On checking the checkbox "accept_terms", "username" field will be added dynamically with the below code:

I achieved it with the below code:

UI page:

<input type="checkbox" id="accept_terms" name="accept_terms"/>

                      <label for="load_demo">I accept these terms and conditions.</label>  

                  </div>

              </td>

          </tr>

  <TR class="user_controls" style="display:none">

  <TD>

  <label for="userName">User Name: </label><input type="text" name="userName" id="userName" />

  </TD>

  </TR>

Client script in UI page:

var $jj = jQuery;

$jj('input[type=checkbox][name=accept_terms]').change(function() {

  if (this.checked == true) {

  $jj('form').attr("enctype", "multipart/form-data").attr("encoding", "multipart/form-data");

  $jj('.user_controls').show();

  }

});