Liniile de selectare dinamică alese, fără reîncărcarea paginii

Liniile de selectare dinamică alese, fără reîncărcarea paginii
Foarte des se confruntă cu implementarea listelor drop-down dinamice aferente (selectați), foarte multe metode, foarte diferite, chiar și JSON este folosit în unele, care în opinia mea umilă duplică doar datele din baza de date și creează o redundanță banală.







Odată ce m-am familiarizat cu $ .ajax (JQuery), care poate transfera date folosind metode GET sau POST și a realizat că listele legate sunt ușor.

Trebuie remarcat faptul că există metode în care puteți genera liste dinamice de nenumărate ori și toate acestea vor fi legate. În acest articol există doar trei liste, care, în opinia mea, sunt suficiente pentru înțelegerea metodei ca atare și pentru crearea pe baza ei a algoritmilor îmbunătățiți pentru realizarea sarcinii.







Setarea sarcinii: pentru a conecta lista verticală (țară, zonă, oraș) utilizând $ .ajax (JQuery) fără a reîncărca pagina și datele sunt preluate din baza de date mySQL.

În primul rând, creăm tabele asociate în baza de date:
Scrieți următorul cod html:
Observați diviziile 2 goale "selectDataRegion" și "selectDataCity", în care vom introduce listele derulante generate. Selectarea cu țările este generată prin interogarea bazei de date cu numele țării sortat după câmp. În principiu, dacă prima listă este statică și datele rămân neschimbate, puteți să scrieți pur și simplu datele în html și să nu utilizați primul tabel al bazei de date, dar atunci va trebui să acordați mai multă atenție legăturii de țară și, respectiv, valorii selectate.

Creați fișierul de execuție /action/ajax.base.php:
Rămâne acum să testeze. Alegeți "Ucraina" -> "Regiunea Donetsk" -> "City" și veți fi fericiți! Deoarece temele pot fi implementate după cum urmează: nu ascundeți listele de zone și orașe și în loc de div divide afișați aceleași liste derulante, înregistrați doar un parametru zero cu selecția datelor în selecția timpurie sau manipulați parametrul "dezactivat".







Trimiteți-le prietenilor: