JavaScript events triggered on screen via custom script

JavaScript has various event handlers, like onChange or onMouseOver. In HR.Net it is not obvious how things work and how to trigger functions based on events.. Here are some tips:

This is how to trigger event when date field on the screen is changed..

var date = $('#DATEFIELDNAME_txtInput');
date.blur(function() {
  required_function();
});

Where DATEFIELDNAME is a name of the date field; required_function() is something that you need to run when date is changed. For some reason onChange event did not work properly for me.

Text fields events are not straight forward either.

var text_input = document.getElementById("TEXTFIELDNAME_txtInput"); 
text_input.onblur = function(){ required_function();};
text_input.onchange = function(){required_function();};
text_input.onkeyup = function(){required_function();};

Where TEXTFIELDNAME is a name of the date field.

HR.Net is wrapping every form element into a span-container and you can not trigger events on these containers, hence you need to go directly to HTML the object, hence we are adding “_txtInput” after name of the field name.
Inbuilt function $HRnet(“fieldname”) has a limited use and not always helpful.

Also you can reference fields in JQuery style:

var Date = $('#DATEFIELDNAME_txtInput');
This entry was posted in Uncategorized and tagged , , , , . Bookmark the permalink.

4 Responses to JavaScript events triggered on screen via custom script

  1. Dan Hutson says:

    You can also check whether a drop-down box value has changed by replacing _txtInput with _cboInput

    • admin says:

      Dan,

      If you have drop-down (like this one) element on the form, and in form builder it is named “SelectElement” then actual ID to it will be assigned “SelectElement_cboInput” and you would initiate it like this:
      var selectElement = document.getElementById(“SelectElement_cboInput”);
      or in jQuery style:
      var selectElement = $(‘#SelectElement_cboInput’);

  2. Dan Hutson says:

    I’m trying to trigger off of a date field that I have used Javascript to assign a value to when loading the form, the field is bound to a data view parameter.

    I’ve ued similar code before, but only once the form is loaded and after user interaction, but can’t get it to work when the form is loading.

    I just get the unhelpful ‘null’ or ‘underfined’ is null or not an object error message


    $(window).load(function(){

    toDay = new Date();
    month = toDay.getMonth()+1;
    thisYear = toDay.getFullYear();
    thisLeaveYear = thisYear - 1;
    lastLeaveYear = thisYear - 2;

    if(month <= 3) {
    $HRnet("CurrLeaveYear").setStoreValue("01/04/" + thisLeaveYear.toString());
    } else {
    $HRnet("CurrLeaveYear").setStoreValue("01/04/" + lastLeaveYear.toString());
    }

    $("#CurrLeaveYear_txtInput").trigger("change");

    });

    • admin says:

      Dan, what exact call is causing this issue? can you run HR.Net in Chrome and check the JS console – usually it tells you what line is causing the problem. I can suspect that this $("#CurrLeaveYear_txtInput").trigger("change"); might be a problem for some reason.

Leave a Reply

Your email address will not be published. Required fields are marked *