javascript - dropdown box, vælg ved klik - Udvikleren.dk

Tags: javascript

Bruger #12118 @ 19.11.08 14:58

Hejsa, jeg er ikke så god til det med javascript

, nu siger jeg ikke i skal lave det hele for mig, men vil gerne have lidt hjælp til at lave en drop down box hvor at når jeg udskriver alle de værdi'er jeg har i databasen i den drop down box så når man klikker på en af navnene så skal den vælge den lige med det samme og smide det over i nogen input boxe,

håber i forstår hvad jeg mener

Bruger #10647 @ 19.11.08 15:25

233

du kunne jo lave noget ligesom følgende:

HTML kode

 <!--gør noget med den valgte værdi inde i onchange. Nu printer den bare værdien af den valgte option -->
 <select onchange="alert(this.options[this.selectedIndex].value);">
 <!--print dine valgmuligheder her -->
 <option value="value1">text1</option>
 <option value="value2">text2</option>
 <option value="value3">text3</option>
 </select>

Hvis du vil have et mere klart svar må du komme med et mere klart spørgsmål

Indlæg senest redigeret d. 19.11.2008 15:26 af Bruger #10647

Bruger #11328 @ 19.11.08 16:23

1.323

Hvilket serverside sprog bruger du? PHP eller ASP.NET?

Bruger #12118 @ 19.11.08 16:56

jeg bruger php

email det den kode du har lavet gør er at den bare vælger værdi'en med det samme ik?, hvordan får jeg den til at udskrive tingene i en input box?

Bruger #3427 @ 19.11.08 18:27

1.520

Kode

<script type='text/javascript'>
function addText(text){
  document.getElementById('textboxIDher').value = text;
}
</script>

<form>
   <select onchange="addText(this.options[this.selectedIndex].value);">
      <option value="value1">text1</option>
      <option value="value2">text2</option>
      <option value="value3">text3</option>
   </select>
</form>

Indlæg senest redigeret d. 19.11.2008 18:30 af Bruger #3427

Bruger #11328 @ 19.11.08 19:54

1.323

Og fordi jeg kedede mig et eksempel der validerer:

HTML kode

 <?php
     // Connect til databasen
     mysql_connect("HOST", "USERNAME", "PASSWORD");
     mysql_select_db("DATABASE");
 ?>
 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
 <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
     <head>
         <title>Dropdown box</title>
 
         <script type="text/javascript">
             //Dropdown box kode
             function changeInput(value)
             {
                 document.getElementById("someInput").value = value;
             }
         </script>
     </head>
     <body>
         <form action="javascript:void(0);" method="get">
             <div>
                 <select onchange="javascript:changeInput(this.options[this.selectedIndex].value);">
                     <?php
                         // Få fat i alle rækker fra 'table'
                         $query = mysql_query("SELECT * FROM testtable");
                         while($row = mysql_fetch_assoc($query))
                         {
                             // Udskriv hver enkel række
                             echo "<option value='".$row['value']."'>".$row['text']."</option>";
                         }
                     ?>
                 </select>
                 <input type="text" id="someInput" />
             </div>
         </form>
     </body>
 </html>

Indlæg senest redigeret d. 19.11.2008 19:55 af Bruger #11328

Bruger #10216 @ 19.11.08 21:50

4.283

Så keder vi os endnu mere og laver noget der er overskueligt...

HTML kode

 <?php
     // Connect til databasen
     mysql_connect("HOST", "USERNAME", "PASSWORD");
     mysql_select_db("DATABASE");
     
     // Få fat i alle rækker fra 'table'
     $query = mysql_query("SELECT * FROM testtable");
     while($row = mysql_fetch_assoc($query)) {
         $list[] = $row;
     }
 ?>
 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
 <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
     <head>
         <title>Dropdown box</title>
         <script type="text/javascript">
             //Dropdown box kode
             function changeInput(value) {
                 document.getElementById("someInput").value = value;
             }
             window.onload = function() {
                 document.getElementById('quickselect').onchange = function() {
                     changeInput(this.options[this.selectedIndex].value);
                 }
             }
         </script>
     </head>
     <body>
         <form action="javascript:void(0);" method="get">
             <div>
                 <select id="quickselect">
                     <?php foreach($list as $row): ?>
                     <option value="<?php echo $row['value']; ?>"><?php echo $row['text']; ?></option>
                     <?php endforeach; ?>
                 </select>
                 <input type="text" id="someInput" />
             </div>
         </form>
     </body>
 </html>

Bruger #11328 @ 19.11.08 23:05

1.323

Så keder vi os endnu mere og laver noget der er overskueligt...

HTML kode

 <?php
     // Connect til databasen
     mysql_connect("HOST", "USERNAME", "PASSWORD");
     mysql_select_db("DATABASE");
     
     // Få fat i alle rækker fra 'table'
     $query = mysql_query("SELECT * FROM testtable");
     while($row = mysql_fetch_assoc($query)) {
         $list[] = $row;
     }
 ?>
 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
 <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
     <head>
         <title>Dropdown box</title>
         <script type="text/javascript">
             //Dropdown box kode
             function changeInput(value) {
                 document.getElementById("someInput").value = value;
             }
             window.onload = function() {
                 document.getElementById('quickselect').onchange = function() {
                     changeInput(this.options[this.selectedIndex].value);
                 }
             }
         </script>
     </head>
     <body>
         <form action="javascript:void(0);" method="get">
             <div>
                 <select id="quickselect">
                     <?php foreach($list as $row): ?>
                     <option value="<?php echo $row['value']; ?>"><?php echo $row['text']; ?></option>
                     <?php endforeach; ?>
                 </select>
                 <input type="text" id="someInput" />
             </div>
         </form>
     </body>
 </html>

Har læst at det er en "dårlig idé" at bruge window.onload, da den ikke er særlig kompatibel og først begynder eksekvering når hele sitet er loadet fuldt ud. Hvilket kan være en gene for større sider, eller sider med en masse billeder / eksterne ads.

Bruger #12118 @ 20.11.08 15:43

Tusind tak fordi i har gidet at bruge tid på mig

.

det virker fint nok, men da det er til et admin system hvor jeg skal kunne rette det information som der kommer ud har jeg 4 ting som skal rettes, og kan ikke helt se hvordan det skal laves

,

for hvad jeg lige kan se så udskriver den det i denne her

<input type="text" id="someInput" />

og jeg kan da ikke bare lave flere af samme slags?, det virker nemlig tilfældigt hvordan den udskriver tingene, ville gerne have at det så lidt ala sån her ud

[Drop down box]

Navn:
Input box hvor den udskriver navnet på det navn man har valgt i drop down boxen

kode:
Textareana hvor den udskriver koden på det navn man har valgt i drop down boxen

beskrivelse:
Textareana hvor den udskriver beskrivelsen på det navn man har valgt i drop down boxen

kode_type:
drop down box hvor den udskriver kode typen på det navn man har valgt i drop down boxen

håber i forstår

dropdown box, vælg ved klik

Karma barometer (30 dage)

Modtaget

Givet

Favorit hos
Forum tråde
Artikler