Skip to main content
Kinetic Community

Appendix A - Custom Javascript

These javascript functions are built into Kinetic Survey & Request, and are available for your use.  Examples of their use can be seen in the service items in the sample Sithco IT catalog.

KD.utils.Actions

These functions are detailed in the file kd-actions.js file in the following directory on your webserver:

<webserver>\webapps\kinetic\resources\js

You can look through this file to see how the functions work.  The following list contains the most popular and useful functions you may use when developing your own templates or service items.

Each one of the functions is prefaced by “KD.utils.Action”

For example, the .setQuestionValuefunction is written out as KD.utils.Action.setQuestionValue(label, value)

.setQuestionValue(label_id, value)

·         label_id is the Menu Label of the question (can use the Instance ID of the questions)

·         value is what the answer is set to

.getQuestionInput(label_id)

·         label_id is the menu label of the question (can use the Instance ID of the questions)

.setReadOnly(label_id)

·         label_id is the menu label of the question (can use the Instance ID of the questions)

.setReadWrite(label_id)

·         label_id is the menu label of the question (can use the Instance ID of the questions)

.makeQuestionRequired(label_id)

·         label_id is the menu label of the question (can use the Instance ID of the questions)

.makeQuestionOptional(label_id)

·         label_id is the menu label of the question (can use the Instance ID of the questions)

.setDateFields(qstnId, datearr)

·         qstnId is the instance ID of the question (Advanced tab)

·         datearr is an array with the following parameters [YYYY, MM, DD]

Example of the .setQuestionValue function

KD.utils.Actions.setQuestionValue(customerFirstName, “Joe”)

Joe will be set as the value (answer) of the question with the Menu Label ‘customerFirstName’.  If “Joe” was stored in a variable, that can be substituted in the function.

Javascript Date Compare Example

The following javascript is meant to compare dates.  The first example compares an entered date to the current date, and the second compares one date with another.  This is an example of an event that is not provided “out of the box” with Kinetic Survey/Request, but may be useful to implement.  Comments in the code show the purpose for the different parts of javascript used.  This code would be called on a beforeSubmit event on the Page where the date questions are located.  The action would be custom, and you will need to insert the question instance ID for the specific date questions as the parameters of the function.  The functions are normally placed in the CustomHeaderContent field on the advanced tab of the specific template/service item. Both examples are available here.

Code Example

<script>

// This function is called in the beforeSubmit event on the page the holds the related date question

 

function dateCheck(questionID){

// The questionID variable is  for the date question to check

// It is on the advanced tab of the question

 

// nowDate holds the current date

var nowDate = new Date();

 

// The array builds up the values needed by the setDateFileds function if it is called

var nowDateArray = new Array();

nowDateArray[0] = nowDate.getFullYear();

nowDateArray[1] = nowDate.getMonth() + 1;

nowDateArray[2] = nowDate.getDate();

 

// document.getElementByID gets the value of the hidden date question from the template

var surveyDate=document.getElementById("SRVQSTN_" + questionID).value;

 

// The Hidden date field stores the date a s acharacter string.

// The following steps get the individual values, turn them into integers,

// and make them into a readable date format

     surveyDateString = surveyDate.split('-');

 

     var surveyDateInt = new Array();

 

     surveyDateInt[0] = parseInt(surveyDateString[0],10);

     surveyDateInt[1] = parseInt(surveyDateString[1],10);

     surveyDateInt[2] = parseInt(surveyDateString[2],10);

 

     var surveyDateFinal = new Date();

 

     surveyDateFinal.setFullYear(surveyDateInt[0], (surveyDateInt[1] - 1), surveyDateInt[2]);

 

 

// FInally, the two  dates are compared

     if (nowDate>surveyDateFinal)

     {

          // Personalized message to the user that date is not acceptable

          alert('Selected Start Date must be set to after the current date');

          KD.utils.Action.setDateFields(questionID, nowDateArray);

          return false;  //A return value of false will stop the submit process

     }

 

}

</script>

 

Compare Date Check Code:

 

<script>

// this function is called in the beforeSubmit event on the page that holds the date questions.

 

function dateCheck(questionIDStart, questionIDEnd){

// questionIDStart & questionIDEnd are the instanceIDs of the two date questions from the template

 

//First I set the current date so it can be put back into the date fields if the error comes up

var nowDate = new Date();

 

var nowDateArray = new Array();

nowDateArray[0] = nowDate.getFullYear();

nowDateArray[1] = nowDate.getMonth() + 1;

nowDateArray[2] = nowDate.getDate();

 

// The document.getelementById function simpley retrieves the value from the hidden date field

// from the date questions on the template

var surveyStartDate=document.getElementById("SRVQSTN_" + questionIDStart).value;

var surveyEndDate=document.getElementById("SRVQSTN_" + questionIDEnd).value;

 

// The hidden date field stores the date as a string, so the following steps grab the individual

// values convert them to integers and make a date out of them.

// This is repeated for both Start and End dates.

     surveyStartDateString = surveyStartDate.split('-');

 

     var surveyStartDateInt = new Array();

 

     surveyStartDateInt[0] = parseInt(surveyStartDateString[0],10);

     surveyStartDateInt[1] = parseInt(surveyStartDateString[1],10);

     surveyStartDateInt[2] = parseInt(surveyStartDateString[2],10);

 

     var surveyStartDateFinal = new Date();

 

     surveyStartDateFinal.setFullYear(surveyStartDateInt[0], (surveyStartDateInt[1] - 1), surveyStartDateInt[2]);

 

     surveyEndDateString = surveyEndDate.split('-');

 

     var surveyEndDateInt = new Array();

 

     surveyEndDateInt[0] = parseInt(surveyEndDateString[0],10);

     surveyEndDateInt[1] = parseInt(surveyEndDateString[1],10);

     surveyEndDateInt[2] = parseInt(surveyEndDateString[2],10);

 

     var surveyEndDateFinal = new Date();

 

     surveyEndDateFinal.setFullYear(surveyEndDateInt[0], (surveyEndDateInt[1] - 1), surveyEndDateInt[2]);

 

 

// Finally, the dates are compared

     if (surveyStartDateFinal>surveyEndDateFinal)

     {

          // A message warns the user of the error and the two fields are set back to the current date (default)

          alert('Selected End Date must be set to after the Start Date');

          KD.utils.Action.setDateFields(questionIDStart, nowDateArray);

          KD.utils.Action.setDateFields(questionIDEnd, nowDateArray);

          return false;  //the return value of fasle stops continued processing of the submit action

     }

 

}

 

</script>