Firing ajax_callback on textfield after a minimum number of character

Question

Ive created a textfield with an ajax callback with 'keyup' event.

In need the callback function to be fired only after a certain number of character ... I can control the number of character of the input in the callback function, but this is not the way I want it...

There's maybe a javascript way to avoid the callback to be fired before 5 character ?

My form field :

        $form['myitem'] = array(
          '#type' => 'textfield',
          '#size' => 6,
          '#maxlength' => 5,
          '#default_value' => '',
          '#name' => "my_name",
          '#disabled' => FALSE ,
            '#ajax' => array(
                'callback' => 'mymodule_mycallback_ajax_callback',
                'wrapper' => "mywrapper", 
                'method' => 'replace',
                'event' => 'keyup',
                'progress' => array('message' => NULL),
            ),
        );

Answer 1

One option is to use a custom jQuery event, eg. something like "startajaxCall". Set $form['my_input']['#ajax']['event'] = 'startajaxCall' and provide some JS to trigger your custom event after an appropriate number of keys is entered.

Answer 2

I also faced same challenge in one my project. Fixed it by below logic.

// Update the event to change instead of keyup.

 'event' => 'change', 

// Add below js line.

  // Trigger ajax event on myitem only after 5th character typed.
  $('.myitem-class').on('keyup', function() {
    if ($(this).val().length == 5) {
      $(this).trigger('change');
    }
  });