Drukowana wersja tematu

Kliknij tu, aby zobaczyć temat w orginalnym formacie

Forum PHP.pl _ Przedszkole _ [PHP]Lista rozwijana ze zmiennymi

Napisany przez: david8213 20.11.2018, 14:22:06

Co zrobiłem nie tak że nie wyswietla mi danych przypisanych do zmiennych ?

[PHP] pobierz, plaintext 
  1. <?
  2.  
  3. $zm1="1000";
  4. $zm2="2000";
  5. $zm3="3000";
  6. $zm4="4000";
  7.  
  8. ?>
  9.  
  10.  
  11. <form action="" method="post">
  12. <input type="submit" value="Wybierz opcję">
  13.     <select id="lista1" name="lista1">
  14. 	<option value=''>  </option>
  15. 	<option value='$zm1'> 1 m </option>
  16. 	<option value='$zm2'> 2 m </option>
  17. 	<option value='$zm3'> 3 m </option>
  18. 	<option value='$zm4'> 4 m </option>
  19.  
  20.     </select>
  21. </form>
  22. <br>
  23.  
  24. <?
  25.  
  26. (http://www.php.net/isset($_POST['lista1'])) ? $lista1=$_POST['lista1'] : $lista1=' nic nie wybrałes ';
  27.  
  28. $wyswietl="$lista1";
  29.  
  30. http://www.php.net/echo $wyswietl;
  31.  
  32. ?>
[PHP] pobierz, plaintext

Napisany przez: phpamator 20.11.2018, 14:32:12

Kod
<option value='<?=$zm1?>'> 1 m </option>

albo
Kod
<option value='<?php echo $zm1;?>'> 1 m </option>

jak tam sobie wolisz ;P

Napisany przez: nospor 20.11.2018, 14:33:02

A od kiedy kod html wyswietla zmienne php?

Napisany przez: phpamator 20.11.2018, 14:36:49

Od zawsze nospor ....... nie wiedziałeś ?
tongue.gif

... myślałem, że to ja tu jestem amatorem ...

Napisany przez: david8213 20.11.2018, 14:37:59

Co się nabijacie ... jestem w dziale początkujący - zapomniało mi się tongue.gif

A czy można zrobić np 3 listy. Wybrać z każdej listy daną a na końcu zeby mi je zsumowało?

Nie mam pomysłu jak to zrobić

Napisany przez: phpamator 20.11.2018, 14:39:48

Oczywiście
Umieść je w formie,i wyślij wybrane do php postem albo i doczep do tego jakiś prosty skrypcik javascript/jQuery
Zależy jak chciałbyś pokazać zsumowane wartości.

Napisany przez: david8213 20.11.2018, 14:40:55

mozesz jakiś przykład podać

Napisany przez: phpamator 20.11.2018, 14:44:10

Przykładu nie porzebujesz bo już go masz, powiel tylko twoje pole select z inną nazwą np "lista2" i oczywiście id musi także być inne dla każdego elmentu albo poprostu usuń id bo używasz nazwy pola.
zrób sobie var_dump tego co masz w $_POST a potem tylko przypiszesz odpowiednie dane do zmiennych pododajesz i po wsiem, możesz także sobie bezpośrednio dodawać np "$_POST['nazwa1'] + $_POST['nazwa2'] = twoja wartość tongue.gif

Napisany przez: nospor 20.11.2018, 14:45:05

Cytat
. jestem w dziale początkujący - zapomniało mi się
To moze pisz w dziale sklerotykow tongue.gif

Napisany przez: phpamator 20.11.2018, 14:45:47

Cytat(nospor @ 20.11.2018, 15:45:05 ) *
To moze pisz w dziale sklerotykow tongue.gif


ahahahahhahaah, nospooooor tongue.gif
nie żartuj sobie ... tongue.gif

Napisany przez: nospor 20.11.2018, 14:46:59

@phpamator wybacz, ale zapomnialo mi sie o czym mowisz wink.gif

Napisany przez: phpamator 20.11.2018, 14:49:28

Kod
<?

$zm1="1000";
$zm2="2000";
$zm3="3000";
$zm4="4000";

?>


<form action="" method="post">
<input type="submit" value="Wybierz opcje">
    <select id="lista1" name="lista1">
    <option value=''>  </option>
    <option value='<?=$zm1?>'> 1 m </option>
    <option value='<?=$zm2?>'> 2 m </option>
    <option value='<?=$zm3?>'> 3 m </option>
    <option value='<?=$zm4?>'> 4 m </option>

    </select>
    <select id="lista2" name="lista2">
    <option value=''>  </option>
    <option value='<?=$zm1?>'> 1 m </option>
    <option value='<?=$zm2?>'> 2 m </option>
    <option value='<?=$zm3?>'> 3 m </option>
    <option value='<?=$zm4?>'> 4 m </option>

    </select>
    <select id="lista3" name="lista3">
    <option value=''>  </option>
    <option value='<?=$zm1?>'> 1 m </option>
    <option value='<?=$zm2?>'> 2 m </option>
    <option value='<?=$zm3?>'> 3 m </option>
    <option value='<?=$zm4?>'> 4 m </option>

    </select>
</form>
<br>

<?
// tu sobie zrobisz reszte czyli sprawdzisz czy i co ci przyleciało POST'em
// co potrzebne dodasz i wywalisz na ekran
var_dump($_POST);
(isset($_POST['lista1'])) ? $lista1=$_POST['lista1'] : $lista1=' nic nie wybrałes ';

$wyswietl="$lista1";

echo $wyswietl;

?>


a nie ciekawiej byłoby jQuery i ajaxem wysłać sobie te wybrane dane ? i pokazać zwróconą wartość bez przeładowywania strony ?

Napisany przez: david8213 20.11.2018, 14:52:30

no pewnie tak tylko trzeba mieć o tym pojęcie tongue.gif

Napisany przez: phpamator 20.11.2018, 14:55:50

..aaaa to ty nie maaaasz questionmark.gif tongue.gif
a o czym nie masz bo zapomniałem questionmark.gif
żartuję, sprawa jest prosta.
zaraz ci pokażę na przykładzie.

Napisany przez: david8213 20.11.2018, 14:59:04

Chętnie zobaczę smile.gif

Tymczasem tu cos mi nie wyszło... wyswietla krzaczki 

[PHP] pobierz, plaintext 
  1. <?
  2.  
  3. $zm1="10";
  4. $zm2="20";
  5. $zm3="30";
  6. $zm4="40";
  7. $zm5="50";
  8. $zm6="60";
  9. $zm7="70";
  10. $zm8="80";
  11. $zm9="90";
  12. $zm10="100";
  13. $zm11="110";
  14. $zm12="120";
  15.  
  16. ?>
  17.  
  18.  
  19. <form action="" method="post">
  20. <input type="submit" value="Wybierz opcje">
  21.     <select id="lista1" name="lista1">
  22.     <option value=''>  </option>
  23.     <option value='<?=$zm1?>'> 1 m </option>
  24.     <option value='<?=$zm2?>'> 2 m </option>
  25.     <option value='<?=$zm3?>'> 3 m </option>
  26.     <option value='<?=$zm4?>'> 4 m </option>
  27.  
  28.     </select>
  29.     <select id="lista2" name="lista2">
  30.     <option value=''>  </option>
  31.     <option value='<?=$zm5?>'> 5 m </option>
  32.     <option value='<?=$zm6?>'> 6 m </option>
  33.     <option value='<?=$zm7?>'> 7 m </option>
  34.     <option value='<?=$zm8?>'> 8 m </option>
  35.  
  36.     </select>
  37.     <select id="lista3" name="lista3">
  38.     <option value=''>  </option>
  39.     <option value='<?=$zm9?>'> 9 m </option>
  40.     <option value='<?=$zm10?>'> 10 m </option>
  41.     <option value='<?=$zm11?>'> 11 m </option>
  42.     <option value='<?=$zm12?>'> 12 m </option>
  43.  
  44.     </select>
  45. </form>
  46. <br>
  47.  
  48. <?
  49. // JAK TU SPRAWDZIĆ CO PRZYSZŁO Z FORMATEK questionmark.gif
  50. // tu sobie zrobisz reszte czyli sprawdzisz czy i co ci przyleciało POST'em
  51. // co potrzebne dodasz i wywalisz na ekran
  52. http://www.php.net/var_dump($_POST);
  53. (http://www.php.net/isset($_POST['lista1'])) ? $lista1=$_POST['lista1'] : $lista1=' nic nie wybrałes 1';
  54.  
  55. (http://www.php.net/isset($_POST['lista2'])) ? $lista2=$_POST['lista2'] : $lista2=' nic nie wybrałes 2';
  56.  
  57. (http://www.php.net/isset($_POST['lista3'])) ? $lista3=$_POST['lista3'] : $lista3=' nic nie wybrałes 3';
  58.  
  59. $wyswietl1="$lista1";
  60. $wyswietl2="$lista2";
  61. $wyswietl3="$lista3";
  62.  
  63.  
  64. http://www.php.net/echo $wyswietl1;
  65. http://www.php.net/echo $wyswietl2;
  66. http://www.php.net/echo $wyswietl3;
  67.  
  68. ?>
[PHP] pobierz, plaintext


Zrobiłem jak poniżej - pewnie najprościej jak się da, ale działa tongue.gif

[PHP] pobierz, plaintext 
  1. <?
  2.  
  3. (http://www.php.net/isset($_POST['lista1'])) ? $lista1=$_POST['lista1'] : $lista1=' nic nie wybrałes 1';
  4.  
  5. (http://www.php.net/isset($_POST['lista2'])) ? $lista2=$_POST['lista2'] : $lista2=' nic nie wybrałes 2';
  6.  
  7. (http://www.php.net/isset($_POST['lista3'])) ? $lista3=$_POST['lista3'] : $lista3=' nic nie wybrałes 3';
  8.  
  9. $wyswietl1="$lista1";
  10. $wyswietl2="$lista2";
  11. $wyswietl3="$lista3";
  12.  
  13.  
  14. http://www.php.net/echo $wyswietl1.'<br>';
  15. http://www.php.net/echo $wyswietl2.'<br>';
  16. http://www.php.net/echo $wyswietl3.'<br><br>';
  17.  
  18. http://www.php.net/echo 'Suma: '.($wyswietl1+$wyswietl2+$wyswietl3).'<br>';
  19.  
  20. ?>
[PHP] pobierz, plaintext

Napisany przez: phpamator 20.11.2018, 15:24:23

tego tutaj nie było .... wink.gif

Napisany przez: nospor 20.11.2018, 15:25:01

Cytat
a nie ciekawiej byłoby jQuery i ajaxem wysłać sobie te wybrane dane ? i pokazać zwróconą wartość bez przeładowywania strony ?
Ja wiem ze dopiero zaczynam i zadaje glupie pytania ale zapytam mimo wszystko:
Czyli nasz kochany zapominalski ma niesamowity problem z odebraniem danych z POST a ty mu wiec proponujesz by uzyl jquery, wyslal ajaxa i wyswietlil rezultat spowrotem na stronie. Czy przypadkiem jak wyslesz dane AJAXem to i tak nie bedziesz ich musial odebrac z POST? Tak tylko niesmialo pytam. Czym sie rozni post wyslany formem od post wyslanego ajaxem? No ewidentnie sa jakies znaczace roznice skoro proponujesz te zamiane i autor bedzie musial jeszcze ogarnac dodatkowo jQuery i AJAX.... Po przemysleniu, tak, to o wiele prostrze do nauki niz zwykly formularz....

[koniec ironii]
tongue.gif

Napisany przez: phpamator 20.11.2018, 15:29:39

Nie wiem na jakim etapie jest nasz kolega "zapominalski" ... tongue.gif
... bo wiesz, ja też jestem początkującym ... tongue.gif

Napisany przez: nospor 20.11.2018, 15:56:30

Cytat
Nie wiem na jakim etapie jest nasz kolega "zapominalski" .
Mysle ze doskonale to widac na jakim etapie jest

Cytat
o wiesz, ja też jestem początkującym
Trudno nie zauwazyc wink.gif

@phpamator mam nadzieje ze nie zrozumiales mnie zle. Pomagaj dla david8213 jak najbardziej. Ewidetnie masz wieksza wiedze niz on. Ale nie gniewaj sie, jak ktos z jeszcze troszke wieksza wiedza wtraci sie od czasu do czasu i zawroci was ze zlego toru

Napisany przez: nospor 20.11.2018, 16:15:21

http://php.net/manual/en/function.mail.php

Napisany przez: phpamator 20.11.2018, 16:38:59

php posiada wbudowaną funkcję mail().
W związku z tym możesz jej użyć w taki sposób:

Kod
mail('do@email.adres', 'Tytuł wiadomości', "Treść wiadomości która może być połaczona z wartościami przekazanymi w zmiennych".$tak_sobie_mozesz_dodawac_stringi_zmienne_itp.' i kontynuować treść', $a_na_koncu_dodajesz_headers);

Poczytaj co nieco na temat z linku podesłanego przez nospor'a
tam masz wszystko pięknie opisane.

Weź poważnie pod uwagę nagłówki, wiele serwerów nie przyjmuje wiadomości bez nagłówków (odbija), są także ważne jeśli chciałbyś wysyłać wiadomości z załącznikami czy sformatowane jako HTML.

W podesłanym linku znajdziesz wszystko na ten temat



Cytat(nospor @ 20.11.2018, 16:56:30 ) *
... mam nadzieje ze nie zrozumiales mnie zle ...


Spoko, oczywiście, że się nie gniewam ...... gdzie on k.... jest ?!?!?questionmark.gif! tongue.gif:P:P


Napisany przez: nospor 20.11.2018, 16:49:32

Cytat
gdzie on k.... jest ?!
A gdzie ma byc? W domku zlopie miodek wink.gif

Napisany przez: david8213 22.11.2018, 11:28:43

Dlaczego nie pokazuje mi selecta "srednica_rury" po wyborze rodzaju rury

[HTML] pobierz, plaintext 
  1. <http://december.com/html/4/element/style.html>
  2.     .srednica_rury {  
  3.     display:none;
  4.     }
  5.     .rodzaj_rury:checked + label + .rodzaj_rury {   
  6.     display: block;
  7.     }
  8. </http://december.com/html/4/element/style.html>
  9.  
  10.  
  11.  
  12. <http://december.com/html/4/element/form.html id="" class="menu"  method="post" action="lista.php">
  13. <http://december.com/html/4/element/div.html>
  14. <http://december.com/html/4/element/select.html class="rodzaj_rury" id="rodzaj_rury" name="rodzaj_rury"> 
  15. <http://december.com/html/4/element/option.html value="" > </http://december.com/html/4/element/option.html>			
  16. <http://december.com/html/4/element/option.html value="1" >opcja 1 </http://december.com/html/4/element/option.html>
  17. <http://december.com/html/4/element/option.html value="2" >opcja 2</http://december.com/html/4/element/option.html>
  18. <http://december.com/html/4/element/option.html value="3" >opcja 3</http://december.com/html/4/element/option.html>
  19. <http://december.com/html/4/element/option.html value="4" >opcja 4</http://december.com/html/4/element/option.html>
  20.  </http://december.com/html/4/element/select.html>
  21. </http://december.com/html/4/element/div.html>
  22. <http://december.com/html/4/element/div.html>
  23. <http://december.com/html/4/element/select.html class="srednica_rury" id="srednica_rury" name="srednica_rury"> 
  24. <http://december.com/html/4/element/option.html value="1" >200</http://december.com/html/4/element/option.html>
  25. <http://december.com/html/4/element/option.html value="2" >180</http://december.com/html/4/element/option.html>
  26. <http://december.com/html/4/element/option.html value="3" >160</http://december.com/html/4/element/option.html>
  27. </http://december.com/html/4/element/select.html>
  28. </http://december.com/html/4/element/div.html>
  29. <http://december.com/html/4/element/input.html type="hidden" name="form_id" value="" />
  30. <http://december.com/html/4/element/input.html id="saveForm" class="button_text" type="submit" name="submit" value="wyślij" />
  31.  
  32. </http://december.com/html/4/element/form.html>	
  33.  
[HTML] pobierz, plaintext

Napisany przez: trueblue 22.11.2018, 11:40:24

A dlaczego miałby pokazywać? Przyjrzyj się selektorowi w CSS.

Napisany przez: david8213 22.11.2018, 11:45:54

zmieniłem w DIV-ach nadal nie działa


[PHP] pobierz, plaintext 
  1. <style>
  2.     .srednica_rury {  
  3.     display:none;
  4.     }
  5.     .rodzaj_rury:checked + label + .srednica_rury {   
  6.     display: block;
  7.     }
  8. </style>
  9.  
  10.  
  11.  
  12. <form id="" class="menu"  method="post" action="lista.php">
  13. <div class="rodzaj_rury">
  14. <select class="rodz" id="rodzaj_rury" name="rodzaj_rury"> 
  15. <option value="" > </option>			
  16. <option value="1" >opcja 1 </option>
  17. <option value="2" >opcja 2</option>
  18. <option value="3" >opcja 3</option>
  19. <option value="4" >opcja 4</option>
  20.  </select>
  21. </div>
  22. <div class="srednica_rury">
  23. <select class="sred" id="srednica_rury" name="srednica_rury"> 
  24. <option value="1" >200</option>
  25. <option value="2" >180</option>
  26. <option value="3" >160</option>
  27. </select>
  28. </div>
  29. <input type="hidden" name="form_id" value="" />
  30. <input id="saveForm" class="button_text" type="submit" name="submit" value="wyślij" />
  31.  
  32. </form>	
[PHP] pobierz, plaintext

Napisany przez: nospor 22.11.2018, 11:51:06

facepalmxd.gif

Przeciez trueblue wyraznie ci napisal co masz zle :/ Co z tego ze zamieniles na div jak w css nadal to chowasz...

Napisany przez: david8213 22.11.2018, 12:09:47

To działa. Czym się to różni od mojego. Tu też ukrywam w scc

[PHP] pobierz, plaintext 
  1. <style>
  2.  
  3.     .ukryte {
  4.     display:none;
  5.     }
  6.     .sprawdz:checked + label + .ukryte {
  7.     display: block;
  8.     }
  9.  
  10. </style>
  11.  
  12.  
  13. <div>        
  14.     <div>
  15.         <input id="" name="1" type="checkbox" value="" class="sprawdz" />
  16.          <label for="" >   wybierz   </label>
  17.         <div class="ukryte" >
  18.            <input type="checkbox"  />opcja 1
  19.            <input type="checkbox"  />opcja 2
  20.            <input type="checkbox"  />opcja 3
  21.         </div>
  22.     </div> 
  23. </div>
[PHP] pobierz, plaintext

Napisany przez: nospor 22.11.2018, 12:14:05

Za dzieciaka mielismy takie male ksiazeczki a w nich masa gierek w tym: ZNAJDZ 10 roznic

Polecam te zabawe i tobie. Wez sobie nie dzialajacy css, wez sobei dzialajacy css i znajdz 10 roznic. Naprawde juz przeginasz bo to dzieci w zlobku rozwiazuja takie zabawy

Napisany przez: david8213 22.11.2018, 12:16:11 

[PHP] pobierz, plaintext 
  1. <style>
  2.     .srednica_rury {  
  3.     display:none;
  4.     }
  5.     .rodzaj_rury:checked + label + .srednica_rury {   
  6.     display: block;
  7.     }
  8. </style>
  9.  
[PHP] pobierz, plaintext



No jest .. z tym także nie działa

class="nazwa" musi być w DIV czy Select. Czy to obojętne ?

Napisany przez: Neutral 22.11.2018, 12:23:53

Cytat
Kod
#expand-toggle:checked ~ * .expandable {
  visibility: visible;
}

To jest gotowiec z MDN: https://developer.mozilla.org/en-US/docs/Web/CSS/:checked, nic dodać nic ująć (ostatni przykład). Dobrze byłoby gdybyś znalazł różnicę między tym "~ *", a tym "~". W tym temacie jest to m.in. opisane: https://forum.pasja-informatyki.pl/393231/formularz-nieokreslona-liczba-zmiennych-a-zapytanie-sql.

Napisany przez: david8213 22.11.2018, 12:50:45

nie znam się tak jak wy a chciałem zrobic to najprościej... Czy ktos mi pomoże gdzie tu jest bład ?

[PHP] pobierz, plaintext 
  1. <style>
  2.     .srednica_rury {  
  3.     display:none;
  4.     }
  5.     .rodzaj_rury:checked + label + .srednica_rury {   
  6.     display: block;
  7.     }
  8. </style>
  9.  
  10.  
  11.  
  12. <form id="" class="menu"  method="post" action="lista.php">
  13.  
  14. <div class="rodzaj_rury">
  15. <select class="rodz" id="rodzaj_rury" name="rodzaj_rury"> 
  16. <option value="" > </option>			
  17. <option value="1" >opcja 1 </option>
  18. <option value="2" >opcja 2</option>
  19. <option value="3" >opcja 3</option>
  20. <option value="4" >opcja 4</option>
  21.  </select>
  22. </div>
  23.  
  24. <div class="srednica_rury">
  25. <select class="sred" id="srednica_rury" name="srednica_rury"> 
  26. <option value="1" >200</option>
  27. <option value="2" >180</option>
  28. <option value="3" >160</option>
  29. </select>
  30. </div>
  31. <input type="hidden" name="form_id" value="" />
  32. <input id="saveForm" class="button_text" type="submit" name="submit" value="wyślij" />
  33.  
  34. </form>	
[PHP] pobierz, plaintext

Napisany przez: trueblue 22.11.2018, 12:51:30 

[HTML] pobierz, plaintext 
  1. .rodzaj_rury:checked + label + .srednica_rury
[HTML] pobierz, plaintext

Pseudoselektor :checked dotyczy w przypadku SELECT opcji OPTION, a nie SELECT. Nawet gdyby dotyczył, to bezpośrednim sąsiadem nie jest LABEL, którego notabene nie ma w pokazanym kodzie.

Napisany przez: david8213 22.11.2018, 12:56:50

labele miałem tylko nie wkleiłem na forum

[PHP] pobierz, plaintext 
  1.  
  2. [php]<style>
  3.     .srednica_rury {  
  4.     display:none;
  5.     }
  6.     .rodzaj_rury:checked + label + .srednica_rury {   
  7.     display: block;
  8.     }
  9. </style>
  10.  
  11.  
  12.  
  13. <form id="" class="menu"  method="post" action="lista.php">
  14. <label class="rodzaj_rury" for="element_3">Wybierz opcje </label>
  15. <div class="rodzaj_rury">
  16. <select class="rodz" id="rodzaj_rury" name="rodzaj_rury"> 
  17. <option value="" > </option>			
  18. <option value="1" >opcja 1 </option>
  19. <option value="2" >opcja 2</option>
  20. <option value="3" >opcja 3</option>
  21. <option value="4" >opcja 4</option>
  22.  </select>
  23. </div>
  24. <label class="srednica_rury" for="element_3">Wybierz srednice </label>
  25. <div class="srednica_rury">
  26. <select class="sred" id="srednica_rury" name="srednica_rury"> 
  27. <option value="1" >200</option>
  28. <option value="2" >180</option>
  29. <option value="3" >160</option>
  30. </select>
  31. </div>
  32. <input type="hidden" name="form_id" value="" />
  33. <input id="saveForm" class="button_text" type="submit" name="submit" value="wyślij" />
  34.  
  35. </form>	
[PHP] pobierz, plaintext
[/php]

Napisany przez: trueblue 22.11.2018, 13:03:23

A przeczytałeś całość mojego posta?

Napisany przez: david8213 22.11.2018, 13:05:30

czyli label ma być bezpośrednio pod selectem ?

Napisany przez: trueblue 22.11.2018, 13:07:30

Czego dotyczy pseudoselektor :checked? Do jakiego elementu się odnosi?

Napisany przez: david8213 22.11.2018, 13:09:03

OPTION

Napisany przez: trueblue 22.11.2018, 13:10:21

A LABEL jest bezpośrednim sąsiadem OPTION?

Napisany przez: david8213 22.11.2018, 13:12:18

teraz jest a nie działa

[PHP] pobierz, plaintext 
  1. <style>
  2.     .srednica_rury {  
  3.     display:none;
  4.     }
  5.     .rodzaj_rury:checked + label + .srednica_rury {   
  6.     display: block;
  7.     }
  8. </style>
  9.  
  10.  
  11.  
  12. <form id="" class="menu"  method="post" action="lista.php">
  13. <div class="rodzaj_rury">
  14. <select class="rodz" id="rodzaj_rury" name="rodzaj_rury"> 
  15. <label class="rodzaj_rury" for="element_3">Wybierz opcje </label>
  16. <option value="" > </option>			
  17. <option value="1" >opcja 1 </option>
  18. <option value="2" >opcja 2</option>
  19. <option value="3" >opcja 3</option>
  20. <option value="4" >opcja 4</option>
  21.  </select>
  22. </div>
  23.  
  24. <div class="srednica_rury">
  25. <select class="sred" id="srednica_rury" name="srednica_rury"> 
  26. <label class="srednica_rury" for="element_3">Wybierz srednice </label>
  27. <option value="1" >200</option>
  28. <option value="2" >180</option>
  29. <option value="3" >160</option>
  30. </select>
  31. </div>
  32. <input type="hidden" name="form_id" value="" />
  33. <input id="saveForm" class="button_text" type="submit" name="submit" value="wyślij" />
  34.  
  35. </form>	
[PHP] pobierz, plaintext

Napisany przez: trueblue 22.11.2018, 13:16:20

Zanim zaczniesz pisać stronę, to poczytaj jakiś kurs HTML i CSS. Nie masz kompletnie pojęcia co robisz.
Bezpośrednim sąsiadem dla OPTION, może być co najwyżej inny OPTION, następujący po nim. LABEL na pewno nim nie jest, nawet jako go wciśniesz za ostatnią OPTION, bo tam w ogóle nie powinny być LABEL. Gdyby LABEL tam mógł być, to i tak jego sąsiadem nie będzie .srednica_rury.

Do SELECT powinieneś dodać atrybut required, a pokazywanie elementu oprzeć o pseudoselektory :invalid oraz :valid.

Napisany przez: david8213 22.11.2018, 13:57:28

Co tu jest nie tak ?

[HTML] pobierz, plaintext 
  1. <http://december.com/html/4/element/style.html>
  2.     .ukryte {
  3.     display:none;
  4.     }
  5.     .sprawdz:checked + label +.ukryte {
  6.     display: block;
  7.     }
  8. </http://december.com/html/4/element/style.html>
  9.  
  10. <http://december.com/html/4/element/div.html>        
  11.     <http://december.com/html/4/element/div.html>
  12.      <http://december.com/html/4/element/label.html> Wybierz opcję</http://december.com/html/4/element/label.html>
  13.         <http://december.com/html/4/element/select.html id="medwet" name="2"  value="medwet" class="sprawdz"/>
  14. <http://december.com/html/4/element/option.html value="" ></http://december.com/html/4/element/option.html>
  15. <http://december.com/html/4/element/option.html value="1" >aaaaaaa</http://december.com/html/4/element/option.html>
  16. <http://december.com/html/4/element/option.html value="2" >bbbbbbb</http://december.com/html/4/element/option.html>
  17. <http://december.com/html/4/element/option.html value="3" >ccccccc</http://december.com/html/4/element/option.html>
  18. 	</http://december.com/html/4/element/select.html>
  19.         </http://december.com/html/4/element/div.html>
  20.     </http://december.com/html/4/element/div.html> 
  21.  
  22.         <http://december.com/html/4/element/div.html class="ukryte" >
  23. <http://december.com/html/4/element/label.html >   Wybierz srednice </http://december.com/html/4/element/label.html>
  24.           <http://december.com/html/4/element/select.html class="" id="" name=""> 
  25. <http://december.com/html/4/element/option.html value="1" >200</http://december.com/html/4/element/option.html>
  26. <http://december.com/html/4/element/option.html value="2" >180</http://december.com/html/4/element/option.html>
  27. <http://december.com/html/4/element/option.html value="3" >160</http://december.com/html/4/element/option.html>
  28. 		</http://december.com/html/4/element/select.html>
  29.         </http://december.com/html/4/element/div.html>
  30.     </http://december.com/html/4/element/div.html> 
  31. </http://december.com/html/4/element/div.html>
[HTML] pobierz, plaintext

Napisany przez: trueblue 22.11.2018, 14:02:16

To samo co wcześniej.

Napisany przez: david8213 22.11.2018, 15:16:30

a czy jest możliwość zrobienia warunku...
Jak wybiorę z listy pierwszej aaaaaa lub bbbbb to z drugiej listy bedzie dostępna opcja 180 i 200 a ostatnia czyli 160 będzie zablokowana
oraz jak wybiorę z listy pierwszej cccccc to na drugiej liście zablokowane będzie 200 i 180 a odblokuje się opcja 160

Czy w css nie da się tego zrobić ?

Napisany przez: leonpro778 23.11.2018, 14:36:18

@david8213

Heh, trochę śmieszy mnie Twoje podejście do pewnych spraw. Jak na jednym forum nie podadzą Ci GOTOWEGO rozwiązania to biegniesz na drugie i na odwrót. Rozwiązanie Twojego problemu to (tak jak pisałem wcześniej):
- JS
- onChange
- blokowanie optionów (https://www.w3schools.com/jsref/tryit.asp?filename=tryjsref_option_disabled2)


Napisany przez: david8213 24.11.2018, 14:52:58

Jak wybiorę opcję z listy pierwszej 111111111 to ma mi zablokować pozycję czwartą z listy drugiej czyli 160

Moze mi ktoś pomóc z warunkiem chodzi o składnię



[PHP] pobierz, plaintext 
  1. <script>
  2. if (document.getElementById("rodzaj_rury").options[1] = true;) {
  3.     var x = document.getElementById("srednica_rury").options[4].disabled = true;
  4. }
  5.  
  6. </script>
  7.  
  8.  
  9. <select class="element select medium" id="rodzaj_rury" name="rodzaj_rury" onChange="myFunction()"> 
  10.  
  11. <option value="1" >11111111 </option>
  12. <option value="2" >22222222</option>
  13. <option value="3" >33333</option>
  14. <option value="4" >444444444</option>
  15. <option value="5" >5555555555</option>
  16. <option value="6" >66666666</option>
  17. <option value="7" >777777777</option>
  18. <option value="8" >888888888</option>
  19. <option value="9" >99999999</option>
  20. 		</select>
  21. 		</div> 
  22.  
  23. <label class="description" for="element_4">Wybierz średnicę rury </label>
  24. <div>
  25. <select class="element select medium" id="srednica_rury" name="srednica_rury"> 
  26.  
  27. <option value="1" >190</option>
  28. <option value="2" >180</option>
  29. <option value="3" >170</option>
  30. <option value="4" >160</option>
  31.  
  32. 		</select>
  33.  
[PHP] pobierz, plaintext



To tez nie działa

[PHP] pobierz, plaintext 
  1. <script>
  2. if ((document.getElementById('rodzaj_rury').options[1].selected==True) or (document.getElementById('rodzaj_rury').options[2].selected==True)) {
  3.     var x = document.getElementById("srednica_rury_120").disabled = true;
  4. }  else {
  5.     var x = document.getElementById("srednica_rury_120").disabled = false;
  6. }
  7. </script>
[PHP] pobierz, plaintext

Napisany przez: Neutral 24.11.2018, 19:56:13 

[HTML] pobierz, plaintext 
  1. <http://december.com/html/4/element/select.html id="trees">
  2. 	<http://december.com/html/4/element/option.html value="oak">oak</http://december.com/html/4/element/option.html>
  3. 	<http://december.com/html/4/element/option.html value="pine">pine</http://december.com/html/4/element/option.html>
  4. 	<http://december.com/html/4/element/option.html value="spruce">spruce</http://december.com/html/4/element/option.html>
  5. 	<http://december.com/html/4/element/option.html value="beech">beech</http://december.com/html/4/element/option.html>
  6. 	<http://december.com/html/4/element/option.html value="apple tree">apple tree</http://december.com/html/4/element/option.html>
  7. </http://december.com/html/4/element/select.html>
  8.  
  9. <http://december.com/html/4/element/select.html id="tree_type">
  10. 	<http://december.com/html/4/element/option.html value="deciduous">deciduous</http://december.com/html/4/element/option.html>
  11. 	<http://december.com/html/4/element/option.html value="conifer">conifer</http://december.com/html/4/element/option.html>
  12. 	<http://december.com/html/4/element/option.html value="conifer">conifer</http://december.com/html/4/element/option.html>
  13. 	<http://december.com/html/4/element/option.html value="deciduous">deciduous</http://december.com/html/4/element/option.html>
  14. 	<http://december.com/html/4/element/option.html value="deciduous">deciduous</http://december.com/html/4/element/option.html>
  15. </http://december.com/html/4/element/select.html>
[HTML] pobierz, plaintext


Kod
const arr = ['oak', null,'spruce'];
const arr2 = [4, 2, null];

function a() {
    
    for(var i=0;i<document.getElementById('trees').length;i++) {
        for(var j=0;j<arr.length;j++) {
            
            if(arr2[j] === null) {
                continue;
            }
            
            document.getElementById('tree_type').children[arr2[j]].disabled = false;
            
            if(document.getElementById('trees').selectedOptions[0].value === arr[j]) {
                document.getElementById('tree_type').children[arr2[j]].disabled = true;
            }
            
        }
    }
    
}

a();

document.getElementById("trees").addEventListener('change', a, false);


Do arr wpisujesz nazwy, które masz w select#trees, a do arr2 te, które są w select#tree_type. Indeks w tablicy arr odpowiada indeksowi w arr2, więc jeśli w arr jest 'oak' i aktualnie jest zaznaczony, to wtedy zablokuj możliwość wyboru w select#tree_type o numerze takim, jaki jest w arr2.

Poszukaj funkcji itp., żeby skrócić zapis z dwiema pętlami, jeśli się da oczywiście.

Jeśli skrypt nie będzie działał jak należy, pisz.

Napisany przez: david8213 25.11.2018, 09:46:13

Menu ma wyglądać jak poniżej
Czyli Dla Rury od standardowa do Plastikowa mają być dostępne tylko opcje 300, 250, 200 natomiast dla
rur gumowej i stalowej mają być dostępne tylko opcje 150, 100

Czy da radę zrobić to wykorzystując tą funkcję ?



[PHP] pobierz, plaintext 
  1. <form>
  2. <select id="trees">
  3. <option value="standardowa">Standardowa</option>
  4. <option value="miedziana">Miedziana</option>
  5. <option value="aluminiowa">Aluminiowa</option>
  6. <option value="platynowa">Platynowa</option>
  7. <option value="pozłacana">Pozłacana</option>
  8. <option value="posrebrzana">Posrebrzana</option>
  9. <option value="plastikowa">Plastikowa</option>
  10. <option value="gumowa">Gumowa</option>
  11. <option value="stalowa">Stalowa</option>
  12. </select>
  13.  
  14. <select id="tree_type">
  15. <option value="sr_rury300">300</option>
  16. <option value="sr_rury250">250</option>
  17. <option value="sr_rury200">200</option>
  18. <option value="sr_rury150">150</option>
  19. <option value="sr_rury100">100</option>
  20. </select>
  21. </form>
  22.  
  23. <script>
  24. const arr = ['standardowa','miedziana','aluminiowa','platynowa','pozłacana','posrebrzana','plastikowa','gumowa','stalowa',null];
  25. const arr2 = [4, 4, 4, 4, 4, 4, 4, 2, 2, null];
  26.  
  27. function a() {
  28.  
  29.     for(var i=0;i<document.getElementById('trees').length;i++) {
  30.         for(var j=0;j<arr.length;j++) {
  31.  
  32.             if(arr2[j] === null) {
  33.                 continue;
  34.             }
  35.  
  36.             document.getElementById('tree_type').children[arr2[j]].disabled = false;
  37.  
  38.             if(document.getElementById('trees').selectedOptions[0].value === arr[j]) {
  39.                 document.getElementById('tree_type').children[arr2[j]].disabled = true;
  40.             }
  41.  
  42.         }
  43.     }
  44.  
  45. }
  46.  
  47. a();
  48.  
  49. document.getElementById("trees").addEventListener('change', a, false);
  50.  
  51. </script>
[PHP] pobierz, plaintext


Tu coś mi ne działa bo nie blokuje opcji wskazanych w tablicy

Napisany przez: Neutral 25.11.2018, 18:03:12

Kod
const arr = [
[0, 3, 4],
[1],
[2],
[3],
[4],
[5],
[6, 3, 4],
[7, 0, 1, 2],
[8, 0, 1, 2]
];

function get_el_id(id) {
    return document.getElementById(id);
}

var x = [];

function loop_options(option) {
    
    if(x.length > 1) {
        x.splice(1,1);
        x.push(option.slice());
    } else {
        x.push(option.slice());
    }
        
    x = x.reverse();
        
    if(x.length > 1) {
        for(var j=1;j<x[1].length;j++) {
            get_el_id('tree_type').children[x[1][j]].disabled = false;
        }
    }
    
    for(var i=1;i<option.length;i++) {
        get_el_id('tree_type').children[option[i]].disabled = true;
    }

}

function disable_options() {
    arr.forEach(function(option) {
        
        if(option[0] == get_el_id('trees').selectedIndex) {
            loop_options(option);
        }
        
    });
}

disable_options();

get_el_id('trees').addEventListener('change', disable_options, false);


Pierwszy element w podtablicy oznacza kolejno indeks option'a.

Napisany przez: david8213 25.11.2018, 21:02:15

Dziekuję...bardzo mi pomogles smile.gif
Pięknie działa smile.gif ale jest mały błąd ...
Podczas wyboru ostatnich dwóch opcji jest zrobiona blokada na 300 a domyślnie wybiera 300 a ma być 150
Można jeszcze np ustawić w tablicy dla każdej opcji domyślne ustawienie ?
Np dla pierwszych siedmiu 300 a dla ostatnich dwóch 150
..a najlepiej jakby przy każdym wyborze rury wcześniej się średnica się resetowala gdyby ktoś klikał jak popadnie

Napisany przez: Neutral 26.11.2018, 01:20:17 

[HTML] pobierz, plaintext 
  1. <http://december.com/html/4/element/select.html id="trees">
  2. 	<http://december.com/html/4/element/option.html value="standardowa">Standardowa</http://december.com/html/4/element/option.html>
  3. 	<http://december.com/html/4/element/option.html value="miedziana">Miedziana</http://december.com/html/4/element/option.html>
  4. 	<http://december.com/html/4/element/option.html value="aluminiowa">Aluminiowa</http://december.com/html/4/element/option.html>
  5. 	<http://december.com/html/4/element/option.html value="platynowa">Platynowa</http://december.com/html/4/element/option.html>
  6. 	<http://december.com/html/4/element/option.html value="pozłacana">Pozłacana</http://december.com/html/4/element/option.html>
  7. 	<http://december.com/html/4/element/option.html value="posrebrzana">Posrebrzana</http://december.com/html/4/element/option.html>
  8. 	<http://december.com/html/4/element/option.html value="plastikowa">Plastikowa</http://december.com/html/4/element/option.html>
  9. 	<http://december.com/html/4/element/option.html value="gumowa">Gumowa</http://december.com/html/4/element/option.html>
  10. 	<http://december.com/html/4/element/option.html value="stalowa">Stalowa</http://december.com/html/4/element/option.html>
  11. 	<http://december.com/html/4/element/option.html value="anonymous">Anonymous</http://december.com/html/4/element/option.html>
  12. </http://december.com/html/4/element/select.html>
  13.  
  14. <http://december.com/html/4/element/select.html id="tree_type">
  15. 	<http://december.com/html/4/element/option.html value="sr_rury300">300</http://december.com/html/4/element/option.html>
  16. 	<http://december.com/html/4/element/option.html value="sr_rury250">250</http://december.com/html/4/element/option.html>
  17. 	<http://december.com/html/4/element/option.html value="sr_rury200">200</http://december.com/html/4/element/option.html>
  18. 	<http://december.com/html/4/element/option.html value="sr_rury150">150</http://december.com/html/4/element/option.html>
  19. 	<http://december.com/html/4/element/option.html value="sr_rury100">100</http://december.com/html/4/element/option.html>
  20. 	<http://december.com/html/4/element/option.html value="sr_rury50">50</http://december.com/html/4/element/option.html>
  21. </http://december.com/html/4/element/select.html>
[HTML] pobierz, plaintext


Kod
const arr = [
[0, 3, 4],
[1],
[2],
[3],
[4],
[5],
[6, 3, 4],
[7, 0, 1, 2],
[8, 0, 1, 2],
[9, 0, 1, 2, 3, 4, 5]
];

function get_el_id(id) {
    return document.getElementById(id);
}

var x = [];

function loop_options(option) {
    
    if(x.length > 1) {
        x.splice(1,1);
        x.push(option.slice());
    } else {
        x.push(option.slice());
    }
        
    x = x.reverse();
        
    if(x.length > 1) {
        for(var j=1;j<x[1].length;j++) {
            get_el_id('tree_type').children[x[1][j]].disabled = false;
        }
    }
    
    for(var i=1;i<option.length;i++) {
        get_el_id('tree_type').children[option[i]].disabled = true;
    }

}

var blank_option2 = false;

function first_non_disabled(option, incrementator, recursive) {

    if(option.length-1===get_el_id('tree_type').children.length) {
        blank_option2 = true;
        let new_option = document.createElement('option');
        new_option.selected = true;
        get_el_id('tree_type').add(new_option);
        get_el_id('tree_type').disabled = true;
    } else {
        if(blank_option2 === true) {
            blank_option2 = false;
            get_el_id('tree_type').children[get_el_id('tree_type').children.length-1].remove();
            get_el_id('tree_type').disabled = false;
        }

        if(option[recursive]!==incrementator) {    
            get_el_id('tree_type').children[incrementator].selected = true;
        } else {
            recursive++;
            incrementator++;
            first_non_disabled(option, incrementator, recursive);
        }
    }
    
}

function disable_options() {
    arr.forEach(function(option) {
        
        if(option[0] === get_el_id('trees').selectedIndex) {
            loop_options(option);
            first_non_disabled(option, 0, 1);
        }
        
    });
}

disable_options();

get_el_id('trees').addEventListener('change', disable_options, false);


Masz, proszę. Tak jak chciałeś, dopisałem nowy "moduł" do kodu. Jeśli będziesz dodawać nowe opcje do select'a, to będziesz musiał też modyfikować tablicę arr.

Od elementu jeden i dalej w podtablicy możesz umieszczać indeksy option'a, który ma być zablokowany (disabled), przykład:

[HTML] pobierz, plaintext 
  1. <http://december.com/html/4/element/select.html id="trees">
  2.     <http://december.com/html/4/element/option.html value="oak">oak</http://december.com/html/4/element/option.html>
  3.     <http://december.com/html/4/element/option.html value="beech">beech</http://december.com/html/4/element/option.html>
  4. 	<http://december.com/html/4/element/option.html value="apple tree">apple tree</http://december.com/html/4/element/option.html>
  5. 	<http://december.com/html/4/element/option.html value="pear tree">pear tree</http://december.com/html/4/element/option.html>
  6. 	<http://december.com/html/4/element/option.html value="cherry tree">cherry tree</http://december.com/html/4/element/option.html>
  7. 	<http://december.com/html/4/element/option.html value="hazel">hazel</http://december.com/html/4/element/option.html>
  8. </http://december.com/html/4/element/select.html>
  9.  
  10. <http://december.com/html/4/element/select.html id="tree_type">
  11.     <http://december.com/html/4/element/option.html value="conifer">conifer1</http://december.com/html/4/element/option.html>
  12.     <http://december.com/html/4/element/option.html value="conifer">conifer2</http://december.com/html/4/element/option.html>
  13.     <http://december.com/html/4/element/option.html value="deciduous">deciduous1</http://december.com/html/4/element/option.html>
  14.     <http://december.com/html/4/element/option.html value="deciduous">deciduous2</http://december.com/html/4/element/option.html>
  15. </http://december.com/html/4/element/select.html>
[HTML] pobierz, plaintext

Kod
const arr = [
   [0, 1, 3]
];

Jeśli wybierzesz opcję "oak", czyli zero (0), to wtedy zablokowane zostaną indeksy jeden i trzy (1, 3), czyli "conifer2" i "deciduous2".

Powyższy kod dla wybranego option'a o indeksie zero z select'a pierwszego zablokuje możliwość wyboru select'owi drugiemu indeksy jeden i trzy. W ten sposób właśnie umieszczaj dane w tej tablicy. Najpierw indeks option'a w pierwszym select i dalej indeksy, które będą blokowane w drugim select. Jeśli nic, nie ma być zablokowane w drugim select, to wtedy możesz umieścić sam tylko indeks, przykład:
Kod
const arr = [
   [5]
];

Ten zapis w kodzie nie zablokuje żadnego option'a w select drugim, ponieważ jest podany tylko indeks pierwszego option'a (5 - hazel), a opcje do zablokowania nie są podane, więc nic nie zostanie zablokowane w drugim select.

Powered by Invision Power Board (http://www.invisionboard.com)
© Invision Power Services (http://www.invisionpower.com)