[addon tagcontrol] TagControl

Přijde mi to hrozně neintuitivní. Tagům by neškodilo tlačítko × na mazání. Přidávání jsem taky dlouho koumal, než jsem přišel na to, že funguje enter. Vůbec je divné to oddělení, že někam píšeš tag a on se pak přidá o řádek vedle. Pořád jsem zkoumal, jak něco napsat do toho vrchního řádku.

Ondra: Na to bych taky nepřišel. Myslim, že problém je v tom, že tohle UI bylo vytvořeno pro výběr tagů s tim, že máš našeptávač, kde můžeš tag vybrat a on se pak udělá takovej modrej a kulatej. Ne pro vytváření nových tagů.

Hodně povedené to má Last.fm při tagování skladby/autora (tuším).

Přidal jsem podporu pro validaci. Jak v PHP, tak i v JS. Unikátní pravidlo je TagInput::UNIQUE, které dělá tagy unikátní (omezuje už vepisování tagů). Stejně tak pravidla :LENGTH a :MAX_LENGTH omezují počet tagů jako input text počet znaků – nedovolí napsat víc.

Další cesta bude asi přidání napovídání přes ajax, protože to se na tagy hodí nejvíc.

Skáče? Ten tag by měl zůstat stejně dlouhej, akorát se posune ten text a udělá místo pro křížek. Rozdělení mě taky štve, ale ještě nevim co s tim.

Kromě toho jsem přidal ajax našeptávátko a úplně nové demo: http://taginput.injectionsoft.com/

Ono je to trochu složitější, ale dík, tohle by spolu s dalším nastavením pomoct mohlo. Pak tam jsou ale různé bugy ve zpracovávání round-corners když se to přelamuje (a v různých prohlížečích jinak) – když je ten tag delší než celý řádek, tak se zalomit musí (to sice skoro nikdy není, ale nastat to může).

Edit: v kombinaci s ‌ to stačilo dík : )

Editoval Mikulas Dite (11. 12. 2010 14:14)

Pěkné! Ale abych si taky rýpnul: asi by bylo dobré, kdyby se návrhy daly procházet šipkami… Pokud by jsi byl takový filantrop, že byses rozhodl to udělat, koukni se na http://docs.jquery.com/…autocomplete, tam je to myslím automaticky, nebo v nějakém nastavení.

He : ) to už tam dávno je. Akorát se to pokazilo na jednom selectoru, jak je jich na stránce víc. Už to běží… Dík

A já si říkal… :D Díky!

Asi ano, ale je to o dost jinde. To cos posílal je i podle názvu spíš suggest, oproti tomu TagInput je záležitost úplně jiná – psaní tagů. Autocomplete je tady jako třešnička na dortu. Hodně důležité jsou i validace, které tady tvoří tak třetinu kódu a které jsem u suggestpickeru úplně neviděl.

Ahoj,

demopage vyzera byt nefunkcna..

Ahoj, dalo by sa pri nasepkavani v danom momente posielat vzdy max. 1 ajax dotaz? Momentalne je situacia taka, ze ked napisem rychlo slovo a server ma pomalsiu odpoved (localhost doma), tak mi to obcas skape. Tie ostatne sa aj tak posielaju zbytocne, kedze je potrebny aj tak iba ten posledny. T.z. ze pred vytvorenim noveho ajax requestu by sa vzdy checklo, ci je nejaky aktivny dotaz a ak ano, tak zrusit a az potom vytvorit novy.

BTW. v doplnkoch chyba link na toto forum

Díky, to s tím abort request jsem přidal https://github.com/…84405cc5d6ba.

To s asoc přidávat asi zatím nebudu. Suggested hodnoty nejsou povinné a user si může vyplnit co chce (hlavně ti bez JS). Proto nemá cenu vracet id, když některé hodnoty by ho neměly.

Zdravim, myslim, ze som nasiel bug.
Podmienka na tomto riadku https://github.com/…/tagInput.js#L65 by mala myslim byt

if (!($value.parent().data('tag-length') != 'false' && $value.parent().getTagInputValues().length >= parseInt($value.parent().daat('tag-length')))) {

(!=false)

Pred volanim parent::getValue() v metode getValue() je potrebne odstranit html atribut maxlength pretoze v TextInput::sanitize by to zobralo ako String a urezalo tagy na danu hodnotu (V pripade ze sme nastavili pravidlo Form::MAX_LENGTH)

<?php
public function getValue()
{
	unset($this->control->maxlength);
	$value = String::split(parent::getValue(), "\x01" . $this->delimiter . "\x01");
	if ($value[0] == '' && count($value) === 1) {
		$value = array();
	}
	return $value;
}
?>

Implementoval jsem raději upravenou sanitize, která trimne ty jednotlivé prvky. Thx

Edit: to hide() funguje trošku jinak, testoval jsem Mac Chrome/Safari/FF a Win IE8 a mělo by to být funkčí takhle.

Editoval Mikulas Dite (11. 2. 2011 19:54)

Určitě, tahle implementace dělaná na tagy, max stovky záznamů, každopádně jsem to psal tak, aby to šlo snadno rozšířit.

cauko, co sa tyka rozsirovania, tak by bolo fajn, keby si private vars dal ako protected, pripadne k nim dal gettery a settery, aby sa s nimi dalo z potomka pracovat.

Aha, nějak jsem na to zapomněl. Fixnul jsem to s filtry a předávání pole změnil na callback s parametry $filter, $count. Teď se mi to docela líbí. Díky : )

Tak můžu, ale teď už to imho není potřeba, protože není potřebova to rozšiřovat – data se tahají z modelu přes ten callback.

Jé, takovou blbost jsem tam nechal. Ok, odstranil jsem tu nadbytečnou kontrolu v response a filter přejmenoval na word_filter. To není zdaleka tak univerzální a shody s property by se to nemělo (resp. za ten setter to nestojí), pro payloadLimit jsem to přidal.

Tak zase ja :) Skusal som to otestovat v IE7 a zda sa ze to pada na pseudoselektoroch :hover a :focus, kedy to v IE vrati undefined

<script>
$('.tag-control-helper:focus')
</script>

, a netusim preco, kedze jquery by to malo mat vyriesene a vratit prazdny objekt. Napada ta nejaky fix, resp. nefunguje ti to nahodou? (skusam to v IETesteri)

No, pojdem v tvojich slapajach a budem sa musiet uspokojit tiez s IE8+. Stravil som teraz 3hodiny refaktorovanim, aby to aspon nehadzalo chyby – :focus staci jednoducho nahradit triedou .focus pre kontajner.

:hover som dal do try/catch pre ie7 – jQuery hodi "Syntax error, unrecognized expression: "
moznost debugovat je u mna nulova, takze som rad, ze to ‚chodi‘ aspon takto. Aj by som to niekam zavesil, ale je to tak prekopane (pouzil som to 1.krat pred par mesiacmi a odvtedy vela krat upravil), ze to asi nikomu nepomoze. Ale planujem sa zoznamit s GitHubom a forknut to, len ako to uz byva, nie je cas :)

Chybku jsem opravil zde: https://github.com/…801664dd42d9

Omlouvám se za zřejmě špatný postup opravy, s hitgubem jsem pracoval prvně :D

Edit: Aha, tak už jsem poslal pull request.

Editoval pepakriz (12. 5. 2011 14:23)

Přišel jsem ještě na jednu drobnou chybku. Při nastavení jiného delimiteru, který neobsahuje znak „,“ (například ‚[;]+‘) se při nastavení defaultních hodnot špatně rozdělej prvky, jelikož metoda setDefaultValue() spoléhá na oddělovací znak čárky. Řešením bude pravděpodobně zavedení nové proměnné pro defaultní oddělovač. Zkusím opět napsat patch.

Edit: Poslán pull request

Editoval pepakriz (13. 5. 2011 23:26)