IT rekvalifikace s garancí práce. Seniorní programátoři vydělávají až 160 000 Kč/měsíc a rekvalifikace je prvním krokem. Zjisti, jak na to!
Hledáme nové posily do ITnetwork týmu. Podívej se na volné pozice a přidej se do nejagilnější firmy na trhu - Více informací.
Avatar
michal Čepelák:8.11.2019 9:14

Zdravím,
v javascriptu jsem začátečník, potřeboval bych poradit jak udělat.
mám formulář ve kterém mám input a select. Data do select se berou z databáze, input je type text. Potřeboval bych udělat aby když vyberu nějaká data v select tak aby se input přepnul do disable(zašednul ) a nebo pokud napíše něco do input text tak aby nešlo vybírat ze selectu.

Zkusil jsem: Zkoušel jsem googlit jestli nenajdu nějaké hotové řešení. Vým že bych tam měl použít asi onedit ale nevím jak to poskládat

Chci docílit: Aby když vyberu bud select nebo input aby šla použít pouze jedna položka.
a druhá se přepla sama do disable

Děkuji

 
Odpovědět
8.11.2019 9:14
Avatar
Filip Němeček
Tvůrce
Avatar
Odpovídá na michal Čepelák
Filip Němeček:8.11.2019 9:21

Ahoj, v první řadě musíš přes JS/jQuery zachytávat eventy výběru v select a zadání textu do input. Potom už je to otázka jenom správně nastavit atribut disabled té druhé komponentě. To by mělo jít třeba takto:

select.disabled = true;

Viz třeba zde - https://developer.mozilla.org/…ent/disabled

 
Nahoru Odpovědět
8.11.2019 9:21
Avatar
michal Čepelák:11.11.2019 9:22

Zdravím, mám tento kód

<input type="text" id="myInput" oninput="myFunction(event)" >
<select id="selecttest" onclick="myFunction1()" >
<option></option>
<option>test1</option>
</select>
<script>
function myFunction(event) {
        if (document.getElementByID("myInput").value = "")
    {
        document.getElementById("selecttest").disabled = false;
    }else{
    document.getElementById("selecttest").disabled = true;
    }

}

function myFunction1(){
        document.getElementById("myInput").disabled = true;
}
</script>

akorát mi to nefunguje, jsem začátečník v javascriptu.
Mělo by to fungovat že pokud je input text prázdný tak select je disable false a pokud něco začnu zapisovat tak select je disable true a pokud text vymažu tak se zase select přepne na disable false. To samé má dělat select ale tam nevím jestli se to dá udělat stejně a jestli to pro input text mám vůbec dobře.

Děkuji za rady

 
Nahoru Odpovědět
11.11.2019 9:22
Avatar
Peter Mlich
Člen
Avatar
Peter Mlich:12.11.2019 8:01

google = js select disable
google = js input disable
www prohlizec Firefox - Nastroje - Nastroje pro vyvojare - Konzola (pokud nemas, zapni si hlavni nabidku pres prave tlacitko na zahlavi okna, konzola pak zobrazuje js chyby; obcas se to samo prepina na debuger, tak je treba to prepnout zpet)

Co tady na nas zkousis? Tohle nemas z googlu, protoze takove nazvy neexistuji. Podle mne ses jen liny.
oninput
getElementByID

Tohle funguje? Je to disabled? Tak zkus pridat podminky.

<input type="text" id="myInput">
<select id="selecttest">
<option></option>
<option>test1</option>
</select>

<script>
var inp, sel;
inp = document.getElementById("myInput");
sel = document.getElementById("selecttest");
inp.disabled = true;
sel.disabled = true;
</script>

Udalosti (event), ktere se daji pouzit
google = mdn javascript select event
https://developer.mozilla.org/…select_event
Vlevo v menu "on"+"nazev" = onblur
(hloupe je, ze tohle je zrovna stranka tykajici se obecne elementu. Select google pochopiil jako udalost onselect, oznac mysi neco na strance)

afterscriptexecute
auxclick
blur
click
compositionend
compositionstart
compositionupdate
contextmenu
copy
cut
dblclick
DOMMouseScroll
error
focus
focusin
focusout
gesturechange
gestureend
gesturestart
keydown
mousedown
mouseenter
mousemove
mouseout
mouseover
mouseup
mousewheel
MozMousePixelScroll
msContentZoom
MSGestureChange
MSGestureEnd
MSGestureHold
MSGestureStart
MSGestureTap
MSInertiaStart
MSManipulationStateChanged
overflow
paste
select
show
touchcancel
touchstart
underflow
webkitmouseforcechanged
webkitmouseforcedown
webkitmouseforceup
webkitmouseforcewillbegin
wheel

google = mdn javascript form select options
https://developer.mozilla.org/…electElement

/* assuming we have the following HTML
<select id='s'>
    <option>First</option>
    <option selected>Second</option>
    <option>Third</option>
</select>
*/

var select = document.getElementById('s');

// return the index of the selected option
console.log(select.selectedIndex); // 1

// return the value of the selected option
console.log(select.options[select.selectedIndex].value) // Second

google = mdn javascript form multiselect options
https://developer.mozilla.org/…ectedOptions

<label for="foods">What do you want to eat?</label><br>
<select id="foods" name="foods" size="7" multiple>
  <option value="1">Burrito</option>
  <option value="2">Cheeseburger</option>
  <option value="3">Double Bacon Burger Supreme</option>
  <option value="4">Pepperoni Pizza</option>
  <option value="5">Taco</option>
</select>
<br>
<button name="order" id="order">
  Order Now
</button>
<p id="output">
</p>

<script>
orderButton.addEventListener("click", function() {
  let collection = itemList.selectedOptions;
  let output = "";

  for (let i=0; i<collection.length; i++) {
    if (output === "") {
      output = "Your order for the following items has been placed: ";
    }
    output += collection[i].label;

    if (i === (collection.length - 2) && (collection.length < 3)) {
      output +=  " and ";
    } else if (i < (collection.length - 2)) {
      output += ", ";
    } else if (i === (collection.length - 2)) {
      output += ", and ";
    }
  }

  if (output === "") {
    output = "You didn't order anything!";
  }

  outputBox.innerHTML = output;
}, false);
</script>

Tebe zajimaji mozna udalosti:
onclick, onchange (to je pro select), onmousedown, onmouseup, onkeydown, onkeyup, onpaste (vlozis text se schranky), onfocus (kdyz je element aktivujes, presunes na nej kurzor)


google = javascript disable form select options by input
(vynechat jquery, w3school muze obsahovat chyby, bootstrap pouziva jquery tez vynechat; a nebo to napis pres jquery :) )
https://stackoverflow.com/…lect-element
Tady resi problem, ze potrebuje zakazat input, pokud se select oprion value rovna necemu. Mozna bys mohl vychazet z toho. Chces neco podobne. Pak musis mit druhou funkcni, ktera to zakazuje na zaklade inputu, ze se necemu rovna ci nerovna.

<p>Contact Us Form </P>

<select id="menu" onChange="checkOption(this)">
    <option value="A">Select An Option</option>
    <option value="B">Option 1</option>
    <option value="A">Option 2</option>
</select>

<br>
<p> First Name </p>
<input type="text" name="input" disabled>

<p> Second Name </p>
<input type="text" name="input" disabled>

<p>Enquiry</p>
<textarea rows="4" cols"50" id="textarea" name="input" disabled>
Lorem ipsum dolor sit amet, an modo mucius eum,
sanctus concludaturque qui no. Stet esse intellegat no eam,
nonumes eligendi disputationi ad usu.
</textarea>

<br>
<input type="submit" value="Submit" name="input" disabled>
<script>
function checkOption(obj) {
    var input = document.getElementsByName("input");
    for(var i=0; i < input.length; i++) {
     input[i].disabled = !(obj.value == "B")
    }
}
</script>
 
Nahoru Odpovědět
12.11.2019 8:01
Avatar
Peter Mlich
Člen
Avatar
Peter Mlich:12.11.2019 8:06

S tim google = mdn, to jsem zkousel, jestli nenajdu rozumny priklad v dokumentaci mozily. Evidentne ne. Takze googluj bez toho.
Spousta lidi pouziva to js jquery, protoze cisty js neni uplne privetivy, srozumitelny a crossbrowser. Takze bude mozna dost problem najit to, co chces, ciste jen v js. Pokud na nem trvas. A samozrejme bych ti to dokazal napsat na pockani, ale to neni ma prace, za kterou mne plati :)

 
Nahoru Odpovědět
12.11.2019 8:06
Avatar
michal Čepelák:12.11.2019 9:11

Už mi to funguje jak ma

 
Nahoru Odpovědět
12.11.2019 9:11
Avatar
Peter Mlich
Člen
Avatar
Peter Mlich:12.11.2019 12:01

Ted mne napada, sice pozde, ale prece :) Tahle stranka je pouzitelna na nejake male pokusy.
https://www.jakpsatweb.cz/…y/index.html#…

 
Nahoru Odpovědět
12.11.2019 12:01
Děláme co je v našich silách, aby byly zdejší diskuze co nejkvalitnější. Proto do nich také mohou přispívat pouze registrovaní členové. Pro zapojení do diskuze se přihlas. Pokud ještě nemáš účet, zaregistruj se, je to zdarma.

Zobrazeno 7 zpráv z 7.