it-swarm-eu.dev

Nejlepší webové uživatelské rozhraní pro velké množství vstupních dat

Hledám dobré řešení, když uživatelé potřebují vložit velké množství dat do webové aplikace.

Příklad

  • Majitel obchodu chce do systému každý měsíc zadat 30–40 nových produktů. Majitel obchodu má tabulku všech produktů, jejich množství, ceny, výrobce, kontaktní informace, sériové kódy atd. (Asi 10 různých polí).

Právě teď přemýšlím o nějakém zobrazení mřížky, které uživateli umožní kopírovat a vkládat data z řečeného Excelu nebo z jakéhokoli tabulkového procesoru, který používají.

Jaké je nejlepší webové řešení, které uživateli umožňuje zadat tolik dat (aniž by museli každou položku zadávat jednotlivě)?

7
Mark

Co takhle uživatelské rozhraní k nahrání souboru tabulky, který má být automaticky zpracován rutinou importující databázi?

3
Michael Zuschlag

Omlouvám se, nový plakát.

Takže, pokud si to přečtu správně, žádáte, je pro webovou aplikaci způsob, jak číst data vkládaná ze schránky přicházející z tabulky aplikace Excel? Určitě by to pomohlo vědět, s jakými technologiemi pracujete. Následující vložená data aplikace Excel budou vypadat jako formátovaný text, například:

0055486645655 BEANS, ZELENÁ 700070 0005525551154 BEANS, PINK 99010

Jen bych založil textové pole, do kterého by bylo možné vložit data. Řetězec by pak mohl být dezinfikován a analyzován do tabulky na základě vašich formátovacích očekávání. Určitě by to nebylo hezké řešení, ale práci by to zvládlo. V JSF můžete jednoduše iaxovat data na server, skrýt vstupní pole a nechat server aktualizovat datovou tabulku s obsahem, který má uživatel schválit, aby bylo zajištěno, že správné informace jsou předávány do databáze.

2
Scruffs

Co by bylo skvělé, kdybyste již znali formát, ve kterém ukládají svá data, mohli byste mít jednoduché pole pro zadávání souborů (pak se ujistěte, že uživatel může zkontrolovat, co nahrál, než bude skutečně vložen do databáze): uživatelé milují „magická tlačítka“, kde stačí kliknout na jednu věc a vše si spočítá samostatně :-)

A i když neznáte pořadí sloupců, pokud je to známý formát, jako je CSV, můžete zobrazit první dva řádky dat a požádat uživatele, aby údaje porovnal s právem sloupec , takže budete znát pořadí a můžete importovat vše najednou, aniž byste uživatele museli ukládat svá data v extrémně specifickém formátu, a můžete si dokonce pamatovat formát pro příště. Osobně , to by byla moje oblíbená volba .


Jinak pro ruční zadání bych doporučil nejprve zobrazit pouze jeden řádek :

  • Poté, když uživatel vyplnil alespoň všechny požadované sloupce pro tento řádek, přidejte druhý řádek vstupu pod první tímto způsobem, pokud uživatel neprováděl chyba a vrací se k dřívějšímu řádku, s největší pravděpodobností zadá data postupně a soustředí se pouze na řádek najednou namísto toho, aby čelil obrovské zdi vstupních polí.

  • měli byste čas od času ukládat koncepty (např. Stackexchange), protože u dlouhých datových vstupů není nic frustrujícího, než kdybyste je náhodou náhodně museli zadávat znovu, stiskněte nesprávnou klávesu (ve skutečnosti, když opustíte stránku bez odeslání, možná budete chtít zobrazit potvrzovací políčko s uvedením, že data ještě nebyla uložena)

  • nezapomeňte zvýraznit celý řádek obsahující zaostřenou buňku (a možná i sloupec), tedy pokud chce upravit sloupec daleko na na straně, mohl by vyplnit nesprávnou řádku, pokud je na obrazovce mnoho řádků. Zebra zbarvení by také mohlo pomoci, ale názory jsou v této věci rozdílné.

    • pokud je mřížka řádků opravdu dlouhá (já bych to nenavrhoval, mohlo by to být snadno matoucí, ale pokud to opravdu musíte), ujistěte se, že je vždy viditelný název sloupců. nahoře, i když posunujete. Podívejte se například na ukázku Thead jQuery plugin demo .
2
wildpeaks

Jednoduché textové pole s tímto štítkem:

Zadejte seznam podobných produktů:
Skladové číslo; Název produktu; Název na účtu; Počet na skladě
oddělené sloupce středníkem, jeden produkt na řádek

a analyzovat data.

Je však trochu práce napravit: Při ověřování vstupu odhalte nesprávně formátovaná a neočekávaná data, upozorněte na uživatele a nechte je opravit, aniž by je ztratili. Nejjednodušší cesta na straně serveru by byla:

Poznal jsem následujících 75 produktů:

Je to správně? [Ano, zadejte data] [Ne, dovolte mi to opravit]

Ještě lepší by byl náhled na straně klienta (jako zveřejnění na zásobníku).


Odůvodnění: Ve srovnání s mřížkou ztratíte navigaci buněk a zarovnání sloupců, což je důležité při kontrola a úprava data.Nicméně, kdy zadávání data, oddělovač buněk a řádků méně záleží a Return má vhodnější chování pro spuštění nového řádku.

Získáte velmi jednoduché rozhraní, rychle se používá pro zadání jednoho nebo dvou produktů a pro vložení velkého seznamu záznamů z jakéhokoli zdroje, který je k dispozici. Stejný kód lze použít ke zpracování nahraných souborů (jak navrhoval @ Michael Zuschlag).

Vyhnul bych se vkládání hodnot do jednotlivých vstupních polí - často to pomůže programátorovi víc než uživatel.

0
peterchen