Autor Zpráva
jakre
Profil
Zdravím,
zajímalo by mě, jak například v JS nebo jiném jazyce naprogramovat to,
aby se dalo mezi jednotlivými textovými poli <input> přeskakovat
dle nastaveného tabindex="x" klávesou "-" (mínus - nachází se
u číselné klávesnice). Tato klávesa by ve formuláři plnila stejnou funkci jako
klávesa TAB. Stejně tak by se při stisknutí klávesy "-" pouze přeskočilo na
příslušné pole a tento znak by se do pole nezapsal.

Předem děkuji všem ochotným.
Str4wberry
Profil
Můžete nastínit cíl takového chování?

Řešit to jde tak, že budete odchytávat klávesy a podle toho focusovat příslušné <input>y:

Ovládání webu klávesami v JavaScriptu
jakre
Profil
Str4wberry:
Můžete nastínit cíl takového chování?
Mám formulář na svém webu.
Do textových polí zadávám trojmístné číslo a poté automaticky přeskočím
na další pole. Ovšem potřebuji, abych se z pole "množ." dostal klávesou
"-" či enter na další pole označené "mn. > 1". Mělo by to být možné,
ale dle návodu který jsi poslal mi není jasné, jak to naprogramovat.
Jen jsem se dozvěděl, že kód klávesy, kterou z pole "množ." potřebuji
přeskočit na další pole je 109.

Nejvhodnější by bylo, kdyby toto přeskočení fungovalo pouze u vypsaných
input tříd či ID. Například povolil bych tento script jen pro .treti.
juriad
Profil
jakre:
Nedělej to. Co když se uživatel přepíše v (poslední) cifře čísla objednávky? Znáš nějaký způsob, jak chybu opravit? Proč nefungují šipky, backspace, home, end?
Proč, když kliknu na input, tak se označí celý jeho obsah?
Myslíš si, že uživatelům zpříjemníš práci, ale ve skutečnosti ji ztížíš. Okamžik, kdy se provede něco, co uživatel nečeká, ho vyleká a dále bude postupovat při vyplňování opravdu pomalu, aby si byl jistý, že nenarazí na další tvoji vychytávku.

Už jsem narazil na fomrulář, kde bylo nejrychlejší vyplnění stisknoutím F12 a upravení hodnoty formulářového pole přímo ve zdrojáku stránky. :-)
jakre
Profil
Není to určeno pro uživatele, tedy pro veřejnost. Zda-li zadali něco špatně se později dle databáze zkontroluje
a do pole, které je chybně vyplněné je to hodí. Potřebuji, aby se co nejrychleji mohlo takto vyplňovat,
na webu sice není zveřejněný celý formulář, ale pro pochopení to postačuje.

Jde o to, abych mohl z papíru čísla ťukat bez jakéhokoli koukání se na monitor - prostě jen ťukat
to, co mám před obličejem a nehledat někde klávesu TAB. Nejlepší by bylo, abych se mezi poli
přepínal enterem. Jelikož není množství pevně třímístné, musím se po zadání čísla ručně
překlepnout do dalšího pole, nejlépe tím zmiňovaným enterem či klávesou "-".
Fisir
Profil
Reaguji na jakre:
A nemůžeš to zadávat do jednoho pole a potom to třeba v PHP rozsekat podle pomlčky do pole?
jakre
Profil
Fisir:

Hledám řešení, které jsem popsal výše a protože mi přijde jako vyhovující,
zatím jsem o jiných možnostech nepřemýšlel. Zkrátka mi přijde reálné,
aby fungoval script, který bude kontrolovat stisk klávesy "-" v poli input
nějaké třídy a přeskočí na další pole (dle následujícího tabindexu).

Jednoduše řečeno potřebuji klávesu TAB nahradit klávesou "-"...
Fisir
Profil
Reaguji na jakre:
Takže nějak takhle?
var inputs = document.getElementsByTagName('input');
var lastTabIndex = inputs[(inputs.length - 1)].tabIndex;
var currentInput = inputs[0];
function focusNextByTabIndex(){
    var currentTabIndex = currentInput.tabIndex;
    if(currentTabIndex == lastTabIndex){
        currentTabIndex = 0;
    }
    for(var i = 0; i < inputs.length; i++){
        if(inputs[i].tabIndex == (currentTabIndex + 1)){
            currentInput = inputs[i];
            inputs[i].focus();
            break;
        }
    }
}
(Živá ukázka.)
jakre
Profil
Fisir:
Takže nějak takhle?
Ano, ale fungování scriptu potřebuji pouze u daných tříd inputu.
Například v mém formuláři potřebuji, abych se z třídy .treti mohl
mínusem přepnout na .ctvrty (dle tabindexu). V jiných inputech
fungování scriptu nepotřebuji.
Fisir
Profil
Reaguji na jakre:
Tak si odpovídajícím způsobem změň definici kolekce inputs.
jakre
Profil
Fisir:
Tak si odpovídajícím způsobem změň definici kolekce inputs.
Mohl bys, prosím, změnit definici na input třídy .treti,
ovšem tak, aby bylo později možné do definice přidat například
ještě třídu .desaty.
Fisir
Profil
Reaguji na jakre:
var inputs = document.querySelectorAll('input.treti,input.desaty');
(IE 8+)
jakre
Profil
Fisir:
Script jsem nahrál na web viz zde
a jeví se mi jako nefunkční (Chrome), co je špatně?
Fisir
Profil
Reaguji na jakre:
Nevím, ukaž kompletní stránku.
jakre
Profil
V tomto příspěvku se nacházel zdrojový kód a JS kód mého webu.
Příspěvek byl nahrazen živou ukázkou, odkaz v příspěvku číslo [#17].
Fisir
Profil
Reaguji na jakre:
Prosím o odkaz na živou ukázku.

Nebo zkus upravit kód funkce validate na:
function validate(evt) {
 
  var theEvent = evt || window.event;
 
  var key = theEvent.keyCode || theEvent.which;
  
  if(theEvent.keyCode == 109 || theEvent.keyCode == 189){
 
        focusNextByTabIndex();
 
        return false;
 
    }
 
  key = String.fromCharCode( key );
 
  var regex = /[0-9]|\./;
 
  if( !regex.test(key) ) {
 
    theEvent.returnValue = false;
 
    if(theEvent.preventDefault) theEvent.preventDefault();
 
  }
 
}
a část document.onkeydown smazat.
Blbost, nefunguje.
jakre
Profil
Fisir:
Prosím o odkaz na živou ukázku.
Omlouvám se a dodávám ji.

Živá ukázka
Chamurappi
Profil
Reaguji na jakre:
Živá ukázka
Tento nástroj na ukázky mi ve starém Exploreru nefunguje, takže to neposoudím, ale vidím, že asi používáš zbytečně nespolehlivou událost onkeypress. Té je lepší se vyhnout prakticky vždy.

Pokud je to jen pro tvoji osobní potřebu a pro tři <input>y, nedělal bych v tom vědu a napsal bych prostě:
<input name="prvni" onkeydown="if(event.keyCode == 109) { this.form.druhy.focus(); return false }">
<input name="druhy" onkeydown="if(event.keyCode == 109) { this.form.treti.focus(); return false }">
… atd.
Kdybys chtěl chytat Enter, ten má číslo 13.

jen ťukat to, co mám před obličejem a nehledat někde klávesu TAB
Nestačí připojit si vedle druhou klávesnici? Pak bys měl Tab jedné z klávesnic vedle numerické části druhé.

Přestaň prosím v příspěvcích odřádkovávat uprostřed věty, blbě se to čte, když má člověk užší displej.
jakre
Profil
Reaguji na Chamurappiho:
Nestačí připojit si vedle druhou klávesnici? Pak bys měl Tab jedné z klávesnic vedle numerické části druhé.
Enter je lepším řešením, už ze zvyku...

Přestaň prosím v příspěvcích odřádkovávat uprostřed věty, blbě se to čte, když má člověk užší displej.
Budu se snažit se tomu vyvarovat.

Děkuji za radu, použil jsem kód:
...
<input type="text" name="treti" size=1 maxlength=3 tabindex="3" onkeydown="if(event.keyCode == 13) { this.form.ctvrty.focus(); return false }">
<input type="text" name="ctvrty" size=1 maxlength=3 tabindex="4" onkeypress='validate(event)'>

Vyřešeno.

Vaše odpověď


Prosím používejte diakritiku a interpunkci.

Ochrana proti spamu. Napište prosím číslo dvě-sta čtyřicet-sedm: