Moving cursor to correct point with a mask

Hi there,

I have created a form for a client and there is a custom mask on the phone input, I would like for it to always focus at the start of where they can type from and not where it is clicked.

Anyone able to help, here is a link to demonstrate what I mean: https://www.zerodebt.co.za/testing-page/

Thanks.

I provided the following via support, but figure I’ll drop here should anyone else be in search of a possible solution for this. This javascript code can be used to force the cursor to stay at the beginning of the input when empty.

var inputsMasked = document.querySelectorAll('.gfield.force_cursor_placement input');

for (i = 0; i < inputsMasked.length; ++i) {
  inputsMasked[i].addEventListener('mouseup', function(e) {
    if (e.currentTarget.value.replace(/\(|\)|_|-|\./g,'').trim() == '') {
      e.currentTarget.setSelectionRange(0,0);
    }
  });
}

In order to apply this code, you would also need to add a custom class of force_cursor_placement to the field.

1 Like

This topic was automatically closed 30 days after the last reply. New replies are no longer allowed.