 Forularz - pola zależna |
| Forularz - pola zależna |
 4.03.2015, 07:25:53
Post
#1
|
|
|
Grupa: Zarejestrowani Postów: 1 Pomógł: 0 Dołączył: 4.03.2015 Ostrzeżenie: (0%) 
 |
Zastanawiam się jak zrobić w formularzu aby były dwie listy rozwijane, z czego jeżeli w pierwszej wybierze się przykładowo jakieś województwo to w drugiej liście zostaną miasta przypisane tylko do tego województwa. Jeżeli zaś nie wybierze się żadnego województwa to w drugiej liście będą wszystkie miasta. Posklejałem kod, który po wybraniu jednej opcji pokazuje kolejne pola.
Taki kod mam: <html> <head> <meta charset="UTF-8"> <style> .stufftochoose select:last-of-type, .stufftochoose select:nth-child(2){ display:none } </style> <script> (function(){ "use strict"; function makeOptions(elements){ var str = ""; elements.forEach(function(text) { var option = document.createElement("option"); option.textContent = text; option.value = text; str += option.outerHTML; }); return str; } var district = { "(brak oddziału)": makeOptions(["(puste)"]), "Dolnośląskie": makeOptions(["(puste)", "js_dol_powiat1", "js_dol_powiat2"]), "Kujawsko-Pomorskie": makeOptions(["(puste)", "js_kuj_powiat1", "js_kuj_powiat2"]), "Lubelskie": makeOptions(["(puste)", "js_lub_powiat1", "js_lub_powiat2"]) }; var city = { "(puste)": makeOptions(["(puste)"]), "js_dol_powiat1": makeOptions(["(puste)", "dol_p1_Miasto 1", "dol_p1_Miasto 2"]), "js_dol_powiat2": makeOptions(["(puste)", "dol_p2_Miasto 1", "dol_p2_Miasto 2"]), "js_kuj_powiat1": makeOptions(["(puste)", "kuj_p1_Miasto 1", "kuj_p1_Miasto 2", "kuj_p1_Miasto 3"]), "js_kuj_powiat2": makeOptions(["(puste)", "kuj_p2_Miasto 1", "kuj_p2_Miasto 2", "kuj_p2_Miasto 3", "kuj_p2_Miasto 4"]), "js_lub_powiat1": makeOptions(["(puste)", "lub_p1_Miasto 1", "lub_p1_Miasto 2"]), "js_lub_powiat2": makeOptions(["(puste)", "lub_p2_Miasto 1", "lub_p2_Miasto 2", "lub_p2_Miasto 3", "lub_p2_Miasto 4"]) }; (Object.freeze || Object)(city); (Object.freeze || Object)(district); var empty = ""; function change(e, arr, len){ var elem = e.target; var indexOf = arr.indexOf(elem); if(indexOf === -1) indexOf = arr.indexOf(elem = e.target.parentElement); if(elem.value !== "" && elem.value !== empty){ if(indexOf !== len){ elem.nextElementSibling.style.display = "inline"; if(indexOf === 0){ elem.nextElementSibling.innerHTML = district[e.target.value]; elem.nextElementSibling.nextElementSibling.style.display = "none"; } else if(indexOf === 1) elem.nextElementSibling.innerHTML = city[e.target.value]; } } else { var cached = elem; while(cached){ cached = cached.nextElementSibling; if(cached) cached.style.display = "none"; } } } document.addEventListener("DOMContentLoaded", function(){ Array.prototype.forEach.call(document.querySelectorAll(".stufftochoose"), function(elem) { var arr = Array.prototype.slice.call(elem.querySelectorAll("select")); var len = arr.length - 1; arr.forEach(function(elem, n) { if(n <= 1) elem.addEventListener("click", function func(e){ change(e, arr, len); elem.removeEventListener("click", func); }); elem.addEventListener("change", function(e){ change(e, arr, len); }); }); }); }, false); })(); </script> </head> <body> <table class="form-table stufftochoose"> <tr><th><label for="company_province">1 wybierz</label></th> <td><select id="company_province" name="company_province" value="<?php echo $company_province; ?>"> <?php if($company_province== null) { echo '<option value=""'; echo $company_province== '' ? 'selected="selected"' : ''; echo '>Wybierz...</option>'; echo '<option value="Dolnośląskie"'; echo $company_province== 'Dolnośląskie' ? 'selected="selected"' : ''; echo '>Dolnośląskie</option>'; echo '<option value="Kujawsko-Pomorskie"'; echo $company_province== 'Kujawsko-Pomorskie' ? 'selected="selected"' : ''; echo '>Kujawsko-Pomorskie</option>'; echo '<option value="Lubelskie"'; echo $company_province== 'Lubelskie' ? 'selected="selected"' : ''; echo '>Lubelskie</option>'; } else { echo '<option value="Dolnośląskie"'; echo $company_province== 'Dolnośląskie' ? 'selected="selected"' : ''; echo '>Dolnośląskie</option>'; echo '<option value="Kujawsko-Pomorskie"'; echo $company_province== 'Kujawsko-Pomorskie' ? 'selected="selected"' : ''; echo '>Kujawsko-Pomorskie</option>'; echo '<option value="Lubelskie"'; echo $company_province== 'Lubelskie' ? 'selected="selected"' : ''; echo '>Lubelskie</option>'; } ?> </select> <select name="company_district" value="<?php echo $company_district; ?>" id="company_district"> </select> <select name="company_city" value="<?php echo $company_city; ?>" id="company_city"> </select></td> </tr> </table> </body> </html> |
 |
 
|
 |
|
4.03.2015, 07:38:04
Post
#2
|
|
 Grupa: Opiekunowie Postów: 3 855 Pomógł: 317 Dołączył: 4.01.2005 Skąd: że |
A ja się zastanaiam, jaki to ma związek z działem PHP? Przenoszę, proszę dostosować wątek do zasad panujących na Forum (np. bb-code).
-------------------- Jak poprawnie zadać pytanie | Jak poprawnie zatytułować wątek
Najczęstsze błędy | Błędy E_NOTICE | PHP FAQ | FAQ PHPedia | SQL-Injection | Logowanie i sesje | Hashowanie haseł | Server - od czego zacząć ? | Manual PHP Alternatywne Forum dla Ekspertów Nie pomagam na PW, nie mam GG |
|
|
|
 |
|
Wersja Lo-Fi | Aktualny czas: 14.08.2025 - 02:30 |
