Change search minimum characters?

[hbcondo]

How do I change the number of characters required before an ajax search is initiated? Right now the default is set at 3 but I need to decrease it.

[Laura]

Hello, will assign the ticket to a higher support level who can help and advise you in your query.
Thanks! ?

Hi there!!! Help others from the community and mark any reply as solution if it solved your question. Mark as a solution

Laura Solanes - Graphic Designer and Web Designer

Please be patient as I try to answer each topic as fast as i can.

If you like the theme or the support you've received please consider leaving us a review on Themeforest!

Always happy to help you 🙂

[Radu]

Hi,

In what input ? screenshot + link pls

Cheers
R

Hi there!!! Help others from the community and mark any reply as solution if it solved your question. Mark as a solution

What support service includes ? What not ?

[hbcondo]

See attached screenshots; this is reproducible on Kleo’s demo site. When the magnifying glass is clicked on and search criteria is entered, the search will not be initiated until at least 3 characters are entered.

Trying to review the code and the doAjaxSearch method in app.js has a property called minChars with a default value of 3. How do we specify a different value without changing the original code?

Attachments:

You must be logged in to view attached files.

[Radu]

Hi,

Check this article

https://archived.seventhqueen.com/kleo/article/dequeue-and-deregister-the-app-js-theme-file-and-load-it-from-child-theme

Cheers
R

Hi there!!! Help others from the community and mark any reply as solution if it solved your question. Mark as a solution

What support service includes ? What not ?

[hbcondo]

Thanks, but how is this technique going to allow us to specify our own minimum character count rather than using the hard-coded value of 3 in the minChars property? Please provide some insight on this requirement for us.

[Radu]

So you will be able to edit the app.js file for your needs like how you pointed our in this screenshot : https://cdn.seventhqueen.com/sq-support/wp-content/uploads/2018/09/doAjaxSearch.png

Just do that and there you will be able to edit the app js file in child.

Cheers
R

Hi there!!! Help others from the community and mark any reply as solution if it solved your question. Mark as a solution

What support service includes ? What not ?

[hbcondo]

Could you please provide a code snippet of how to implement doAjaxSearch in a child theme js file? Thank you.

[Radu]

Hi,

I don’t have premade for that and not sure if the function can be rerwiten like a php one, but i had offered to you a possibility to overwrite the app.js file in child to be able to change that function params into app.js file in child.

Cheers
R

Hi there!!! Help others from the community and mark any reply as solution if it solved your question. Mark as a solution

What support service includes ? What not ?

[hbcondo]

So the possibility is for us to maintain an entire copy of app.js, which is over 4000 lines of code, just to change one line of code in it? There’s no way to override just doAjaxSearch even though that function has a lot of logic in it?

[Radu]

Yes, no snippet like in php cuz it not works in that way.

So you will need to copy and modify in child and using that snippet.

Cheers
R

Hi there!!! Help others from the community and mark any reply as solution if it solved your question. Mark as a solution

What support service includes ? What not ?

[hbcondo]

Why was this ticket marked as resolved? It was not resolved; editing the Kleo app.js file for one parameter is not a resolution and overriding the entire app.js file is not a resolution either. Please review the doAjaxSearch function again. Thanks.

[Radu]

Hi,

Sorry the ticket was closed automatically after a certain days

As a solution for your need please add the next snippet to child theme functions.php (make sure to have it activated)

COPY CODE

function sq7r_deregister_app_js() {
    $min = sq_option( 'dev_mode', 0 ) == 1 ? '' : '.min';
    //Deregister the core theme app script
    wp_deregister_script( 'app');
    wp_dequeue_script( 'app');

    //Register again the script but from child theme for custom changes.
    //This will pull and use the app.min.js or app.js from wp-content/themes/kleo-child/assets/js/app.js and app.min.js
    wp_register_script( 'app', get_stylesheet_directory_uri() . '/assets/js/app' . $min . '.js', array( 'jquery' ), $version, true );
    wp_enqueue_script( 'app', get_stylesheet_directory_uri() . '/assets/js/app' . $min . '.js', array( 'jquery' ), $version, true );

}

add_action('wp_enqueue_scripts', 'sq7r_deregister_app_js', 11);

With this snippet it will pull the app.js and/or app.min.js from child theme from same location : http://rdu.local/kleo/wp-content/themes/kleo-child/assets/js/app.js
So place the file modified into child theme and add the snippet and this will be updated proof.

Cheers
R

Hi there!!! Help others from the community and mark any reply as solution if it solved your question. Mark as a solution

What support service includes ? What not ?

[Author]

Posts