Autor Zpráva
twisterss
Profil
Ahoj prosím o radu. Snažím se zkonstruvat formulář ve kterém mám asi 50 checkboxů a u každého několik inputů (text) a rád bych vytvořil podmínku, že při zaškrtnutí libovolného checkboxu se mi konkrétní inputy zablokují (disable). Prosím o pomoc, nevím jak to vytvořit šikovně abych nemusel vypisovat 50 řádků s každým checkboxem. Rád bych použil knihovnu JQuery.

Děkuji za pomoc.
_es
Profil
twisterss:
Snažím se zkonstruvat formulář
No a výsledok tvojej snahy je kde? Alebo to je obvyklý dotaz v štýle „Urobte mi...“?
Sir Tom
Profil
twisterss:
Také ahoj,

na JQuery se vykašli - udělej to přes čisté JS. Jakmile se zatrhne jeden checkbox, tak se zavolá událost, která (třeba za pomoci cyklu) přidá dotyčným inputům vlastnost disabled.

BTW - nebylo by to ale lepší udělat to tak, že po zaškrtnutí 1 checkboxu se zobrazí (přístupní, enable) patřičné inputy? (Lepší je enablovat nežli disablovat.)
twisterss
Profil
Ne neni to dotaz urobte mi, jen sem se nad tim trápil už dost dlouho a nemůžu na to přijít jestli to nějak šikovně jde bez použití cyklu a v javascriptu. Pokuď ne děkuji za radu a zkusím to udělat přes Javascript.

BTW jinak máš pravdu opravdu to budu poté až to doladím enablovat. ;)



 for($c=$cont; $c<$cont+5; $c++){
echo"<td><label>Upravit:</label><br /><input id=\"control$c\" type=\"checkbox\" name=\"ctverecek\" ><br/><br/>";

echo"<div class=\"blok$c\"><label id=\"zacatek\">Zač:</label>
        <input class=\"trida\" type='text' name='zacatek' value='20'/>:<input class=\"trida\" type='text' name='zacatek' value='30'/><br /><br /><label id=\"konec\">Kon:</label><input class=\"trida\" type='text' name='konec' value='21'/>:<input class=\"trida\" type='text' name='konec' value='30'/><br /><br /><label>Místo:</label><select name=\"ovoce\"><option value=\"jb\">Kvapilka</option><option value=\"hs\" selected=\"selected\">G. Táb</option></select></div></td>";
}

<script>
var a = $("div .blok1").children("input");
var b = $("div .blok1").children("select");
$(function(){
$(':checkbox').change(function(){
                                    if($(':checkbox').is(':checked')) {
                                        $(a).attr("disabled", true);
                                        $(b).attr("disabled", true);
                                    }else{
                                        $(a).attr("disabled", false);
                                        $(b).attr("disabled", false);
                                    }
                                });
})
    </script>
hexcross
Profil
Myslím že toto je co chceš, při kliknutí na checkbox to vybere tomu přiřazenej element a v něm vybere inputy :
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html>
<head>
  <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
  <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
  </head>
  <body>
<?php
for($i;$i<5;$i++){
?>
<label for="control-input">Aktivovat</label><input class="control-input" id="control-input" type="checkbox" value="<?php print($i);?>"/> <br />
<div class="wrapper-input wrapper-number-<?php print($i);?>">
  <label>Pole 1</label><input class="input-text" type="text" value="Superhustýtext" disabled="disabled" /><br />
  <label>Pole 2</label><input class="input-text" type="text" value="Superhustýtext" disabled="disabled" /><br /><br />
</div>
<?php
}
?> 
<script type="text/javascript">
$(document).ready(function() {

$(".wrapper-input .input-text").attr("disabled",true);  // všechny nastavíme na disabled
$(".control-input").attr("checked",false);  // všechny nastavíme na nezaškrtnuté


// při kliku
$(".control-input").click(function() {

  var value = $(this).val();
  
  if ($(".wrapper-number-"+ value +" .input-text").attr("disabled") == "disabled") {
    $(".wrapper-number-"+ value +" .input-text").removeAttr("disabled"); 
  }
  else{
    $(".wrapper-number-"+ value +" .input-text").attr("disabled",true);
  }
  

}); 
});
</script>
</body>
</html>
twisterss
Profil
hexcross:
Díky moc, to je přesně ono, nevěděl sem si rady jak to provést pro víc inputů takhle šikovně. Fakt super dík ;)

Vaše odpověď


Prosím používejte diakritiku a interpunkci.

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

0