Wie dynamisch neu konfigurieren, Drupal ' s jQuery-basierten AutoVervollständigen bei der Laufzeit?

Drupal hat einen sehr gut gebauten, jQuery-basierte autocomplete.js. In der Regel, Sie müssen nicht die Mühe mit ihm, da er die Konfiguration und die Ausführung erfolgt durch die Drupal form-API.

Nun, ich brauche einen Weg, um es neu konfigurieren (Laufzeit mit JavaScript, das ist). Ich habe eine standard-drop-down-select-box mit einem text-Feld neben Sie, und je nachdem, welche option ausgewählt ist, in der select-box, die ich anrufen müssen unterschiedliche URLs für die Vervollständigung, und für eine der Optionen, die Autovervollständigung sollte vollständig deaktiviert werden. Ist es möglich zu konfigurieren, dass der vorhandene autocomplete-Instanz, oder muss ich die irgendwie zerstören und neu erstellen?

InformationsquelleAutor mikl | 2009-06-19

4

Haben Sie einen Blick auf misc/autocomplete.js.
```
/**
 * Attaches the autocomplete behavior to all required fields
 */
Drupal.behaviors.autocomplete = function (context) {
  var acdb = [];
  $('input.autocomplete:not(.autocomplete-processed)', context).each(function () {
    var uri = this.value;
    if (!acdb[uri]) {
      acdb[uri] = new Drupal.ACDB(uri);
    }
    var input = $('#' + this.id.substr(0, this.id.length - 13))
      .attr('autocomplete', 'OFF')[0];
    $(input.form).submit(Drupal.autocompleteSubmit);
    new Drupal.jsAC(input, acdb[uri]);
    $(this).addClass('autocomplete-processed');
  });
};
```
Die Eingabe der value-Attribut wird verwendet, um zu erstellen, ACDB, das ist ein cache der Werte für die AutoVervollständigen-Pfad (uri). In der Drupal.jsAC-Funktion binden Sie das element, das keydown -, keyup-und blur-events mit dem Trigger der autocomplete ajax-operation (die speichert die Werte in der ACDB-Objekt für das element), öffnet popups, etc.
```
/**
 * An AutoComplete object
 */
Drupal.jsAC = function (input, db) {
  var ac = this;
  this.input = input;
  this.db = db;

  $(this.input)
    .keydown(function (event) { return ac.onkeydown(this, event); })
    .keyup(function (event) { ac.onkeyup(this, event); })
    .blur(function () { ac.hidePopup(); ac.db.cancel(); });

};
```
Was Sie tun müssen, ändern Sie die Eingabe von ist-Wert und auch anfügen das Verhalten. Sie werden anfügen das Verhalten durch das entfernen der '.AutoVervollständigen-Verarbeitung Klasse auf die autocomplete text field-input-element, und rufen Sie dann Drupal.attachBehaviors(thatInputElement).

Funktioniert dies nicht. Dinge gehen sehr schlecht, wenn Sie legen das gleiche Verhalten an den gleichen Elements über und über wieder. Es kann sinnvoller sein, verschiedene AutoVervollständigen-Felder und einfach verstecken und zeigen Ihnen, basierend auf dem Wert der wählen Sie. Dies würde erfordern noch aufrufen von Drupal.attachBehaviors, wenn Sie ein-und ausblenden der widget, aber das gleiche Verhalten wäre angebracht bleiben, wenn der Schalter mehr als einmal passiert, und Sie würden es nicht riskieren anbringen, das gleiche Verhalten zu dem element, das mehrere Male.
- Gut, dass ich kein JavaScript-Experte, aber sollte es nicht möglich sein, verändern Sie die Werte in JavaScript statt die "nukleare option" zu zerstören und neu zu den AutoVervollständigen-jeder Zeit?
- wie sind die urls zwischengespeichert, in die abcd - [] - array müssen Sie schließen Sie das Verhalten, Sie zu aktualisieren und wenn Sie das tun, sollten Sie unbind() alle vorherigen Veranstaltungen begrenzt, um die AutoVervollständigen-element beforeward.
- Ich habe es geschafft, Holen Sie sich unverbindlich und erneut das Verhalten zu arbeiten, aber nicht, dass die Ursache das alte autocomplete-Objekt von der garbage Collection freigegeben? Ansonsten, das hier ein Speicherleck. Es ist wahrscheinlich keine große Sache, aber es ist entschieden unpretty 🙂
- Beachten Sie, dass dies ziemlich viel ist, was die location-Modul hat - haben Sie einen Blick auf location_autocomplete.js für den saftigen details.
InformationsquelleAutor bangpound

Gut, als Referenz, ich habe geworfen, die zusammen einen hack, der funktioniert, aber wenn jeder denken kann eine bessere Lösung, ich würd mich freuen, es zu hören.

Drupal.behaviors.dingCampaignRules = function () {
  $('#campaign-rules')
    .find('.campaign-rule-wrap')
      .each(function (i) {
          var type = $(this).find('select').val();

          $(this).find('.form-text')
            //Remove the current autocomplete bindings.
            .unbind()
            //And remove the autocomplete class
            .removeClass('form-autocomplete')
          .end()
          .find('select:not(.dingcampaignrules-processed)')
            .addClass('dingcampaignrules-processed')
            .change(Drupal.behaviors.dingCampaignRules)
          .end();

          if (type == 'page' || type == 'library' || type == 'taxonomy') {
            $(this).find('input.autocomplete')
              .removeClass('autocomplete-processed')
              .val(Drupal.settings.dingCampaignRules.autocompleteUrl + type)
            .end()
            .find('.form-text')
              .addClass('form-autocomplete');
            Drupal.behaviors.autocomplete(this);
          }
      });
};

Dieser code kommt aus der ding_campaign Modul. Fühlen Sie sich frei heraus zu überprüfen den code, wenn Sie brauchen, etwas ähnliches zu tun. Es ist alles GPL2.

InformationsquelleAutor mikl

1

es sollte so einfach wie dinamically ändern Sie den "Wert" von "hidden" autocomplete
input-element kommt, neben autocomplete Formularfeldern. dh.
```
$('select#myelement').bind('change', function(e) { 
  if (/* something */) {
    $('input#myelement-autocomplete').attr('value', '/mycustom/path');
  }
}); 
```
- Das scheint nicht zu funktionieren. Offenbar ist die URL gespeichert ist, irgendwo im JavaScript, und nicht re-read aus dem Eingabefeld.
- Auch Sie müssen entfernen autocomplete-processed Klasse aus das versteckte Feld und dann erneut fügen Sie die AutoVervollständigen-Verhalten durch Aufruf Drupal.behaviors.autocomplete(document);.
- es funktioniert, aber eine neue url registriert ist, auf jede Veränderung, wenn 2 mal neu befestigt, insgesamt 3 Anrufe gemacht werden, um server
InformationsquelleAutor gpilotino

Funktionierende Lösung für Drupal 5

/*
 *  Błażej Owczarczyk
 *  [email protected] 
 * 
 *  Name: Autocomplete City Taxonomy 
 *  Description: Hierarchical city selecting (province select and city autocomplete)
 */

var Act = Act || {};

Act.init = function () {
    $('select.act-province').change(Act.provinceChange);        //select with top taxonomy terms    
}

/*
 *  Change event of select element
 */
Act.provinceChange = function () { 
    var context = $(this).parent().parent();              
    var currentTid = $(this).val();
    Act.rewriteURI(context, currentTid);
    Act.unbind();
    Drupal.autocompleteAutoAttach();
};

/*
 *  Changes the value of hidden autocomplete input
 */
Act.rewriteURI = function (context, newTid) {
    var tempArray;
    tempArray = $('.autocomplete', context).val().split('/');
    tempArray.pop();
    tempArray.push(newTid);
    $('.autocomplete', context).val(tempArray.join('/'));    
};

/*
 *  Prevents muliple binding of the same events
 */
Act.unbind = function () {
    $('.form-autocomplete').unbind().parents('form').unbind('submit');
};

$(document).ready(Act.init);

InformationsquelleAutor

Schreibe einen Kommentar

Du musst angemeldet sein, um einen Kommentar abzugeben.