Using jQuery for basic ISO Metadata record form validation

ESRI's Geoportal metadata record editing has some validity checking, but error checking does not occur until after a metadata record form is submitted.  This can be a wasteful process because it involves having the client (the web browser) send a full request to the application server.  If the submitted form has data validity errors then the whole form is transmitted back to the client for editing.  One way to save the use of server resources (e.g., bandwidth) is by using jQuery to monitor information typed in html input boxes and check value validity before submitting the form.  Since, ESRI's Geoportal comes with jQuery already enabled it is relatively to add validity checks.  The first thing to do is create a custom javascript file (e.g. [geoportal_install_dir]/web/geoportal/catalog/js/custom.js).  The contents of my script are:

$(document).ready(function()

{
  $('#mdEditor\\:identification_date').mask('9999-99-99T99:99:99');
  $('#mdEditor\\:general_datestamp').mask('9999-99-99');     

   $('#mdEditor').submit(function()
   {
      var fileIdent = $('#mdEditor\\:general_fileIdentifier').val();

      if (fileIdent[0] == "{")
      {
          fileIdent = fileIdent.substring(1, fileIdent.length);
      }

      if (fileIdent[fileIdent.length - 1] == "}")
      {
          fileIdent = fileIdent.substring(0, fileIdent.length - 1);
      }

      $('#mdEditor\\:general_fileIdentifier').val(fileIdent);

   });

});

 

The javascript code looks for the html input with an id equal to "mdEditor:identification_date" and sets its input format to the yyyy:mm:ddThh:mm:ss date format.
The code looks for the html input with an id equal to "mdEditor:general_datestamp" and sets the input format to yyyy-mm-dd.  Finally, the script establishes a submit click event that examines the value of the input text box with id equal to "dEditor:general_fileIdentifier" If the text box's value begins and/or ends with a curly bracket "{" it removes those brackets before the form is submitted.  There are double backslashes in the jQuery $ method used to access the various DOM objects.  The backslashes are used because the ids of these DOM objects often contain a colon and jQuery does recognize and id name with a colon.

This fix also requires the jquery.maskedinput plugin (http://digitalbush.com/projects/masked-input-plugin/) and the plugin must be loaded by the webpage.

Comments

The scripts are referenced on

Ryan Clark's picture

The scripts are referenced on the various geoportal pages by adding them to www/catalog/skins/themes/lookAndFeel.jsp