2. PHPRunner General questions
  3. [SOLVED]  Simple Javascript IF ELSE statement
This topic is locked
[SOLVED]

 Simple Javascript IF ELSE statement

 		3/1/2018 10:28:34 AM
PHPRunner General questions
woodey2002 author

Hi Guys,
On my add page I have two fields, "Duration" and "Alert".
I'm trying to create a simple Javascript onLoad IF statement that will insert the words "Expires soon" in the "Alert" field if the number in the "Duration" fields is <=90.
If the number in the "Duration" field is above >=90 the field should display "No Warning".
Getting the above working would be great!
However to make the statement perfect I would love to introduce a third field called "Course".
The ideal statement would now look the "Course" field and if the course title is called for example "Medical" ( which has a 180 day warning) the statement would look at the duration and if above 180 days for this specific course, display the words "Expires soon" in the "Alert" field.
Else display "No warning" is the duration is above the warning limit for this specific course.
Any inspiration or tips would be much appreciated, my code is below.
Best wishes,

J


var ctrlDuration = Runner.getControl(pageid, 'Duration');

var ctrlAlert = Runner.getControl(pageid, 'Alert');


ctrlDuration.on('change', function(e) {
if (this.getValue() <=90) {
ctrlAlert.setValue("Expires Soon");
} else {


ctrlAlert.setValue("No Warning");

}
});
jadachDevClub member 3/1/2018



Hi Guys,
On my add page I have two fields, "Duration" and "Alert".
I'm trying to create a simple Javascript onLoad IF statement that will insert the words "Expires soon" in the "Alert" field if the number in the "Duration" fields is <=90.
If the number in the "Duration" field is above >=90 the field should display "No Warning".
Getting the above working would be great!
However to make the statement perfect I would love to introduce a third field called "Course".
The ideal statement would now look the "Course" field and if the course title is called for example "Medical" ( which has a 180 day warning) the statement would look at the duration and if above 180 days for this specific course, display the words "Expires soon" in the "Alert" field.
You can also look to use auto-fill with lookup for your more complex question regarding course.
Else display "No warning" is the duration is above the warning limit for this specific course.
Any inspiration or tips would be much appreciated, my code is below.
Best wishes,

J


var ctrlDuration = Runner.getControl(pageid, 'Duration');

var ctrlAlert = Runner.getControl(pageid, 'Alert');
ctrlDuration.on('change', function(e) {
if (this.getValue() <=90) {
ctrlAlert.setValue("Expires Soon");
} else {
ctrlAlert.setValue("No Warning");

}
});



I tested you code and it works. Is your duration field an int or text? I tested with it as int.

Also, make sure you exit the duration field to see the result in alert field.
admin 3/1/2018

Try this:



var ctrlDuration = Runner.getControl(pageid, 'Duration');

var ctrlalert = Runner.getControl(pageid, 'alert');



ctrlDuration.on('change', function(e) {
if (Number(this.getValue()) <=90) {

ctrlalert.setValue("Expires Soon");

} else {

ctrlalert.setValue("No Warning");

}
});
woodey2002 author 3/1/2018

Wow Thanks Guys!!!
Jerry and Sergey thank you so much for you input, you were both correct!
I amended my code as Sergey suggested and Jerry as you suggested I was not seeing the result because I was not exiting the "duration field" to see the result in alert field.
Thanks again to you both!
In this add page, the duration field is auto-populated via a previous function, so no direct user input to get the value into the "duration field" so the number in the alert field will not appear until the user manually exits the "duration field" as Jerry suggested!
To solve this problem, does anyone know a way I can adapt my function from...
ctrlDuration.on('change', function(e)
to something like
ctrlDuration.on('input', function(e),
to see the result of the "alert field" automatically without the need to click or exit the "duration field", therefore triggering the "Alert field" value once the "duration field" has got a value (the "duration field" value is automatically added as the result of a second working Javascript event on the same page)
Many thanks again,

J
woodey2002 author 3/2/2018

This is still crushing my head!
By using the oninput or onChange field event, the user still needs to add the number manually to the "Duration" field.
However switching to mousemove field event, gives me some of the behaviour I require, however it is not ideal.
The problem is that the value for the "Duration" field is not typed in by the user themselves rather it is automatically calculated and added via a separate Javascript event.
Is there a way I can get to, insert the words "Expires soon" in the "alert" field if the number in the "Duration" fields is <=90?
Remember a user does not add the value to the "duration" field manually themselves, the "duration" value is added via the Javascript event and not user input?
Do I really even need a field event to insert the words if criteria is met?
Best wishes and many thanks!
J



var ctrlDuration = Runner.getControl(pageid, 'Duration');

var ctrlalert = Runner.getControl(pageid, 'alert');



ctrlDuration.on('oninput', function(e) {
if (Number(this.getValue()) <=90) {

ctrlalert.setValue("Expires Soon");

} else {

ctrlalert.setValue("No Warning");

}
});
jadachDevClub member 3/3/2018



This is still crushing my head!
By using the oninput or onChange field event, the user still needs to add the number manually to the "Duration" field.
However switching to mousemove field event, gives me some of the behaviour I require, however it is not ideal.
The problem is that the value for the "Duration" field is not typed in by the user themselves rather it is automatically calculated and added via a separate Javascript event.
Is there a way I can get to, insert the words "Expires soon" in the "alert" field if the number in the "Duration" fields is <=90?
Remember a user does not add the value to the "duration" field manually themselves, the "duration" value is added via the Javascript event and not user input?
Do I really even need a field event to insert the words if criteria is met?
Best wishes and many thanks!
You may have answered your own question. If it were me, I would pass the data to alert after record is added via event. This would be based on the value of duration.
J



var ctrlDuration = Runner.getControl(pageid, 'Duration');

var ctrlalert = Runner.getControl(pageid, 'alert');
ctrlDuration.on('oninput', function(e) {
if (Number(this.getValue()) <=90) {

ctrlalert.setValue("Expires Soon");

} else {

ctrlalert.setValue("No Warning");

}
});
woodey2002 author 3/3/2018




woodey2002 author 3/3/2018

Cool Jerry, will give that a go now!
I would love the user to see the "alert" message in realtime during the data entry stage on the add or edit page.
I will keep trying to achieve with an Javascript event also, if anyone can point me towards any examples of how to achieve this that would be great!
Thanks Jerry again!
jadachDevClub member 3/3/2018

What are you using to populate duration? Can you share that code?
woodey2002 author 3/3/2018



What are you using to populate duration? Can you share that code?


Thanks Jerry,
Below is a link to the post on our tips and tricks section where I posted the successful code!
Please note the "duration" field in the code is called 'staff_mandatory_Study_Day_Remaining', I just named it duration in the forum to make it easier for people to understand!
http://asprunner.com/forums/topic/25400-javascript-onload-to-calculate-expiry-date/
and here is the code

var ctrDuration = Runner.getControl(pageid, 'staff_mandatory_Study_Day_Duration');

var ctrDayDate = Runner.getControl(pageid, 'staff_mandatory_Study_Day_Date');

var ctrDayExp = Runner.getControl(pageid, 'staff_mandatory_Study_Day_Expires');

var ctrDayRem = Runner.getControl(pageid, 'staff_mandatory_Study_Day_Remaining');
ctrDayDate.on('change',function(){

setDates();

});

ctrDuration.on('change',function(){

setDates();

});
function setDates(){

if(ctrDayDate.getValue() && ctrDuration.getValue()){

var ddate = new Date(ctrDayDate.getValue());

ddate.setDate(ddate.getDate() + parseInt(ctrDuration.getValue()));

var out = (ddate.getMonth() + 1)+"/"+ddate.getDate()+"/"+ddate.getFullYear();

ctrDayExp.setValue(out);

var currDate = new Date();

var cDate = currDate.getTime();

var eDate = ddate.getTime();

ctrDayRem.setValue(parseInt((eDate - cDate)/1000/60/60/24));

}

}


I have PM you a link for the application on demo account to see this event in action.
Many thanks

James
woodey2002 author 3/11/2018

Hi Guys,
I managed to figure this one out by using a setinterval function in Javascript.
Here is the code for the entire event with setinterval function at the bottom, hope this helps!

var ctrDuration = Runner.getControl(pageid, 'staff_mandatory_Study_Day_Duration');

var ctrDayDate = Runner.getControl(pageid, 'staff_mandatory_Study_Day_Date');

var ctrDayExp = Runner.getControl(pageid, 'staff_mandatory_Study_Day_Expires');

var ctrDayRem = Runner.getControl(pageid, 'staff_mandatory_Study_Day_Remaining');

var ctrAlert = Runner.getControl(pageid, 'staff_mandatory_Study_Day_Alert');
ctrDayDate.on('change',function(){

setDates();

});
ctrDuration.on('oninput',function(){

setDates();

//setAlert();

});
ctrDuration.on('change',function(){

setDates();

//setAlert();

});
ctrDayRem.on('oninput',function(){

//setDates();

setAlert();

});
ctrDayRem.on('change',function(){

//setDates();

setAlert();

});
function setDates(){

if(ctrDayDate.getValue() && ctrDuration.getValue()){

var ddate = new Date(ctrDayDate.getValue());

ddate.setDate(ddate.getDate() + parseInt(ctrDuration.getValue()));

var out = (ddate.getMonth() + 1)+"/"+ddate.getDate()+"/"+ddate.getFullYear();

ctrDayExp.setValue(out);

var currDate = new Date();

var cDate = currDate.getTime();

var eDate = ddate.getTime();

ctrDayRem.setValue(parseInt((eDate - cDate)/1000/60/60/24));

}

}
function setAlert(){
if (ctrDayRem.getValue() <=90 && ctrDayRem.getValue() >0) {

ctrAlert.setValue("Expires Soon");

} else if (ctrDayRem.getValue() ==''){

ctrAlert.setValue("None");

}

else if (ctrDayRem.getValue() <= 0){

ctrAlert.setValue("Expired");

}

else {

ctrAlert.setValue("No Warning");

}

}
setInterval(function () {



if (ctrDayRem.getValue() <=90 && ctrDayRem.getValue() >0) {

ctrAlert.setValue("Expires Soon");

} else if (ctrDayRem.getValue() ==''){

ctrAlert.setValue("None");

}

else if (ctrDayRem.getValue() <= 0){

ctrAlert.setValue("Expired");

}

else {

ctrAlert.setValue("No Warning");

}

}

)