How to prevent Autocomplete Caching?

Question

I have made textfield to be autocomplete field by using hook_form_alter.

mymoudle_form_alter(&$form, &$form_state, $form_id){
   $form['field_state']['und'][0]['value']['#autocomplete_path'] ='get-state-values';
}
    function mymoudle_drupal_menu() {
    $items = array();   

    $items['get-country-value'] = array(
            'title' => 'Country Value',
            'page callback' => '_get_country_value',
            //'page arguments'  => array(1),
            'access arguments' => array('access content'),
            'type' => MENU_CALLBACK,
    );
    $items['get-state-values'] = array(
            'page callback' => '_get_state_values',
            'access arguments' => array('access content'),
            'type' => MENU_CALLBACK
    );
    return $items;
}

function _get_state_values($string){
    $country =$_SESSION['country']; 
    if($country == 'India'){                
        $state = array('Tamilnadu' => 'Tamilnadu','Karanataka' => 'Karanataka');
    }
    else{
        $state = array('NewYork' => 'NewYork','Manahattan' => 'Manahattan');
    }   
    print drupal_json_output($state);exit;  
}
function _get_country_value(){
    $country = $_REQUEST['valueSelected'];  
    $_SESSION['country'] = $country;
    print drupal_json_output($country);exit;
}

If I select country as India and type in the state as 'n' it shows me in auto-complete as two states with n words like tamilnadu and karnataka which is correct(it runs ajax to fetch the values as shown in screenshot-1).

The issue over here is if I again change the country to 'Us' and type same 'n' it shows same set of results and it doesn't run the ajax(as shown in screenshoot-2). Its showing from cache I think for previous results.

NOTE: I want an fix for the ajax caching issue.

I have attached the screenshot of what's happening .How to avoid this issue?.Any help will be much appreciated.Thanks in advance.

Answer 1

Since, there is no proper way, I opted for hack (or work around) to get this working. As already mentioned by @Clive, removing/disabling caching mechanism would require more work. This solution just skips the caching part.

Step1: Copy the entire misc/autocomplete.js to your module js scripts directory.

Step2: Comment or remove the following line from the copied file

// See if this key has been searched for before.
  //if (this.cache[searchString]) {
      // We dont want some things to be cached
    //return this.owner.found(this.cache[searchString]);
  //}

Step3: Implement hook_js_alter to override it to specific pages you like.

/**
 * Implements hook_js_alter
 * @param array $javascript
 */
function MYMODULE_js_alter(&$javascript) {
  if (arg(0) == 'MYPAGE') {
    $javascript['misc/autocomplete.js']['data'] = drupal_get_path('module', 'MYMODULE') . '/js/autocomplete.js';
  } 
}

Answer 2

Static caching is built in so you'll need to override Drupal.ACDB.proptotype.search.

This is untested but should be near the mark:

Drupal.ACDB.prototype.search = function (searchString) {
  var db = this;
  this.searchString = searchString;

  // See if this string needs to be searched for anyway.
  searchString = searchString.replace(/^\s+|\s+$/, '');
  if (searchString.length <= 0 ||
    searchString.charAt(searchString.length - 1) == ',') {
    return;
  }

  // THIS IS THE BIT TO REMOVE
  // See if this key has been searched for before.
  //if (this.cache[searchString]) {
    //return this.owner.found(this.cache[searchString]);
  //}

  // Initiate delayed search.
  if (this.timer) {
    clearTimeout(this.timer);
  }
  this.timer = setTimeout(function () {
    db.owner.setStatus('begin');

    // Ajax GET request for autocompletion. We use Drupal.encodePath instead of
    // encodeURIComponent to allow autocomplete search terms to contain slashes.
    $.ajax({
      type: 'GET',
      url: db.uri + '/' + Drupal.encodePath(searchString),
      dataType: 'json',
      success: function (matches) {
        if (typeof matches.status == 'undefined' || matches.status != 0) {
          db.cache[searchString] = matches;
          // Verify if these are still the matches the user wants to see.
          if (db.searchString == searchString) {
            db.owner.found(matches);
          }
          db.owner.setStatus('found');
        }
      },
      error: function (xmlhttp) {
        alert(Drupal.ajaxError(xmlhttp, db.uri));
      }
    });
  }, this.delay);
};

That will change the behaviour site wide (or for the entire context in which you include the above snippet). To override for certain URIs you'll probably need to get a bit cleverer and monkey patch a few more core JS methods.

Also note that this doesn't disable caching, it just stops cached results from being returned instead of making the ajax call each time. To properly remove caching would require a bit more work.

Answer 3

The cache is saved in a property of ACDB object, unfortunately we can't access the instances of this object. However we can override the search function prototype object of Drupal.ACDB in order to delete this cache before every query.

Overriding Drupal.ACDB prototype will affect all autocompletes in Drupal, so you can minimize the impact (of not having cache) including your override javascript code only in specific pages. Also you can minimize the impact checking for the autocomplete ID or specific class or attribute since (inside the search function) you know which is the input in your DOM.

First you must backup the Drupal.ACDB.prototype.search function:

Drupal.ACDB.prototype.search_bkp = Drupal.ACDB.prototype.search;

Then you can override search function and apply your logic to erase the cache and then call search again.

Drupal.ACDB.prototype.search = 
    function (searchString) {  
        // your autocomplete element in DOM
        // use it like $(this.owner.input) to access jQuery functions
        console.log( 'AC =', this.owner.input ); 

        // Deleting the cache, apply your logic
        // ej. if ($(ac.owner.input).attr('id') === 'my-id-of-the-ac-input') {}
        this.cache = {};
        this.search_bkp(searchString); 
};

Finally, you can execute the code above "whenever you want" (after Drupal.ACDB definition)... you can even try it in the Chrome console.

Hope that helps.

Answer 4

I think your problem lies in how you are setting the session variable. Cache has nothing to do with it.

Drupal only needs to retrieve the values for the fields once to render the form on the server side. Your code doesn't throw any errors because the country field is rendered before the state field, so the state field uses the default country value (first item in the array) to perform its calculation.

You need some client-side code (JQuery) to refresh the state values via AJAX whenever the country value is changed.

Have a look at Tenken's answer to a very similar question.

I would also consider using a hierarchical taxonomy to store your values rather than hard-coding them as per this documentation page.

Answer 5

I think it is a session issue and session value only reflect after reload the page.

Answer 6

I had a similar problem I created an entity reference field, and then I wanted to have custom autocomplete result list based on another field value (for example a select box). I managed to pass the select box value as filter parameter to the custom drupal autocomplete_path handler(at the backend). The problem if I searched for "a" and select "val1" from the select box I will get some result list,but if I changed the select box value to "val2" and type the same search character "a" I will get result list related to "val1". It will not send an ajax call again because it is cached. So after many days of search I found a solution that resolved my problem, and that is by overriding the "Drupal.ACDB.prototype.search" I found the solution here :https://knackforge.com/blog/sujith/ajax-autocomplete-customization-textfield-drupal
The solution suggested @Clive works fine,I tested and it works.

Answer 7

I wanted a less intrusive solution for a Drupal 9 instance, so instead of copying the entire autocomplete.js file as mentioned above, I just overwrite one of the methods on the Drupal.autocomplete object. Here's what worked for me:

1. Create a behavior and attach it to your form/ page In your attach method, and within a 'once' block, overwrite the Drupal.autocomplete.options.source variable, set it to your own method: Drupal.autocomplete.options.source = myOwnSourceData;
2. Grab the contents of the function sourceData found in the /core/misc/autocomplete.js file (or the es6 version) and add it to your custom method named above.
3. Remove all references in that code to the cache variable (read and write)
4. Change all references to the autocomplete variable to make it global, it needs to be Drupal.autocomplete

In this way we're only overriding one function within the autocomplete file and not the entire file.

I really hope future iterations of Drupal allow us to turn caching off as an option in future.