0

My goal is to load a simple jQuery function to trim any whitespace in an admin backend filter input. The use case involves a scanner inputting codes with spaces that will turn up no results.

I have tried a couple methods involving loading the script through an XML layout update as a phtml block, or because the filter is under adminhtml/ui_component, updating the column to load in my script as a component. The methods I have attempted have failed for one reason or another, whether because the load order is failing because I've failed to properly use requirejs in this case, or because the script cannot access the element.

The script is:

define([

    'jquery'

], 
$(function () {
    $("input[name='code']").bind('input', function(){
      $(this).val(function(_, v){
        return v.replace(/\s+/g, '');
      });
    });
  })

In essence, what is the best/recommended way to load this script so that it will strip whitespace out of an adminhtml filter?

0

Can you try with this script instead ? I should work for you. I have done 2 things :

  • Added the domReady to wait for the DOM to be loaded
  • Define $ to be jQuery

This is it :

require([
    'jquery',
    'domReady!'
], function ($) {

    $("input[name='code']").bind('input', function(){
        $(this).val(function(_, v){
            return v.replace(/\s+/g, '');
        });
    });
});
  • Thank you! I'll mark you as the answer very shortly. Is loading the script at a phtml file between script tags and inserting it into the XML acceptable for loading this or is there a better method for this case? – lasalsaverde May 14 at 16:31
  • You can add this in the phtml or you can call a js script from the layout.xml. Both ways are fine. – Taschert May 15 at 7:18

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.