How to disable the mobile keyboard from displaying on click of the input field
Have you ever needed a way to disable the mobile screen keyboard from displaying for a specific input field?
I was recently working on a Shopify website where there was a filter on the products listing page. I found an issue that on click of that filter it was opening keyword on the mobile screen. I debugged and found that it's a bootstrap filter and creating an input box automatically at run time.
The solution to this was rather simple and I’d like to share it here for anyone else who is looking for a solution to this problem.
To block the mobile device keyboard from displaying you simply need to set the field to readonly with jQuery as displayed in the code below.
// Using ID field$('#input_id').attr('readonly','readonly');
// Using class name$('.input_class').attr('reado...