christopheraucq

Update fields before Submitting (Part 2)

Blog Post created by christopheraucq Champion on Oct 19, 2015

In the Part 1, I explained how easy it was, in Javascript, to update a Single line of text field before submitting the form.

But the field was still editable and, the value can be changed afterwards.

In this Blog Post, I will summarize two technics:

1. How to disable the field for edition in Javascript.

2. How to update Dropdown List, Check boxes and Radio Buttons in Javascript


1. How to disable the field for edition in Javascript.

It is important to understand the difference between disable the field in the Control Settings and in Javascript.

When you set Enabled to No in the Control Settings of the field, you will notice that if you set a default value or update the value, it will not be saved. It's in the HTML forms specification. Please note that if a value is already set before opening the form, the value will not be erased.

That is why we need to disable the field in Javascript.

Here is how to do it in function of the type of the field Status.

I shall store different Client ID in JavaScript variables as a good practice in function of the type of field I use.

Single line of text: fldStatus

NWF$('#' + fldStatus).prop("readonly", true);

Dropdown List: ddlStatus

NWF$("#" + ddlStatus).prop('disabled', true);

Radio button: rdStatus

NWF$("#" + rdStatus).find(':radio:not(:checked)').attr('disabled', true);

Check boxes: chkStatus

NWF$("#" + chkStatus).find(':not(:checked)').prop('disabled', true);

 

2. How to update Dropdown List, Check boxes and Radio Buttons in Javascript

Because we have disabled the fields, now to be able to update them, we need to enable them.

Dropdown List

NWF$("#" + ddlStatus).prop('disabled', false);

Radio button

NWF$("#" + rdStatus).find(':radio:not(:checked)').attr('disabled', false);

Check boxes

NWF$("#" + chkStatus).find(':not(:checked)').prop('disabled', false);

 

To update the check box, we need to uncheck all of them and check the 'Completed' one afterwards.

 

function MyFunction() {

     NWF$("#" + ddlStatus).prop('disabled', false);

     NWF$("#" + ddlStatus).val("Completed");

 

     NWF$("#" + rdStatus).find(':radio:not(:checked)').attr('disabled', false);

     NWF$('#' + rdStatus).find('input[value=\'Completed\']').attr('checked', true);

 

     NWF$("#" + chkStatus).find(':not(:checked)').prop('disabled', false);

     var objStatus = NWF$('#' + chkStatus);

     objStatus.find('input').each(function () {

         this.checked = false;

     });

     NWF$('#' + chkStatus).find('input[value=\'Completed\']').prop("checked", "checked");

}

 

Happy Nintexing

Christophe Raucq

Outcomes