Autorius Tema: Pagal select'ą rodyti skirtingus kitus select listus  (Skaityta 2120 kartus)

Neprisijungęs Tautvydas

  • Dalyvis
  • **
  • Įrašai: 438
  • Karma: +11/-0
    • Žiūrėti profilį
Pagal select'ą rodyti skirtingus kitus select listus
« Įrašytas: 2014-05-18 23:35:58 pm »
Niekaip neišgalvoju, kaip padaryti tokią funkcija, kad pasirinkus šalį "Lietuva" rodytų lietuvos miestus. Pasirinkus šalį Anglija, rodytų Anglijos.

Dabar padariau, kad parodo, bet antrą kartą pakeitus neberodo. Gal visai netaip net mąstau ir yra kokia paprastesnė funkcija? Prieš tai bandžiau su .replace, bet išvis nesigavo.

Kodas:


<select name='isvykimo_salis' id='isvykimo_salis'  >
<option>---</option>
<option value='1'>Lietuva</option><option value='2'>Anglija</option> </select>

</div>
</td>
</tr>
<tr>

<div class='selectas'>
<div id='miestas1'>
<select name='isvykimo_miestas'  >

</select>


</div>

</div>
</td>
</tr>

</table>

<div class='keiciamas' style='display:none' >
<select name='isvykimo_miestas'  >


<option value='61'>Batas</option><option value='62'>Birmingamas</option></select>
</div>

<div class='keiciamas2' style='display:none' >
<select name='isvykimo_miestas'  >


<option value='1'>Vilnius</option><option value='2'>Kaunas</option><option value='3'>Klaipėda</option> </select>
</div>

<div id='nematomi' style='display:none' >

</div>
<script>

$('#isvykimo_salis').change(function(){

if( $(this).val() == '2' ){

$( "#miestas1" ).html( $( ".keiciamas" ) );
$(".keiciamas").show();

}
});

$('#isvykimo_salis').change(function(){

if( $(this).val() == '1' ){

$( "#miestas1" ).html( $( ".keiciamas2" ) );
$(".keiciamas2").show();

}
});
</script>

Kodas nelabai patogiau matosi, tai tiesiog žodiškai gal pasakykit, kaip reikia tokius dalykus daryti, o tada savo jėgom bandysiu kol pavyks. Bent ant kelio užveskit. Ačiū


EDIT:

Kaip suprantu, mano kodas veiktų, jeigu .html funkcija neištrintų to <div> , iš kurio paima visą tekstą. Tada tos šalys keitaliotųsi, o .html funkcija kaskart turėtų iš kur paimti dar kartą.
« Paskutinį kartą keitė: 2014-05-18 23:39:30 pm sukūrė Tautvydas »

Neprisijungęs Tautvydas

  • Dalyvis
  • **
  • Įrašai: 438
  • Karma: +11/-0
    • Žiūrėti profilį
Ats: Pagal select'ą rodyti skirtingus kitus select listus
« Atsakymas #1 Įrašytas: 2014-05-19 12:12:58 pm »
Su clone funkcija pavyko.

Kodas:

<script>

$('#isvykimo_salis').change(function(){

if( $(this).val() == '2' ){

$( "#miestas1 .keiciamas2" ).remove();
$( "#miestas1 .keiciamas" ).remove();
//$( "#miestas1" ).clone( $( ".keiciamas" ) );
$( "#nematomi .keiciamas" ).clone().appendTo( "#miestas1" );
$( "#miestas1 .keiciamas").show();

}
});

$('#isvykimo_salis').change(function(){

if( $(this).val() == '1' ){
$( "#miestas1 .keiciamas" ).remove();
$( "#miestas1 .keiciamas2" ).remove();
//$( "#miestas1" ).clone( $( ".keiciamas2" ) );
$( "#nematomi .keiciamas2" ).clone().appendTo( "#miestas1" );
$( "#miestas1 .keiciamas2").show();

}
});
</script>


<div id='nematomi'>  - laikau abiejų šalių miestų select listus. Ir kai pasirenka kažkurią šalį, iš to div'o įkelia į matomą zoną, padaro matomą. O jei kitą spaudžia tai prieš tai ištrina atnaujintą matomą zoną ir vėl iš nematomos įkopijuoja select listus.

Teisingas sprendimo būdas, ar galima buvo paprasčiau?


Neprisijungęs Haris

  • Dalyvis
  • **
  • Įrašai: 833
  • Karma: +56/-0
    • Žiūrėti profilį
    • www.RubikoKubas.Lt
Ats: Pagal select'ą rodyti skirtingus kitus select listus
« Atsakymas #2 Įrašytas: 2014-05-20 02:44:03 am »
<select name='isvykimo_salis' id='isvykimo_salis'  >
<option>---</option>
<option value='1'>Lietuva</option><option value='2'>Anglija</option>
</select>
</div>
</td>
</tr>
<tr>
<td> <!-- pamirsai <td> -->
<div class='selectas'>
<div id='miestas'>

</div>
</div>
</td>
</tr>
</table>
<script>
$('#isvykimo_salis').change(function(){
var pasirinktaSalis = $(this).val(); // Gaunam pasirinka sali
var miestasElementas = $('.selectas #miestas'); // Cache'inam elementa, i kuri sudesim miestu sarasa
/*  Sitie du elementai dar 'fiziskai' neegzistuoja jie yra sukuriami tik atmintyje. juos sukuriau, tam, kad butu paprasciau generuoti option elementus (Maziau kodo), veliau jie yra iterpiami i #miestas elementa  */
var selectElementas = $('<select name="isvykimo_miestas"></select>'); // sukuriam select elementa
var optionElementas = $('<option></option>'); // sukuriam option elementa
/*  --- */
// Ziurint i ateiti, jeigu atsiras daugiau miestu i kuriuos vaziuoja, tau bus daug darbo keiciant html ir javascripta,
// tai geriausiai butu laikytu tuos miestus duomenu bazeje ir su ajaxu kreiptis i php, kuris sugeneruos miestu sarasa
// (geriausiai JSON formatu, pvz {[{pavadinimas: 'Londonas', id : 5}],[{...}]}) ir
// tu gali su jQuery sugeneruoti html koda miestu saraso
$.ajax({
url : 'gautiMiestus.php', // kreipiames i si faila
type : 'POST', // POST metodu bus nusiustas salies ID i pries tai pamineta faila
data : ({saliesID : pasirinktaSalis}), // duomenys kuriuos siusim i php faila
dataType : 'json', // duomenu tipas kuri tikimes gauti is php
success : function(response){ // Kreipimasis sekmingas
$.each( response, function(){ // Sukam cikla per gauta miestu sarasa
// Pridedam select elementui option elementus
// Pries pridedami option elementa, pirma ji siek tiek pakoreguojam - pridedam atributa value ir irasom miesto pavadinima
selectElementas.append( optionElementas.attr('value', this.id).html(this.pavadinimas) );
});
miestasElementas.append(selectElementas); // pridedam musu sugeneruota select sarasa i egzistuojanti elementa
miestasElementas.fadeIn(); // Kai sarasas pilnai sukrautas padarom ji matoma.
}
});
});
</script>

Parodziau, kaip butu galima patogiau visa sita widgeta padaryti. Ir cia siaip bus geras pavyzdys ateiciai. Kodo netestavau, bet pagal ideja manau turetu veikti.

EDIT: beje, jeigu sugalvosi daryti, pagal mano pavyzdi, tai tavo php faile reikes pakeisti turinio tipa, cia paaiskinta kaip : http://stackoverflow.com/questions/4064444/returning-json-from-a-php-script
« Paskutinį kartą keitė: 2014-05-20 02:47:45 am sukūrė Haris »

Neprisijungęs mahdeen

  • Naujokas
  • *
  • Įrašai: 1
  • Karma: +0/-0
    • Žiūrėti profilį
Ats: Pagal select'ą rodyti skirtingus kitus select listus
« Atsakymas #3 Įrašytas: 2014-09-17 14:18:36 pm »
Nes kai ta funkcija buvo virs html'o, tai pirmiau ta funkcija uzkrove ir uzkraunant funkcija nebuvo rastas tavo nurodytas html objektas, nes html dar neuzkrautas(nuo virsaus i apacia vykdomos programos), tai reiskia, kad jQuery nerado kam duoti ta change event'a, nes kaip minejau html'as dar neuzkrautas, ir change funkcija paliko tiesiog nenaudojama.
mahdeen

Manualai.lt Forumas

Ats: Pagal select'ą rodyti skirtingus kitus select listus
« Atsakymas #3 Įrašytas: 2014-09-17 14:18:36 pm »

Neprisijungęs Lukas

  • Administratorius
  • Herojus
  • ******
  • Įrašai: 7431
  • Karma: +232/-15
    • Žiūrėti profilį
Ats: Pagal select'ą rodyti skirtingus kitus select listus
« Atsakymas #4 Įrašytas: 2014-09-17 14:39:20 pm »
visalaika jquery koda rasyk viduje:

$(document).ready(function(){
// tavo kodas
});

tada nebus taip, kad html dar neuzsikrove, o js jau bando kazka daryti.

ta pati gausi su tokiais sutrumpinimais:


$(function(){
  // tavo kodas
});

jQuery(function($) {
  // tavo kodas
});


bet man asmeniskai ilgesnis siuo atveju patogiau skaitosi :) bet cia jau pripratimo reikalas.


Jūsų draugas, kolega ir puslapio administratorius,

Lukas.

Gerda Photography
Serveriai.lt 50% nuolaida!
Free Hosting
Free Templates

Manualai.lt Forumas

Ats: Pagal select'ą rodyti skirtingus kitus select listus
« Atsakymas #4 Įrašytas: 2014-09-17 14:39:20 pm »