Focal Point
[CLOSED] Data validation - use Java?

This topic can be found at:
https://forums.informationbuilders.com/eve/forums/a/tpc/f/7971057331/m/7311082762

January 21, 2008, 11:46 AM
mark66
[CLOSED] Data validation - use Java?
Hi all,

Currently we do all our data validation within the WebFocus script. However from reading other peoples posts it appears, and I can understand, that Java is the way to go, so you are not making unnecessary submissions to the server without need.

My problem is that I know very little Java and I cannot find any examples. Is anyone able to link me to any examples or provide some code snippets?

I currently need to validate date entries, to ensure they are in the format "DD/MM/YYYY"

Many thanks Smiler

This message has been edited. Last edited by: Kerry,


WebFocus 765. iSeries v5r4
January 21, 2008, 12:50 PM
Alan B
Mark

I assume you mean javascript, not java.

If so, date validation in javascript can be horrible and lengthy.

However, if you are prepared to accept a piece of code at face value, it will do the trick, I have used it for a few years now. It uses regular expressions and is a real pig to follow.
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>Validate dd/mm/yyy date entry</title>
<script type="text/javascript">
function validDate(fld) {
    var wx=document.getElementById(fld.id);
    var RegExPattern = /^((((0?[1-9]|[12]\d|3[01])[\.\-\/](0?[13578]|1[02])[\.\-\/]((1[6-9]|[2-9]\d)?\d{2}))|((0?[1-9]|[12]\d|30)[\.\-\/](0?[13456789]|1[012])[\.\-\/]((1[6-9]|[2-9]\d)?\d{2}))|((0?[1-9]|1\d|2[0-8])[\.\-\/]0?2[\.\-\/]((1[6-9]|[2-9]\d)?\d{2}))|(29[\.\-\/]0?2[\.\-\/]((1[6-9]|[2-9]\d)?(0[48]|[2468][048]|[13579][26])|((16|[2468][048]|[3579][26])00)|00)))|(((0[1-9]|[12]\d|3[01])(0[13578]|1[02])((1[6-9]|[2-9]\d)?\d{2}))|((0[1-9]|[12]\d|30)(0[13456789]|1[012])((1[6-9]|[2-9]\d)?\d{2}))|((0[1-9]|1\d|2[0-8])02((1[6-9]|[2-9]\d)?\d{2}))|(2902((1[6-9]|[2-9]\d)?(0[48]|[2468][048]|[13579][26])|((16|[2468][048]|[3579][26])00)|00))))$/;
    var errorMessage = 'Please enter valid date as day, month, and four digit year.\nYou may use a slash, a hyphen or a period to separate the date parts.';
    if ((wx.value.match(RegExPattern)) && (wx.value!='')) {
        return true;
    } else {
        alert(errorMessage);
        wx.focus();
        wx.select();
    }
}
</script>
</head>
<body>
<form>
<p><input type="text" name="dateEntry" id="dateEntry" onchange="validDate(this);">
<br>(dd/mm/yyyy)
</form>
</body>
</html>


Hope this doesn't put you off!


Alan.
WF 7.705/8.007
January 21, 2008, 04:28 PM
FrankDutch
I would recommend to use the calendar control that is available in Webfocus.
If you use that it validates the date format and gives the result back.

document.getElementById("calendar1").value

Search in the documentation how to implement this.




Frank

prod: WF 7.6.10 platform Windows,
databases: msSQL2000, msSQL2005, RMS, Oracle, Sybase,IE7
test: WF 7.6.10 on the same platform and databases,IE7

January 21, 2008, 04:51 PM
Alan B
I agree Frank, but the problem is that it requires the users to click an icon and select a date. In my experience (some/many) users continue to type away in gibberish regardless. Smiler


Alan.
WF 7.705/8.007
January 21, 2008, 04:56 PM
FrankDutch
in many websites you see separate fields for day month and year. That is also a way to work. I would do it that way.




Frank

prod: WF 7.6.10 platform Windows,
databases: msSQL2000, msSQL2005, RMS, Oracle, Sybase,IE7
test: WF 7.6.10 on the same platform and databases,IE7

January 21, 2008, 05:04 PM
Alan B
Frank

That does not help browser validation, the basics of data validation will still exist. If a user enters 31 in day, then you have to check month, and you also have leap years etc.

There is no single simple approach here. I have even tried forcing users to use the calendar object, but had complaints back, especially from power users. Hence the above, horrible, validation, which does work.


Alan.
WF 7.705/8.007
January 22, 2008, 02:31 AM
Tony A
I agree with Alan, the most efficient method of performing this validation within an HTML page is via Javascript, albeit rather messy. Without this process, and which ever method you use to receive the date entry from the user, you still have to validate the date. If you use the separate entries then you have to determine which is wrong.

Another advantage of validation within the HTML is that you know the input to your WF report is going to be a real date of the correct format so you don't have to jump back to the HTML page etc.

A further advantage is that you are achieving the validation at client machine level without having to run a server side process only to find that the date is invalid and then have to start another client process to get obtain valid input.

I have a very similar match expression to that of Alan's but I only validate for slashes. This makes it a little simpler on the eyes as there is less of it, but Alan's has now been added to my library of useful routines Wink Thanks Alan Smiler

T



In FOCUS
since 1986
WebFOCUS Server 8.2.01M, thru 8.2.07 on Windows Svr 2008 R2  
WebFOCUS App Studio 8.2.06 standalone on Windows 10 
January 22, 2008, 11:45 AM
Anatess
I use a combination of Frank's and Alan's ideas. I use the calendar control available in Webfocus, which also gives you the textbox that you can just enter a date in without clicking on the calendar, so then I use a simple date-checking in javascript in case they enter stuff. Here's the code:

Adding the calendar control via HTML Painter will automagically create this code (by the way, you'll need to change the calendar properties to make it DMYY):
<SPAN id=pane7 style="Z-INDEX: 18; LEFT: 184px; WIDTH: 86px; POSITION: absolute; TOP: 61px; HEIGHT: 51px" tabIndex=18 elementtype="32" name="FEXDATE">FEXDATE
<INPUT id=calendar1 style="Z-INDEX: 19; LEFT: 0px; WIDTH: 83px; POSITION: absolute; TOP: 29px; HEIGHT: 22px" tabIndex=19 hspace=0 maxLength=8 accept=0 size=8 value=19/01/2008 name=FEXDATE elementtype="14" defaultlocation="29,0,51,83" addalloption="0" datasource requiredfield="1464618" datatype="0" datafieldtype="CHAR" sourcetype="typeMaster" ibiformat="DMYY" calendardatatype="1" calendardata="0/0/-10;0/0/10"></SPAN>


This creates a calendar control that passes a value to &FEXDATE that is in the fex.

So, now you'll have to add a function to check the date once somebody enters something in there. You can either check the date when the data changes or you can wait until the form is submitted. In this case, I checked the date on the onchange event, so I manually added this code:

onchange=checkdate(this)


in the calendar1 control, so now the line looks like this:

<INPUT id=calendar1 onchange=checkdate(this)style=.... etc.


And here's the javascript code for the checkdate function which you would insert below the "TODO: Add your event handler code here" handy marker that webfocus provides, like this:

// TODO: Add your event handler code here
}
function checkdate(input){
var validformat=/^\d{2}\/\d{2}\/\d{4}$/ //Basic check for format validity
var returnval=false
if (!validformat.test(input.value))
   {
     alert("Invalid Date Format. Please enter a date in DD/MM/YYYY format.")
   }
else
   { //Detailed check for valid date ranges
       var dayfield=input.value.split("/")[0]
       var monthfield=input.value.split("/")[1]
       var yearfield=input.value.split("/")[2]
       var dayobj = new Date(yearfield, monthfield-1, dayfield)
       if ((dayobj.getMonth()+1!=monthfield)||(dayobj.getDate()!=dayfield)||(dayobj.getFullYear()!=yearfield))
          {
          alert("Invalid Day, Month, or Year range detected.")
          }
       else {
             returnval=true
            }
   }
if (returnval==false)
   {
    input.select();
    input.focus();
   }
return returnval
}


Hope this helps.


WF 8.1.05 Windows
January 22, 2008, 12:21 PM
Bob Jude Ferrante
There is a JS library called ibiValidate.js that you can use to verify the contents of a field uses the correct format. THe library is in the standard WebFOCUS path:

/ibi_html/javaassist/ibi/html/js/ibiValidate.js

For the library to work, you must include the library in a SCRIPT block.

For each input control you wish to validate, you need to set a custom attribute called *ibiformat* which contains a standard WebFOCUS format string. For example to validate an input control as a date, you'd set the attribute to the WebFOCUS date format (e.g., MDYY, YYMD, YYQM, etc.).

THe attribute set looks something like this:
  
<input type="text" ibiformat="MDYY">


If you include ibiValidate using the IBI global include block at the top of the page, on page load, ibiValidate runs and automatically places all controls with ibiformat set into a collection of controls to be validated.

You can choose to validate input either on a change or on submit. Submit is actually friendlier for some users, because the validation waits until they click the button to *use* the data they entered. Then on any onSubmit action, ibiValidate will kick into action, validating all controls in the collection against their respective formats. It would stop on the first input error, set the focus to that control and issue a pop-up telling the user what to do.

Hope this helps. ibiValidate is extremely rich and flexible and is used extensively internally by ibi products including the Admin console, PMF, and Maintain.


Bob Jude Ferrante
Director of Business and Development
WebFOCUS Performance Management
Bob_Ferrante@ibi.com
917-339-5105

I'll take any questions about PMF - business or technical - anytime!

January 22, 2008, 12:38 PM
Francis Mariani
Sounds fantastic, can't wait to use it.

Thanks for the explanation Bob.


Francis


Give me code, or give me retirement. In FOCUS since 1991

Production: WF 7.7.05M, Dev Studio, BID, MRE, WebSphere, DB2 / Test: WF 8.1.05M, App Studio, BI Portal, Report Caster, jQuery, HighCharts, Apache Tomcat, MS SQL Server
January 22, 2008, 12:40 PM
mark66
Hi all,

Thanks for all your replies and sorry I haven't been able to respond sooner.

As discussed I knew the validation should be done Client side, rather than server side, it was just a question of how!

I wasn't keep on separating the dates into 3 boxes Day, Month & Year and I am sure the users would see this as a step backwards.

We already utilise the Calendar Control, but as mentioned, some users prefer to be able to come along and type the text for themselves. If they didn't present this in the format dd/mm/yyyy my report would error.

AlanB, thanks for your code, but I am afraid I could not get this to work. I am sure this is my fault and not your code! Can the code just be added to my htm code anywhere or does it need to go between specific tags?

Anatess, thank you for your really clear explanation! I was struggling to see how I got from my standard Calendar Control to having it perform verification. I very happy to report that I did get it working and my screen now validates perfectly!!

The only change I had to make was to enter some <script> tags around it. I looked at other calls to Javascript in the htm (which I do not fully understand) and saw these used the tags. So I just had to code:

<script id=CheckDates>
function checkdate(input){
...
...
...
</SCRIPT> 


The TODO marker you referred to, does this need to be coded somewhere else to make your example work?

Thanks again for all your help Smiler


WebFocus 765. iSeries v5r4
January 22, 2008, 02:16 PM
Anatess
Mark, I'm so glad it worked for you! The TODO marker is actually a comment (// starts a javascript comment line). Webfocus adds it there for developers to know where in the html to insert scripts. So, technically, it doesn't have to be there.


WF 8.1.05 Windows
January 23, 2008, 05:14 AM
Alan B
Mark

The validation I use can be included into the code Anatess supplied, basically replacing the validation function there.

The one I supplied is a bit more complex and does a more thorough job of validating dates.

The ibiValidate described by Bob Jude Ferrante is very good, and works well in the maintain apps I have. However I do have a problem using it with HTML painter, but that could be because I am not great with some of the GUI tools. For self service HTML pages, the size of ibiValidate is also a bit off putting.

Whilst the version I showed is for DD/MM/YYYY I also have a MM/DD/YYYY version.


Alan.
WF 7.705/8.007
January 23, 2008, 10:21 AM
ok_dhs
quote:
Originally posted by Bob Jude Ferrante:
There is a JS library called ibiValidate.js that you can use to verify the contents of a field uses the correct format. THe library is in the standard WebFOCUS path:

/ibi_html/javaassist/ibi/html/js/ibiValidate.js


js folder contains many files. I was wondering if there was a documentation describing the functionality/use of these routines without having to go over the code trying to figure out what it is? Thanks.


Prod: WebFOCUS 7.1.3 on Linux Kernel-2.6.5 zSeries 64bit/Apache Tomcat/5.0.28 JAVA version 1.4.2_11 server
February 08, 2011, 07:34 PM
Francis Mariani
Three years after this thread, I'm ready to try ibivalidate! Bob Jude Ferrante mentions
quote:
You can choose to validate input either on a change or on submit
, but the documentation is elusive or non-existent, so I don't know how to choose. A search for "ibivalidate" on Tech Support results in seven hits in FocalPoint - that's all.


Francis


Give me code, or give me retirement. In FOCUS since 1991

Production: WF 7.7.05M, Dev Studio, BID, MRE, WebSphere, DB2 / Test: WF 8.1.05M, App Studio, BI Portal, Report Caster, jQuery, HighCharts, Apache Tomcat, MS SQL Server
February 09, 2011, 06:20 AM
Wep5622
That's merely a usability consideration, Francis. OnSubmit happens for the entire form at once, just before the form gets sent to the server, while onChange is per field and happens as soon as the browser considers the contents of a field changed (which differs a little between browsers).

I'm not sure onsubmit will work with WebFOCUS launch-pages though. AFAIK IBI uses a normal type button to submit forms (at least, that's what I see in WF 7.6.11), not a submit-button. Unless they "fake" that the event takes place, I don't think the event ever gets triggered...

That's not a big issue anyway, IBI does provide a function for when a button is clicked (the button onclick handlers), you can do your validation there as well - it should amount to the same.


WebFOCUS 8.1.03, Windows 7-64/2008-64, IBM DB2/400, Oracle 11g & RDB, MS SQL-Server 2005, SAP, PostgreSQL 11, Output: HTML, PDF, Excel 2010
: Member of User Group Benelux :
February 09, 2011, 09:32 AM
Francis Mariani
I know I can do my validation with an onclick event handler on the "fake" submit button, the question is, how do I stop the formm from being submitted? My validation function works, it alerts the errors but it doesn't stop the form from being submitted.


Francis


Give me code, or give me retirement. In FOCUS since 1991

Production: WF 7.7.05M, Dev Studio, BID, MRE, WebSphere, DB2 / Test: WF 8.1.05M, App Studio, BI Portal, Report Caster, jQuery, HighCharts, Apache Tomcat, MS SQL Server
February 09, 2011, 10:44 AM
Wep5622
Can't you just not execute OnExecute() if the form doesn't validate? (I'm guessing here, I haven't tried client-side form validation with WebFOCUS yet.)

Something like:
function button1_onClick() {
    if (validate())
        OnExecute();
}



WebFOCUS 8.1.03, Windows 7-64/2008-64, IBM DB2/400, Oracle 11g & RDB, MS SQL-Server 2005, SAP, PostgreSQL 11, Output: HTML, PDF, Excel 2010
: Member of User Group Benelux :
February 09, 2011, 12:06 PM
Francis Mariani
What I don't get is, Hasn't anyone else had to do this yet???


Francis


Give me code, or give me retirement. In FOCUS since 1991

Production: WF 7.7.05M, Dev Studio, BID, MRE, WebSphere, DB2 / Test: WF 8.1.05M, App Studio, BI Portal, Report Caster, jQuery, HighCharts, Apache Tomcat, MS SQL Server
February 09, 2011, 02:12 PM
Doug
Yes francis, I have... Here's the code (snippets)
//Begin function Val_FrmDt
function Val_FrmDt(ctrl) 
{
var objFromDate = document.getElementById("cal_FrmDt").value; 
var objToDate = document.getElementById("cal_ToDt").value; 
var date1 = new Date(objFromDate); 
var date2 = new Date(objToDate); 

var ObjRadio4 = document.getElementById("radio2_4").checked; 

if(ObjRadio4 == true)
{
    if(date1 > date2)

    { 
        alert("The From date should not be greater than the To date."); 
// 20110209: replaced this with above message
//      alert("The FROM Date needs to be less than the TO Date.\n\n Please adjust your custom date range accordingly."); 
        return false;  
    } 
        return true; 
}
        return true; 

}
//End function Val_FrmDt

...

<INPUT style="Z-INDEX: 6; POSITION: absolute; TEXT-ALIGN: center; WIDTH: 80px; DISPLAY: block; HEIGHT: 22px; TOP: 0px; LEFT: 80px"
id=cal_FrmDt tabIndex=21 onclick=Val_FrmDt(this) 
value=!IBI.AMP.EndOfCal; size=192 elementtype="14" persistentuniqueid="compUid_19" name="cal_FrmDt"> 
is the function which either displays an ALERT or submits the request.

I hope this helps. PM Me if you need more info which may bog down this post...




   In FOCUS Since 1983 ~ from FOCUS to WebFOCUS.
   Current: WebFOCUS Administrator at FIS Worldpay | 8204, 8206
February 09, 2011, 02:15 PM
Doug
Sorry, I omitted piece which you need in order for this to work:
//Begin function GoButton_onclick
function GoButton_onclick(ctrl) {

	if(Val_FrmDt() == true) { 
	OnExecute(ctrl) ;
	window.open('','_parent','');
	window.close() ;
	} ;

}
//End function GoButton_onclick
Obviously, "if(Val_FrmDt() == false)" then it would "no op" / do nothing.
February 09, 2011, 02:46 PM
Doug
OK, some more for the insightfullness of it all, here's the "GoButton_onclick" function I used:
//Begin function GoButton_onclick
function GoButton_onclick(ctrl) {
  if(Val_FrmDt() == true)  {  alert("OK, go with it...") ;	} ;
  if(Val_FrmDt() == false) {  alert("NG, Do't go with it...") ;	} ;
}
//End function GoButton_onclick
I'm missing something about the JS "IF ... THEN ... ELSE" syntax.  Would someone please re-write this in the JS version of an "IF ... THEN ... ELSE" syntax for me?
February 09, 2011, 03:52 PM
Francis Mariani
Bah humbug!


Francis


Give me code, or give me retirement. In FOCUS since 1991

Production: WF 7.7.05M, Dev Studio, BID, MRE, WebSphere, DB2 / Test: WF 8.1.05M, App Studio, BI Portal, Report Caster, jQuery, HighCharts, Apache Tomcat, MS SQL Server
February 09, 2011, 06:36 PM
Doug
Francis, What is it that you're looking to accomplish? I thought (somehow) you were asking how to submit or not submit depending on the results of some validation. Did I miss it (your request)?
February 10, 2011, 04:02 AM
Wep5622
quote:
I'm missing something about the JS "IF ... THEN ... ELSE" syntax.  Would someone please re-write this in the JS version of an "IF ... THEN ... ELSE" syntax for me?


Sure, here goes:
  if (Val_FrmDt() == true)  {
    alert("OK, go with it...") ;
  } else {
    alert("NG, Don't go with it...") ;
  }


With single statements like these you can safely leave out the curly braces too - that's a matter of personal preference though:
  if (Val_FrmDt() == true)
    alert("OK, go with it...") ;
  else
    alert("NG, Don't go with it...") ;


This syntax is also convenient at times, it's a bit like how you assign values conditionally to a variable in WebFOCUS:
  alert(Val_FtmDT() ? "OK, go with it..." : "NG, Don't go with it...");


This is familiar syntax to those used to, for example, C or Java.

This message has been edited. Last edited by: Wep5622,


WebFOCUS 8.1.03, Windows 7-64/2008-64, IBM DB2/400, Oracle 11g & RDB, MS SQL-Server 2005, SAP, PostgreSQL 11, Output: HTML, PDF, Excel 2010
: Member of User Group Benelux :