Saltar navegación

[Resuelto] Setting minimum characters in text search

Este hilo está resuelto. Aquí tiene una descripción del problema y la solución.

Problem:
Customer would like to set a minimum character limit on the search box - so for example you have to enter at least 10 characters before the search will work.
Solution:
To implement the feature of disabling the submit button until there are more than 10 characters in the search box, please add and customize the following JavaScript code in your CRED form's JS box:

jQuery(document).ready(function($) {
    // Reference to the search field and submit button
    var $searchField = $('input[name="wpv_post_search"]');
    var $submitButton = $('input[name="wpv_filter_submit"]');
 
    // Initially disable the submit button
    $submitButton.prop('disabled', true);
 
    // Event handler for keyup on the search field
    $searchField.on('keyup', function() {
        var minLength = 10;
        var currentLength = $(this).val().length;
 
        // Enable or disable the submit button based on the character count
        if(currentLength >= minLength) {
            $submitButton.prop('disabled', false);
        } else {
            $submitButton.prop('disabled', true);
        }
    });
});

In the code above:

- The search field is referenced by its name, wpv_post_search.
- The submit button is referenced by its name, wpv_filter_submit.
- The script initially disables the submit button.
- It enables the button only when the character count in the search field is 10 or more.

This is the technical support forum for Toolset - a suite of plugins for developing WordPress sites without writing PHP.

Everyone can read this forum, but only Toolset clients can post in it. Toolset support works 6 days per week, 19 hours per day.

Sun Mon Tue Wed Thu Fri Sat
- 9:00 – 12:00 9:00 – 12:00 9:00 – 12:00 9:00 – 12:00 9:00 – 12:00 -
- 13:00 – 18:00 13:00 – 18:00 13:00 – 18:00 13:00 – 18:00 13:00 – 18:00 -

Zona horaria del colaborador: America/Sao_Paulo (GMT-03:00)

Etiquetado: 

Este tema contiene 1 respuesta, tiene 2 mensajes.

Última actualización por Mateus Getulio 1 years, 10 months ago.

Asistido por: Mateus Getulio.

Autor
Mensajes
#2678576

Hi folks, I'm creating a text search for a custom post type. I would like to set a minimum character limit on the search box - so for example you have to enter at least 10 characters before the search will work. Can this be done please?

This is the page: enlace oculto

Can you offer some guidance on this please?

Many thanks, Emily

#2678645

Mateus Getulio
Colaborador

Idiomas: Inglés (English )

Zona horaria: America/Sao_Paulo (GMT-03:00)

Hello Emily,

Thank you for reaching out to Toolset support.

To implement the feature of disabling the submit button until there are more than 10 characters in the search box, please add and customize the following JavaScript code in your CRED form's JS box:

jQuery(document).ready(function($) {
    // Reference to the search field and submit button
    var $searchField = $('input[name="wpv_post_search"]');
    var $submitButton = $('input[name="wpv_filter_submit"]');

    // Initially disable the submit button
    $submitButton.prop('disabled', true);

    // Event handler for keyup on the search field
    $searchField.on('keyup', function() {
        var minLength = 10;
        var currentLength = $(this).val().length;

        // Enable or disable the submit button based on the character count
        if(currentLength >= minLength) {
            $submitButton.prop('disabled', false);
        } else {
            $submitButton.prop('disabled', true);
        }
    });
});

In the code above:

- The search field is referenced by its name, wpv_post_search.
- The submit button is referenced by its name, wpv_filter_submit.
- The script initially disables the submit button.
- It enables the button only when the character count in the search field is 10 or more.

Please note: The code provided is informational. Remember that custom coding falls outside the scope of our standard support. We can't create, debug, or modify code for you, and its maintenance is your responsibility. We hope this example points you in the right direction.

Let us know if you need further assistance or have any other questions.

Warm regards,
Mateus

#2678739

Hi Mateus, thanks so much for that, that works perfectly for me.