Project

General

Profile

Actions

Feature #9517

open

Input multiple tags with typeahead

Added by Carsten Rose about 3 years ago. Updated 24 days ago.

Status:
In Progress
Priority:
High
Assignee:
Carsten Rose
Target version:
Start date:
06.11.2019
Due date:
% Done:

40%

Estimated time:
Discuss:
Prio Planung:

Description

  • Fuer Suchfilter waere es gut wenn man Tags eingeben koennten, die via Typeahead vorgeschlagen werden.
  • Die Vorschlagsliste wird gebaut mit den tags die zuvor mal eingegben wurden.

Folgende Libs koennten intressant sein:


Related issues

Related to QFQ - Bug #10150: typeAheadTag: pedantic=0 does not workRejectedCarsten Rose20.02.2020

Actions
Actions #1

Updated by Carsten Rose about 3 years ago

  • Due date set to 22.11.2019
  • Priority changed from Normal to High
Actions #2

Updated by Benjamin Baer almost 3 years ago

  • Due date changed from 22.11.2019 to 18.12.2019
Actions #3

Updated by Carsten Rose almost 3 years ago

  • Status changed from New to Some day maybe
Actions #4

Updated by Carsten Rose almost 3 years ago

  • Status changed from Some day maybe to New
Actions #5

Updated by Benjamin Baer almost 3 years ago

  • Status changed from New to Priorize
Actions #6

Updated by Carsten Rose almost 3 years ago

  • Target version changed from 146 to 55
Actions #7

Updated by Carsten Rose almost 3 years ago

  • Target version changed from 55 to next7
Actions #8

Updated by Marc Egger almost 3 years ago

  • Assignee changed from Benjamin Baer to Marc Egger
Actions #9

Updated by Marc Egger almost 3 years ago

  • Status changed from Priorize to In Progress
Actions #10

Updated by Marc Egger almost 3 years ago

Habe den code von hier ( https://maxfavilli.com/jquery-tag-manager ) in das neue File javascript/src/Helper/tagManager.js kopiert und ein paar Bugs bzw. Lint Fehler behoben.

Der TagManager wird von TypeAhead.js aufgerufen. Ich habe möglichst nichts an dem Code vom tagManager.js geändert und stattdessen dessen API benutzt. Es wäre sauberer den tagManager.js raus zu schmeissen und selber zu implementieren. Doch die bestehende Lösung funktioniert.

Mockup: Die Tag Felder Mockups befinden sich in mockup/typahead.php

API: Da die Tag Felder Typahead integrieren, sind die Attribute von QFQ-Typahead auch hier anwendbar. neu dazu kommen:

data-typeahead-tags="true"                 # tags Feld aktivieren
data-typeahead-pedantic="true"             # nur tags die vom Typahead vorgeschlagen werden, sind erlaubt
data-typeahead-tag-delimiters="[9, 44]"    # Ascii code der Tasten die man drücken kann, um einen Tag abzuschliessen. (Form submit mit Enter ist in diesem Feld deaktiviert)
value="<?php echo $tagsSafeJson; ?>"       # Json encodierte tags die schon gesetzt wurden. JSON: [{value: "Alaska", key: "AK"}, {value: "Alabama", key: "AL"}]
                                           # falls man keine Keys brauch, einfach die den key gleich wie value setzen

Post data: Json encodierter String von der Form:

[{value: "Alaska", key: "AK"}, {value: "Alabama", key: "AL"}]

Typeahead: Das Tag feld ruft die Typeahead API exakt gleich auf wie die bestehenden Typeahead Felder.

Actions #11

Updated by Carsten Rose almost 3 years ago

  • Assignee changed from Marc Egger to Carsten Rose
  • Target version changed from next7 to next5
Actions #12

Updated by Carsten Rose almost 3 years ago

QFQ Keywords:

typeAheadTag=0|1
typeAheadTagDelimiter=9,44 (TAB, COMMA)

Actions #13

Updated by Carsten Rose almost 3 years ago

  • Due date deleted (18.12.2019)
Actions #14

Updated by Carsten Rose almost 3 years ago

  • Related to Bug #10150: typeAheadTag: pedantic=0 does not work added
Actions #15

Updated by Carsten Rose over 1 year ago

  • Target version changed from next5 to next4
Actions #16

Updated by Carsten Rose 24 days ago

  • Target version changed from next4 to high
Actions

Also available in: Atom PDF