Spletni obrazec s pogojem @ Slo-Tech

Forum » Izdelava spletišč »
Spletni obrazec s pogojem

Spletni obrazec s pogojem

alenkah :: 16. jan 2013, 21:51

Pozdravljeni. Opravičujem se, če gre za ponovljeno vprašanje, sicer sem že iskala, vendar nisem našla (lahko pa, da sem spregledala, najverjetneje sem...).

Imam preprost spletni obrazec. Vanj se vpiše par informacij, ki se potem v mailu pošljejo naprej. php datoteka je ločeno. Tu je del kode.

<form method="post" action="obrazec.php">
    Znamka tiskalnika:
    <select name="tiskalnik">
      <option value="znamka1">znamka 1</option>
      <option value="znamka2">znamka 2</option>
      <option value="znamka3">znamka 3</option>
    </select><br>
    Model tiskalnika:
    <input type="text" name="model" list="znamkaX" id="model">
    <datalist id="znamka1">
      <option value="model1">model 1</option>
      <option value="model2">model 2</option>
      <option value="model3">model 3</option>
      <option value="model4">model 4</option>
      <option value="model5">model 4</option>
    </datalist>
    <datalist id="znamka2">
      <option value="model1">model 1</option>
      <option value="model2">model 2</option>
      <option value="model3">model 3</option>
      <option value="model4">model 4</option>
      <option value="model5">model 4</option>
    </datalist>
    <datalist id="znamka3">
      <option value="model1">model 1</option>
      <option value="model2">model 2</option>
      <option value="model3">model 3</option>
      <option value="model4">model 4</option>
      <option value="model5">model 4</option>
    </datalist><br/> ...

Zanima me, kako bi lahko določila, da na podlagi izbrane znamke potem ponudi drug datalist - če v prvem oknu izbere znamka1, da se potem pojavi uporabi datalist znamka1. Torej, kako določim, da na podlagi polja "tiskalnik" izbere določen list="tista znamka". Upam, da sem napisala razumljivo.

Vse, kar se dogaja s podatki, je v obrazec.php in vse deluje super, tegale pa ne znam, in se vedno bolj zmedena, ko iščem rešitev po netu :/

Hvala za pomoč.

keworkian :: 16. jan 2013, 22:08

Kaj bi rajše jquery, mootools ali plain ol' javascript?

Obscenities in B-Flat

carota :: 16. jan 2013, 22:09

Z JavaScriptom si boš morala pomagat. Nekaj takega rabiš: JavaScript Dynamic dependent drop down list box.

Gud lak.

alenkah :: 16. jan 2013, 22:17

čim enostavneje, tem bolje, keworkian! :))

hvala, carota, grem se zakopat not 8-O

Zgodovina sprememb…

spremenilo: alenkah (16. jan 2013 ob 22:17)

alenkah :: 16. jan 2013, 23:06

OK, nekako sem... prvi korak. S pomočjo tistega linka sem sedaj v glavo dodala tole:

  <script language="javascript" type="text/javascript">
  function dropdownlist(listindex)
  {
  document.narocilnica.model.options.length = 0;
  switch (listindex)
    {
    case "znamka1" :
      document.narocilnica.model.options[0]=new Option("--Izberite model--","");
      document.narocilnica.model.options[1]=new Option("model 1a","model1a");
      document.narocilnica.model.options[2]=new Option("model 1b","model1b");
      document.narocilnica.model.options[3]=new Option("model 1c","model1c");
      document.narocilnica.model.options[4]=new Option("model 1d","model1d");
      document.narocilnica.model.options[5]=new Option("model 1e","model1e");
    break;
    case "znamka2" :
      document.narocilnica.model.options[0]=new Option("--Izberite model--","");
      document.narocilnica.model.options[1]=new Option("model 2a","model2a");
      document.narocilnica.model.options[2]=new Option("model 2b","model2b");
      document.narocilnica.model.options[3]=new Option("model 2c","model2c");
      document.narocilnica.model.options[4]=new Option("model 2d","model2d");
      document.narocilnica.model.options[5]=new Option("model 2e","model2e");
    break;
    case "znamka3" :
      document.narocilnica.model.options[0]=new Option("--Izberite model--","");
      document.narocilnica.model.options[1]=new Option("model 3a","model3a");
      document.narocilnica.model.options[2]=new Option("model 3b","model3b");
      document.narocilnica.model.options[3]=new Option("model 3c","model3c");
      document.narocilnica.model.options[4]=new Option("model 3d","model3d");
      document.narocilnica.model.options[5]=new Option("model 3e","model3e");
    break;
    }
  return true;
  }
  </script>

Obrazec pa sem spremenila takole:

  <form name="narocilnica" method="post" action="obrazec.php">
    Znamka tiskalnika:
    <select name="tiskalnik" onchange="javascript: dropdownlist(this.options[this.selectedIndex].value);">
      <option value="">--Izberite znamko--</option>
      <option value="znamka1">znamka 1</option>
      <option value="znamka2">znamka 2</option>
      <option value="znamka3">znamka 3</option>
    </select><br>
    Model tiskalnika:
    <script type="text/javascript" language="JavaScript">
      document.write('<select name="model"><option value="">--Izberite model--</option></select>')
    </script>
    <noscript>
      <select name="model" id="model" ><option value="">Vnesite model tiskalnika.</option></select>
    </noscript>
    <br/>
    Željeni artikel: <select name="artikel" id="artikel" required aria-required="true">...

Dela celo, hehe. Tudi pošiljanje potem.

Sedaj pa bi rada podobno še za artikel, torej na podlagi modela naštete artikle, tretja raven. Moram nov script na enak način spisat (kako točno?), in potem ponovit vajo, ali lahko to kako že prej? Ali kako naj to naredim?

Zgodovina sprememb…

spremenilo: alenkah (16. jan 2013 ob 23:07)

alenkah :: 17. jan 2013, 00:17

OK, ne uspe. Prosim za nadaljno pomoč. Kako sedaj iti korak naprej?

alenkah :: 17. jan 2013, 00:38

Pa še nekaj. Se ne da kako recimo s pomočjo php ali js določit, da se kot vrednost za "list" v moji prvi kodi pojavi spremenljivka? Tole zdaj bo povsem napačno, vem, ampak upam, da bom s tem nakazala, kaj me zanima, ker se bojim, da sicer ne znam razložiti:

    Znamka tiskalnika:
    <select name="tiskalnik" id="tiskalnik">
      <option value="">--Izberite znamko--</option>
      <option value="znamka1">znamka 1</option>
      <option value="znamka2">znamka 2</option>
      <option value="znamka3">znamka 3</option>
    </select><br>
<?php $tiskalnik = $_POST['tiskalnik'];?>
    Model tiskalnika:
    <input type="text" name="model" id="model" list="<?php echo $tiskalnik; ?>">
      <datalist id="znamka1">
        <option value="model1a">model 1a</option>
        <option value="model1b">model 1b</option>
        <option value="model1c">model 1c</option>
      </datalist>
      <datalist id="znamka2">
        <option value="model2a">model 2a</option>
        <option value="model2b">model 2b</option>
        <option value="model2c">model 2c</option>
      </datalist>
      <datalist id="znamka3">
        <option value="model3a">model 3a</option>
        <option value="model3b">model 3b</option>
        <option value="model3c">model 3c</option>
      </datalist>
    <br/>

carota :: 17. jan 2013, 10:28

Za tisto zroraj naredi novo funkcijo še za drugi select, ti bo najlažje.

BTW, kateri Doctype uporabljaš, da ima script tag atribut "language", HTML 3?

Zgodovina sprememb…

spremenil: carota (17. jan 2013 ob 10:36)

carota :: 17. jan 2013, 10:39

Za to drugo pa uporabi jQuery knjižnico tako, da vključiš v Head:

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.9/jquery.min.js"></script>

Potem pa nekaj takega bi ti moralo za znamka1 nastaviti vrednost:

$(document).ready(function() {
    $("#znamka1").val('<?php echo $tiskalnik; ?>');
});

alenkah :: 17. jan 2013, 13:38

Hehe :D Ma ne :D Ne boš verjel, glede na to, da pojma nisem imela, kako zadevo rešit, sploh nisem ničesar drugega spreminjala, to je bilo iz tistega primera, ki sem ga spreminjala, in je bil res tako star - čakaj, najprej moram sploh ugotovit, kaj in kako, potem pa bom vse lepo spisala in prečistila. Bom nalimala potem , kako bo :D ne se režat zdaj :D okej? :D

Pa da grem na rešitve:
Drugi ni več select, ker je fora ravno v tem, da so različni listi in se uporabi pravilen glede na izbrano opcijo v prvem koraku. Select se uporabi za izbiro znamke tiskalnika, potem za izbiro modela pa script, in zato ne znam naprej. Razumem, da lahko v glavi spišem drugo funkcijo na isti način, ni panike. Ne vem pa, kako jo klicati potem v obrazcu. V prvem primeru jo z "onchange" pri select. Kako pa v drugem, ko imam script?

Kar pa se drugega dela odgovora tiče: ampak če jaz želim, da vedno vpiše tisto, kar je izbrano v prvem koraku, ne fiksno vrednost? Kako potem? Se ne bi dalo s tem?

carota :: 17. jan 2013, 14:11

alenkah je 17. jan 2013 ob 13:38 izjavil:

Drugi ni več select, ker je fora ravno v tem, da so različni listi in se uporabi pravilen glede na izbrano opcijo v prvem koraku. Select se uporabi za izbiro znamke tiskalnika, potem za izbiro modela pa script, in zato ne znam naprej. Razumem, da lahko v glavi spišem drugo funkcijo na isti način, ni panike. Ne vem pa, kako jo klicati potem v obrazcu. V prvem primeru jo z "onchange" pri select. Kako pa v drugem, ko imam script?

Kar pa se drugega dela odgovora tiče: ampak če jaz želim, da vedno vpiše tisto, kar je izbrano v prvem koraku, ne fiksno vrednost? Kako potem? Se ne bi dalo s tem?

Nisem prepričan, da razumem kako naj bi forma delovala (ta tretji nivo). Osebno bi mi pomagalo, če bi videl formo kako izgleda in bi si tako lažje predstavljal.

Drugi del:
Sem narobe razumel, sorry. Ti želiš takoj, ko izbereš tiskalnik napolniti tisti textbox. Na koncu funkcije, ki jo kličeš onchange v dropdown-u tiskalnik, lahko daš sledeče (to uporablja jQuery knjižnico):

var tiskalnik;
tiskalnik = $('#tiskalnik option:selected').text();
$('#model').val(tiskalnik);

alenkah :: 17. jan 2013, 14:27

tule je forma: http://flamengo-andraz.tk/PI/Form.html

Torej, ko nekdo izbere znamko, se mu pojavijo samo modeli te znamke. To zdaj dela, bp. Naslednji korak je, da ko izbere še model, se mu pojavijo le artikli za tisti model. To pa (še, zapišem upajoč) ne dela. Namreč, funkcija bi, če prav razumem, morala biti zgrajena na enak način. Ne vem pa, kako naj jo kličem. Za prvi korak je to

function izbiraModela(listindex)
  {
  document.narocilnica.model.options.length = 0;
  switch (listindex)
    {
    case "znamka1" :
      document.narocilnica.model.options[0]=new Option("--Izberite model--","");
      document.narocilnica.model.options[1]=new Option("model 1a","model1a");
      document.narocilnica.model.options[2]=new Option("model 1b","model1b");
      document.narocilnica.model.options[3]=new Option("model 1c","model1c");
      document.narocilnica.model.options[4]=new Option("model 1d","model1d");
      document.narocilnica.model.options[5]=new Option("model 1e","model1e");
    break;
    case "znamka2" :
      document.narocilnica.model.options[0]=new Option("--Izberite model--","");
      document.narocilnica.model.options[1]=new Option("model 2a","model2a");
      document.narocilnica.model.options[2]=new Option("model 2b","model2b");
      document.narocilnica.model.options[3]=new Option("model 2c","model2c");
      document.narocilnica.model.options[4]=new Option("model 2d","model2d");
      document.narocilnica.model.options[5]=new Option("model 2e","model2e");
    break;
    case "znamka3" :
      document.narocilnica.model.options[0]=new Option("--Izberite model--","");
      document.narocilnica.model.options[1]=new Option("model 3a","model3a");
      document.narocilnica.model.options[2]=new Option("model 3b","model3b");
      document.narocilnica.model.options[3]=new Option("model 3c","model3c");
      document.narocilnica.model.options[4]=new Option("model 3d","model3d");
      document.narocilnica.model.options[5]=new Option("model 3e","model3e");
    break;
    }
  return true;
  }

kličem pa jo tule

    <select name="tiskalnik" onchange="javascript: izbiraModela(this.options[this.selectedIndex].value);">
      <option value="">--Izberite znamko--</option>
      <option value="znamka1">znamka 1</option>
      <option value="znamka2">znamka 2</option>
      <option value="znamka3">znamka 3</option>
    </select>

V drugem koraku bi bila torej

  function izbiraArtikla(listindex)
  {
  document.narocilnica.artikel.options.length = 0;
  switch (listindex)
    {
    case "model 1a" :
      document.narocilnica.artikel.options[0]=new Option("--Izberite artikel--","");
      document.narocilnica.artikel.options[1]=new Option("artikel 1a i","artikel1ai");
      document.narocilnica.artikel.options[2]=new Option("artikel 1a ii","artikel1aii");
      document.narocilnica.artikel.options[3]=new Option("artikel 1a iii","artikel1aiii");
      document.narocilnica.artikel.options[4]=new Option("artikel 1a iv","artikel1aiv");
      document.narocilnica.artikel.options[5]=new Option("artikel 1a v","artikel1av");
    break;
    case "model 1b" :
      document.narocilnica.artikel.options[0]=new Option("--Izberite artikel--","");
      document.narocilnica.artikel.options[1]=new Option("artikel 1b i","artikel1bi");
      document.narocilnica.artikel.options[2]=new Option("artikel 1b ii","artikel1bii");
      document.narocilnica.artikel.options[3]=new Option("artikel 1b iii","artikel1biii");
      document.narocilnica.artikel.options[4]=new Option("artikel 1b iv","artikel1biv");
      document.narocilnica.artikel.options[5]=new Option("artikel 1b v","artikel1bv");
    break;
    case "model 1c" :
      document.narocilnica.artikel.options[0]=new Option("--Izberite artikel--","");
      document.narocilnica.artikel.options[1]=new Option("artikel 1c i","artikel1ci");
      document.narocilnica.artikel.options[2]=new Option("artikel 1c ii","artikel1cii");
      document.narocilnica.artikel.options[3]=new Option("artikel 1c iii","artikel1ciii");
      document.narocilnica.artikel.options[4]=new Option("artikel 1c iv","artikel1civ");
      document.narocilnica.artikel.options[5]=new Option("artikel 1c v","artikel1cv");
    break;
    }
  return true;
  }

,

nimam pa pojma, kako jo klicat... ker v drugem koraku ne gre za select, ampak

    Model tiskalnika:
    <script>
      document.write('<select name="model"><option value="">--Izberite model--</option></select>');
    </script>

Upam, da sem sedaj kaj bolj razumljiva...

carota :: 17. jan 2013, 15:13

Sedaj je bolj razumljivo. Moj sledeč predlog ti ne bo všeč.

Začni znova.

Jaz bi naredil tako:
Privzemam, da je podatkov malo in imaš lahko vse hardcodane.
Vse selecte bi imel napisane v HTML-ju za razliko od "document.write('select ...", ki jih imaš ti. V JavaScript-u bi si naredil en večdimenzinalni array z vsemi podatki (tiskalnik, model, artikel). Še vedno v JavaScript-u; naredil bi funkcije za nafilat vsak Select, s tem da imata Model in Artikel vhodni parameter, ki filtrira samo izbrane optione. V zanki bi šel skozi array in izpisal ustrezne optione. V funkcijo $(document).ready(function() {}); bi dal klic za filanje Selecta Tiskalnik, na Select Tiskalnik bi dal onchange, ki kliče funkcijo za filanje Modela, na Select Model pa onchange klic funkcije za filanje Artikla.

Če bi bilo potatkov veliko, bi v PHP-ju nafilal le array s Tiskalniki, ostali dve, ki filata Model in Artikel, pa bi z AJAX-om napolnil.

Izi, ne? :)

alenkah :: 17. jan 2013, 15:20

ne, ni izi :))

in imaš prav, ni mi pretirano všeč :))

ampak ok, hvala. život je takav... bom skušala.

o boh. podatkov trenutno ni veliko, ker pač šele delam, in sem jih samo za test navedla nekaj (zato nimajo tudi ne smisla), ampak obrazec bo moral omogočati precej možnosti!

si bom vzela en teden, da bom poskušala dojet tvoj predlog, ker trenutno vidim ene pismenke, ki mi ne pomenijo veliko ;((

Razumem, kaj si predlagal, samo realizacija mi (še!) ni jasna. Hvala!

Mipe :: 17. jan 2013, 15:26

Ma, uporabi no že jquery, točno takim primerom je namenjen.

win64 :: 17. jan 2013, 15:30

<select name="tiskalnik" id="tiskalnik" <strong>onchange="javascript:document.getElementById('model').list=document.getElementsByName('tiskalnik')[0].value;"</strong>

Mipe :: 17. jan 2013, 15:38

@win64:

win64 :: 17. jan 2013, 15:48

Hotel sem samo poudrariti kje se skriva rešitev, strong je ostal noter ko sem označil da je koda.

<select name="tiskalnik" id="tiskalnik" onchange="javascript:document.getElementById('model').list=document.getElementsByName('tiskalnik')[0].value;">
</select>

carota :: 17. jan 2013, 16:09

@win64: po moje pa to ni rešitev. Rešitev je naredit kot je treba. Nisi videl source-a, ne?

alenkah :: 17. jan 2013, 21:27

carota, mi lahko nekaj pojasniš? kar si svetoval glede jquery, to je za primer, da vpiše v vrednost id="" tisto, kar je izbrano korak prej, ali prav razumem? pa se da tako, da to zapiše v vrednost list=""?

Oziroma, če mi lahko tole bolj podrobno razložiš, kako bi se dalo na ta način.

keworkian :: 17. jan 2013, 23:23

Tole je za jQuery.

PS. če ste že napisal rešitev se opravičujem.

<form method="post" action="obrazec.php">
    Znamka tiskalnika:
    <select name="tiskalnik">
      <option value="znamka1">znamka 1</option>
      <option value="znamka2">znamka 2</option>
      <option value="znamka3">znamka 3</option>
    </select><br>
    Model tiskalnika:
    <input type="text" name="model" list="znamka1" id="model">
    <datalist id="znamka1">
      <option value="model1">model 1</option>
      <option value="model2">model 2</option>
      <option value="model3">model 3</option>
      <option value="model4">model 4</option>
      <option value="model5">model 4</option>
    </datalist>
    <datalist id="znamka2">
      <option value="model1">model 1</option>
      <option value="model2">model 2</option>
      <option value="model3">model 3</option>
      <option value="model4">model 4</option>
      <option value="model5">model 4</option>
    </datalist>
    <datalist id="znamka3">
      <option value="model1">model 1</option>
      <option value="model2">model 2</option>
      <option value="model3">model 3</option>
      <option value="model4">model 4</option>
      <option value="model5">model 4</option>
    </datalist>
</form>
<script>
	$('select[name=tiskalnik]').change(function(){
		$('#model').attr('list', $(this).find(':selected').val());
	});
</script>

Obscenities in B-Flat

Zgodovina sprememb…

spremenil: keworkian (17. jan 2013 ob 23:31)

alenkah :: 18. jan 2013, 11:35

keworkian, hvala, a ne deluje.

keworkian :: 18. jan 2013, 11:43

A si dala jquery v

<head></head>

Obscenities in B-Flat

alenkah :: 18. jan 2013, 11:57

sem

keworkian :: 18. jan 2013, 12:45

Sprobano na Opera 12.12, najnovešji Chrome, Firefox.

<!DOCTYPE html>
<!DOCTYPE html>
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>

</head>
<body>
<form method="post" action="obrazec.php">
    Znamka tiskalnika:
    <select name="tiskalnik" id="tiskalnik">
      <option value="znamka1">znamka 1</option>
      <option value="znamka2">znamka 2</option>
      <option value="znamka3">znamka 3</option>
    </select><br>
    Model tiskalnika:
    <input type="text" name="model" list="znamka1" id="model">
    <datalist id="znamka1">
      <option value="model1">model 1</option>
      <option value="model2">model 2</option>
      <option value="model3">model 3</option>
      <option value="model4">model 4</option>
      <option value="model5">model 4</option>
    </datalist>
    <datalist id="znamka2">
      <option value="model11">model 11</option>
      <option value="model12">model 12</option>
      <option value="model13">model 33</option>
      <option value="model14">model 44</option>
      <option value="model15">model 24</option>
    </datalist>
    <datalist id="znamka3">
      <option value="model221">model 2131</option>
      <option value="model222">model 1232</option>
      <option value="model223">model 23213</option>
      <option value="model224">model231 4</option>
      <option value="model225">model 213214</option>
    </datalist>
</form>
<script>
	$('select[name=tiskalnik]').change(function(){
		$('#model').attr('list', $(this).find(':selected').val());
	});
</script>
</body></html>

Obscenities in B-Flat

Zgodovina sprememb…

spremenil: keworkian (18. jan 2013 ob 12:46)

alenkah :: 18. jan 2013, 12:56

hm... morda sem se kje kaj zatipkala? bom še enkrat poskusila, pa sporočim

ne vem... sem poskusila, skopirala relevantni del neposredno, pa mi vedno vrže le modele za znamko 1, tudi, če izberem znamko 2. si prepričan, da tebi pa upošteva izbire?

bom še iskala napake. očitno sem jo nekje naredila, ker pri meni ne dela.

Zgodovina sprememb…

spremenilo: alenkah (18. jan 2013 ob 13:00)

Looooooka :: 18. jan 2013, 13:22

<html>
<head>
 <script src="http://ajax.aspnetcdn.com/ajax/jQuery/jquery-1.9.0.min.js"></script>
</head>
<body>
<script>
$(document).ready(function() {
   $('select[name=tiskalnik]').change(function(){
        $('#model').attr('list', $(this).find(':selected').val());
    });

});
</script>
<form method="post" action="obrazec.php">
    Znamka tiskalnika:
    <select name="tiskalnik" id="tiskalnik">
      <option value="znamka1">znamka 1</option>
      <option value="znamka2">znamka 2</option>
      <option value="znamka3">znamka 3</option>
    </select><br>
    Model tiskalnika:
    <input type="text" name="model" list="znamka2" id="model">
    <datalist id="znamka1">
      <option value="model1">model 1</option>
      <option value="model2">model 2</option>
      <option value="model3">model 3</option>
      <option value="model4">model 4</option>
      <option value="model5">model 4</option>
    </datalist>
    <datalist id="znamka2">
      <option value="model11">model 11</option>
      <option value="model12">model 12</option>
      <option value="model13">model 33</option>
      <option value="model14">model 44</option>
      <option value="model15">model 24</option>
    </datalist>
    <datalist id="znamka3">
      <option value="model221">model 2131</option>
      <option value="model222">model 1232</option>
      <option value="model223">model 23213</option>
      <option value="model224">model231 4</option>
      <option value="model225">model 213214</option>
    </datalist>
</form>

</body></html>

oz po domace...vse bind komande iz jqueryja zavij v $(document).ready(function() { _lalalal_ }

Zgodovina sprememb…

spremenilo: Looooooka (18. jan 2013 ob 13:23)

alenkah :: 18. jan 2013, 15:38

grrrr, mislim, da sem našla napako - na strani strežnika

se opravičujem...

alenkah :: 18. jan 2013, 15:58

se res opravičujem, keworkian, ker nisem pomislila, da je napaka na strani strežnika. ko sem poskusila na drugem, deluje, najlepša hvala, in hvala tudi ostalim za pomoč.

še vedno pa mi ne uspe tudi za drug nivo. poskusila sem nekaj sprememb v enakem scriptu, kot je za prvi korak, vendar ne delujejo (pa jih zaradi lastnega ega raje ne bom lepila sem, ker verjamem, da sem poskušala čisto narobe... ups). mi lahko pomagate še pri tem? torej...

<form name="narocilnica" method="post" action="obrazec.php">
    Znamka tiskalnika:
    <select name="tiskalnik" id="tiskalnik">
      <option value="">--Izberite znamko--</option>
      <option value="znamka1">znamka 1</option>
      <option value="znamka2">znamka 2</option>
      <option value="znamka3">znamka 3</option>
    </select><br>
    Model tiskalnika:
    <input type="text" name="model" id="model" list="znamka1">
      <datalist id="znamka1">
        <option value="">--Izberite znamko--</option>
        <option value="model1a">model 1a</option>
        <option value="model1b">model 1b</option>
        <option value="model1c">model 1c</option>
      </datalist>
      <datalist id="znamka2">
        <option value="">--Izberite znamko--</option>
        <option value="model2a">model 2a</option>
        <option value="model2b">model 2b</option>
        <option value="model2c">model 2c</option>
      </datalist>
      <datalist id="znamka3">
        <option value="">--Izberite znamko--</option>
        <option value="model3a">model 3a</option>
        <option value="model3b">model 3b</option>
        <option value="model3c">model 3c</option>
      </datalist>
    <br/>
    Željeni artikel:
    <input type="text" name="artikel" id="artikel" list="model1a">
      <datalist id="model1a">
        <option value="artikel1a1">artikel 1a prvi</option>
        <option value="artikel1a2">artikel 1a drugi</option>
      </datalist>
      <datalist id="model1b">
        <option value="artikel1b1">artikel 1b prvi</option>
        <option value="artikel1b2">artikel 1b drugi</option>
      </datalist>
      <datalist id="model1c">
        <option value="artikel1c1">artikel 1c prvi</option>
        <option value="artikel1c2">artikel 1c drugi</option>
      </datalist>
      <datalist id="model2a">
        <option value="artikel2a1">artikel 2a prvi</option>
        <option value="artikel2a2">artikel 2a drugi</option>
      </datalist>
      <datalist id="model2b">
        <option value="artikel2b1">artikel 2b prvi</option>
        <option value="artikel2b2">artikel 2b drugi</option>
      </datalist>
      <datalist id="model2c">
        <option value="artikel2c1">artikel 2c prvi</option>
        <option value="artikel2c2">artikel 2c drugi</option>
      </datalist>
      <datalist id="model3a">
        <option value="artikel3a1">artikel 3a prvi</option>
        <option value="artikel3a2">artikel 3a drugi</option>
      </datalist>
      <datalist id="model3b">
        <option value="artikel3b1">artikel 3b prvi</option>
        <option value="artikel3b2">artikel 3b drugi</option>
      </datalist>
      <datalist id="model3c">
        <option value="artikel3c1">artikel 3c prvi</option>
        <option value="artikel3c2">artikel 3c drugi</option>
      </datalist>
  </form>
  <script>
      $('select[name=tiskalnik]').change(function(){
          $('#model').attr('list', $(this).find(':selected').val());
      });
  </script>

predvidevam, da moram še en prvemu zelo podoben script, samo z drugimi vrednostmi, ampak očitno sem delala narobe - ali pa predvidevam narobe.

ko izberem znamko, mi pravilno ponudi modele samo te znamke, zdaj pa bi rada še, da mi ob izbiri modela ponudi še artikle le tega modela.

Zgodovina sprememb…

spremenilo: alenkah (18. jan 2013 ob 16:04)

alenkah :: 18. jan 2013, 18:48

ok, mislim, da se mi je posrečilo.

tole je koda za drugi korak:

  <script>
      $('input[name=model]').change(function(){
          $('#artikel').attr('list', $(this).val());
      });
  </script>

in kolikor sem testirala, deluje.

hvala vsem!

Looooooka :: 18. jan 2013, 22:07

Tole ne bo delalo v vseh browserjih. Npr internet explorer, ker vsi browserji ne omogocajo bindanja takoj, ko se stran "nalozi".
Vseeno rajsi spremeni v:

<script>
$(document).ready(function() {
    $('input[name=model]').change(function(){
        $('#artikel').attr('list', $(this).val());
    });
});
</script>

Brez tega recimo meni vsaj v 2 browserjih ne dela(pa mam na voljo virtualke z xp-ji, 2003, 2008,2012, 7ko 8ko) in na vseh vsaj 3 razlicne browserje).

Zgodovina sprememb…

spremenilo: Looooooka (18. jan 2013 ob 22:09)

alenkah :: 18. jan 2013, 22:07

ok, hvala =)

Vredno ogleda ...

	Tema	Sporočila	Ogledi	Zadnje sporočilo
	Tema	Sporočila	Ogledi	Zadnje sporočilo
»	Nakup avta do 16000 AJETO2020 Oddelek: Na cesti	38	5116 (3696)	Scaramouche 28. jan 2020 19:09:41
»	Vrednost seat ibize l.2004 jalovec09 Oddelek: Na cesti	24	2561 (2140)	Aston_11 13. nov 2016 17:41:00
»	PHP, JS in option HTML tag Glodko Oddelek: Programiranje	9	882 (806)	hobbit 7. mar 2013 16:56:11
»	osebni avto za dostavo vsat07 Oddelek: Na cesti	39	4046 (2895)	Matako 18. nov 2012 10:10:15
»	C++ sort -> help robotek87 Oddelek: Programiranje	6	1487 (1422)	robotek87 15. maj 2005 21:39:54

Več podobnih tem

Forum » Izdelava spletišč » Spletni obrazec s pogojem

Spletni obrazec s pogojem