cancel
Showing results for 
Search instead for 
Did you mean: 
Highlighted
harryr
Nintex Newbie

Pains using JavaScript in Nintex Forms

Jump to solution

Hi All

I asked this question at the end of an answred thread ( https://community.nintex.com/message/73682-re-print-a-js-var-value-to-a-single-line-text-box-nintex-... ) but I am having a lot of pains with incorporating JavaScript into Nintex forms. 

I have some form fields that are assigned variable names that start with nField...(Nintex field).

I have written a script that works in standard html/JS but refuses to work in Nintex Forms. I have a button that triggers the function from the script but the page just reloads/resets which so far, through testing, appears to be an indication that Nintex is not able to handle the JavaScript that is being called. 

 

There are some script specific variable used for storing values for a calculation in the script that are not in the form.

The idea is that the user inputs the information in the fields and then clicks a button to get a recommendation based on those choices. There are quite a few rules hat determine what recommendation they get. That recommendation is then shown in  a box at the end of the form.

 

There are no errors reported o the console. Just a page reload.

Can anyone suggest where I am going wrong here? Do I need to insert NWF$ all over the script and if so are there any guides or references of where to put them? I can't seem to find any. I have been trying various combinations but nothing works and it's getting very frustrating now. 

Can you even use standard JavaScript in Nintex forms?

Appreciate any help that can be provided.

The JS is configured here:

A button on the form calls the JS function:

Labels: (1)
Reply
20 Replies
emha
Nintex Newbie

Re: Pains using JavaScript in Nintex Forms

Jump to solution

each control that has defined js variable should have been referred to as

NWF$('#' + nFieldBusinessUnit)

however, there is not an unified/straightforward way how get/set a form control values. for different type of controls this is done in a different way.

even for a single control type different approach might be needed based on how the control is rendered.

that all depends on how nintex builds DOM model for single controls.

a nice example of these different approaches might be the choice control that you seem o use heavily on your form.

see following examples how to set choice control value when rendered different ways

choice as checkboxes
 

choice as radio switch
How can I set Choice control value when in Option button display format 
          
choice as tabs/buttons
how to set Tab selected value 

choice as dropdown list
 Auto populate value in drop-down menu                                                                       

hope it helps make the things clearer.

Reply
mlauer
Nintex Newbie

Re: Pains using JavaScript in Nintex Forms

Jump to solution

Variables You define in Nintex Forms as 'Client ID javascript variable name' are containing the ID of a control not the value or property. Nintex Forms uses a copy of the jQuery library that you can access through NWF$.

To get a controls value use jQuery as You do it at the end of the script to set control values e.g.

NWF$("#" + nFieldBusinessUnit ).val()

Reply
harryr
Nintex Newbie

Re: Pains using JavaScript in Nintex Forms

Jump to solution

Hi Manfred and Marian 

Thank you for your replies.

This should be interesting since I don't know JQuery, but if I understand correctly, when I reference a variable from the form ( a drop-down or text control that has been given a "Client ID JavaScript variable name" I would need to use the jQuery reference to access their values?

Example:

if NWF$("#" + nFieldProjectType ).val() === "Fast Track" && NWF$("#" + nFieldProjectDuration ).val() != "< 4 Weeks") {
alert("Validation Error: Your project does not meet the Fast track criteria. Duration must be < 4 weeks for fast Track projects. Review cost and duration before continuing.");

else if ( ) { } ....

And for any variables used not in the form, I can stick with standard JS referencing? 

Example:

var numExistCustomer = 0;

Thanks

0 Kudos
Reply
mlauer
Nintex Newbie

Re: Pains using JavaScript in Nintex Forms

Jump to solution

Now You are on the right track.

I recommend You to read the jquery documentation, especially

https://api.jquery.com/category/selectors/ 

https://api.jquery.com/val/ 

https://api.jquery.com/prop/ 

0 Kudos
Reply
harryr
Nintex Newbie

Re: Pains using JavaScript in Nintex Forms

Jump to solution

Thank Manfred.

I will have a read but just to check my thinking on this so I can get started, is this a correct adjustment to an if statement?

Specifically, do I still use the JavaScript parentheses to hold the JQuery? 

Example JavaScipt parentheses in bold:

else if (NWF$("#" + nFieldScopeClarity).val() === " ") {
alert("Validation Error: Scope Clarity field must be selected to continue");
throw new Error("Validation Error: Scope Clarity");

Or do I have to structure it differently?

Thanks again

0 Kudos
Reply
harryr
Nintex Newbie

Re: Pains using JavaScript in Nintex Forms

Jump to solution

So I tried this as a test:

JavaScript in Bold:

function getPlan(){
   if (NWF$("#" + nFieldBusinessUnit).val() === "BLC") {
      alert("You selected BLC");
      }
}

It looks like I do need to keep the JavaScript parenthesis to hold the JQuery name for the control variable name.

So from this test, I am assuming I should only need to adjust the variable references to the JQuery format (let's hope).

Will update when I have updated the entire script.

Fingers crossed.

0 Kudos
Reply
mlauer
Nintex Newbie

Re: Pains using JavaScript in Nintex Forms

Jump to solution

Hi Harry

jQuery is javascript. It's a library written in javascript, to make DOM access and AJAX calls easier.

Kind regards

Manfred

0 Kudos
Reply
harryr
Nintex Newbie

Re: Pains using JavaScript in Nintex Forms

Jump to solution

So I updated the code to include the changes mentioned above and it still doesn't work despite replicating across the simple test outlined previously.

Can anyone please help point out what I am doing wrong? Do I need to add a document ready function? It's driving me a little crazy now.

Code:

*Removed

0 Kudos
Reply
harryr
Nintex Newbie

Re: Pains using JavaScript in Nintex Forms

Jump to solution

I think I found the problem. There is a problem with this bit of code which checks for empty fields:

//Check for empty Fields
if (NWF$("#" + nFieldPortfolioSector).val() === "") {
alert("Validation Error: A Portfolio/Sector must be selected to continue");
} else if (NWF$("#" + nFieldLeadTheme).val() === "") {
alert("Validation Error: A Lead Theme must be selected to continue");
throw new Error("Validation Error");
} else if (NWF$("#" + nFieldBusinessUnit).val() === "") {
alert("Validation Error: A Business Unit must be selected to continue");
throw new Error("Validation Error");
} else if (NWF$("#" + nFieldFundingSource).val() === "") {
alert("Validation Error: A Funding Source must be selected to continue");
throw new Error("Validation Error");
} else if (NWF$("#" + nFieldExistingCustomer).val() === "") {
alert("Validation Error: Existing Customer field must be selected to continue");
throw new Error("Validation Error");
} else if (NWF$("#" + nFieldSectorAlignment).val() === "") {
alert("Validation Error: Sector Alignment field must be selected to continue");
throw new Error("Validation Error");
} else if (NWF$("#" + nFieldTechnicalCapability).val() === "") {
alert("Validation Error: Technical Capability field must be selected to continue");
throw new Error("Validation Error");
} else if (NWF$("#" + nFieldScopeClarity).val() === "") {
alert("Validation Error: Scope Clarity field must be selected to continue");
throw new Error("Validation Error");
}

Solved:

I hadn't assigned nFieldSectorAlignment to a control. Now the code stops and mostly works except there seems to be a validation problem.

New Problem:

The code above is not picking up the field as Empty.

I tested with an actual choice from the menu and it worked. For some reason the code above is not picking up the value as empty. I tried "Please select a value.." and it still didn't work.

Anyone got any ideas?

0 Kudos
Reply