How To Enhance text box prompts with on-the-fly validation

By Nicolas Hebert, Technical Consultant, Ironside Group, Inc.

One of the issues with using text box prompts is the possibility of receiving incorrect, misspelled, or non-existent entries. This allows the report to run and return unexpected data. Recognizing this, a user would have to return to the prompt page to re-enter values into the text box prompt. Wouldn’t it be nice if there was a way to automatically validate entries against some specified rules while remaining on the prompt page?

In this example we’ll show you how to validate user entry of 3 digit codes with a 5 code maximum.

This will display error messages to the user when the entries do not conform to these rules.

Here is how:

1) Create a new IBM Cognos 8 Report Studio report.

2) Add a prompt page to your report.

3) From the Toolbox menu, drag a Text Box Prompt object onto your prompt page. The “Prompt Wizard” opens. Leave the default parameter name and click Finish.

4) Select the prompt object and assign it a name by navigating to the Properties area (bottom left of the page) and entering a value in the Name property, which can be found in the Miscellaneous section at the bottom of the list (this example uses a prompt object named “sPrompt”).

5) And now the fun part! Drag an HTML Item object directly to the right of the prompt. Assign its’ Description property the following value: prompt modifier.

TIP: Adding descriptions to your HTML Items makes it easier to identify them later when more than one is present in the report.

6) Now enter the following code into this HTML Item by either double-clicking it or select the HTML property:

<script>

                                fW._textEditBoxsPrompt.onblur=validatePrompt;

</script>

This code will make our prompt run the “validatePrompt” function every time it loses focus.

7) Now, we will add a second HTML Item to top of the page to hold our functions. Once the HTML Item is added to the report, call the item “functions” by going to the Description property. Your prompt page should now look like the image below:

8) The following code will allow users to enter a maximum of five (5) numeric codes separated by commas. Any other characters that are encountered will throw an error. The section for a proper validation was purposely left blank to allow readers to enter their own success message or routine.

<script>

var fW=(typeof getFormWarpRequest == "function" ? getFormWarpRequest() : document.forms["formWarpRequest"]);

function validatePrompt()

{

  str=fW._textEditBoxsPrompt.value;

  if (!(str==null||str==""))

  {

    str=str.toUpperCase();

    str= str.replace(/ /g, "");  // remove all spaces

    str= str.replace(/,+/g, ",");  // replace multiple commas by one

    str= str.replace(/,$/g, "");  // remove trailing comma

    str= str.replace(/^,/g, "");  // remove leading comma

    var patvalidchar = new RegExp("^[0-9,]+$");

    var pat7char=new RegExp("^([0-9]{1,3},)*$");

    var pat20pols=new RegExp("^([0-9]{1,3},){0,5}$");

   // characters other than numbers were used…

    if (patvalidchar.test(str)==false)

      alert("Codes may be comprised of only numbers. Please enter multiple codes separated by commas.");

    else

    {

      // codes are more than 3 digits long ...

      if (pat7char.test(str + ",")==false)

        alert("Codes must be three digits.");

      else

      {

        // more than 5 codes were entred ...

        if (pat20pols.test(str + ",")==false)

          alert("Please enter no more than 5 codes");

        else

        {

// Enter code here for successful validation ...

          return true;

        }

      }

    }

  }

  // Text box is empty

  else

  {

    // Enable all prompts ...

    alert("No value inserted.");

  }

}

</script>