JavaScript


Gravity Forms: How to Restrict a DatePicker Date Range and Datepicker 1 becomes minDate for datepicker 2

Create an html block in your form and add the following code:

<script type="text/javascript">
gform.addFilter( 'gform_datepicker_options_pre_init', function( optionsObj, formId, fieldId ) {
    if ( formId == 10 && (fieldId == 30 || fieldId == 32) ) {
        var ranges = [
            { start: new Date('10/01/2021'), end: new Date('10/11/2021') }
        ];
        optionsObj.beforeShowDay = function(date) {
            for ( var i=0; i<ranges.length; i++ ) {
                if ( date >= ranges[i].start && date <= ranges[i].end ) return [true, ''];
            }
            return [false, ''];
        };
        optionsObj.minDate = ranges[0].start;
        optionsObj.maxDate = ranges[ranges.length -1].end;
    }
    if ( formId == 10 && fieldId == 30 ) {
        optionsObj.onClose = function (dateText, inst) {
            jQuery('#input_10_32').datepicker('option', 'minDate', dateText).datepicker('setDate', dateText);
        };
    }
    return optionsObj;
});
</script>

Be sure to change the dates, the form ID and field ID for the two fields.


“Mixed content blocked” when running an HTTP AJAX operation on an HTTPS page

Recently, we got a peculiar error on an HTTPS website while making Ajax requests.
Even though the website was full HTTPS, the Ajax request using a relative path was getting the “Mixed content blocked” error message.
To resolve this issue fast (without messing with the Javascript code), we added the following meta tag in the website’s header.

<meta http-equiv="Content-Security-Policy" content="upgrade-insecure-requests"> 


Safari: ‘a.getTime’ is undefined

Recently, we were working with Google Charts at which we were presenting data from a timeline with some processing.
Our JavaScript code was formatted as follows to create Date objects:

$value = "2020-03-19 23:45:00";
var dateStrFormat = new Date($value);

The above code worked fine on Firefox and Chrome but it failed on Safari with the error:
a.getTime is not a function. (In 'a.getTime()', 'a.getTime' is undefined)
After some investigation we found that Safari does not support a Date() constructor that contains time as well so we had to change the code to the following block:

var dateStr = "2020-03-19";
var dateStrFormat = new Date(dateStr);
var hourStr = "23";
var minutesStr = "45";
dateStrFormat.setHours(hourStr, minutesStr);

The above works on all browsers!


JavaSript: Remove all non printable and all non ASCII characters from text 1

According to the ASCII character encoding, there are 95 printable characters in total.
Those characters are in the range [0x20 to 0x7E] ([32 to 126] in decimal) and they represent letters, digits, punctuation marks, and a few miscellaneous symbols.
Character 0x20 (or 32 in decimal) is the space character ' ' and
character 0x7E (or 126 in decimal) is the tilde character '~'.
Source: https://en.wikipedia.org/wiki/ASCII#Printable_characters

Since all the printable characters of ASCII are conveniently in one continuous range, we used the following to filter all other characters out of our string in JavaScript.


printable_ASCII_only_string = input_string.replace(/[^ -~]+/g, "");

What the above code does is that it passes the input string through a regular expression which will match all characters out of the printable range and replace them with nothing (hence, delete them).
In case you do not like writing your regular expression with the space character to it, you can re-write the above regular expression using the hex values of the two characters as follows:


printable_ASCII_only_string = input_string.replace(/[^\x20-\x7E]+/g, "");