Ge input värde mha. select

8 svar · 270 visningar · startad av Steady 20 dec. 2004

SteadyMedlem sedan dec. 2004225 inlägg

Frågan20 dec. 2004 09:41#1

Hejsan!

Om vi säger att jag har en select

<select name="foo">
<option>Dell</option>
<option>Compaq</option>
osv...
</select>

När jag väljer ett alternativ i dropdownlistan så ska ett antal inputs fyllas med ett visst värde. ex för Dell.

<input type="text" name="ghz" value="2,4" />
<input type="text" name="ram" value="1024" />

Och för Compaq

<input type="text" name="ghz" value="1,3" />
<input type="text" name="ram" value="512" />

osv. Värdet som dessa inputs ska fyllas med har jag i databasen. Så jag antar att sidan måste laddas om varje gång man väljer ett nytt alternativ i dropdownlistan, detta är inga problem.

Tack på förhand

yohpopsMedlem sedan feb. 20011 198 inlägg

20 dec. 2004 09:43#2

Du kan lägga datat i en array och sen hämta datat därifrån onchange.

SteadyMedlem sedan dec. 2004225 inlägg

20 dec. 2004 09:45#3

Tänkte i samma banor men eftersom jag inte kan ett dugg javascript så frågar jag här hur jag ska gå tillväga, eller om ni har en bra guide som visar hur man ska göra. :)

yohpopsMedlem sedan feb. 20011 198 inlägg

20 dec. 2004 10:36#4

Nåt att börja med.

<script>
var arrtext = "";

function window.onload()
{
	var sel = document.getElementById("prod")
	for (var i = 0;i<10;i++)
	{
		sel.options.add(new Option(i+" Text",i));
		arrtext += i + "," + i + "|" + i*i + "," + i + "#"
	}
}
function populateTextboxes(in_val)
{
	if (in_val!=null && in_val!='')
	{
		var arr = arrtext.split("#");
		var arrarr = arr[in_val].split("|");
		document.getElementById("ghz").value=arrarr[0];
		document.getElementById("ram").value=arrarr[1];
	}
}
</script>
<select name="prod" id="prod" onchange="populateTextboxes(this.value)">
<option>Choose</option>
</select>
<br>
ghx:&nbsp;<input type="text" name="ghz" id="ghz"><br>
ram:&nbsp;<input type="text" name="ram" id="ram">

SteadyMedlem sedan dec. 2004225 inlägg

20 dec. 2004 14:40#5

Har försökt att pilla fram och tillbaka, men får inte till det.
Vet inte hur jag ska skriva för att få in databasloopen.

/red Har kommit en bit på vägen, men det vill sig inte riktigt ändå.

<?
include('config.php');

$SQL = mysql_query("SELECT * FROM computer ORDER BY ID") or die (mysql_error());
?>
<script>
var arrtext = "";

function window.onload()
{
	var sel = document.getElementById("prod")
	for (var i = 0;i<1;i++)
	{
	<?
	$i = 0;
	while($row = mysql_fetch_array($SQL)) {
	$i++;
	?>
		sel.options.add(new Option(<?=$i?>+" <?=$row['Dator']?>",<?=$i?>));
		arrtext += "<?=$row[ID]?>" + "|" + "<?=$i?>" + "|" + "test3" + "#"
	<?
	}
	?>
	}
}
function populateTextboxes(in_val)
{
	if (in_val!=null && in_val!='')
	{
		var arr = arrtext.split("#");
		var arrarr = arr[in_val].split("|");
		document.getElementById("ghz").value=arrarr[0];
		document.getElementById("ram").value=arrarr[1];
		document.getElementById("gfx").value=arrarr[2];
	}
}
</script>
<select name="prod" id="prod" onchange="populateTextboxes(this.value)">
<option>Choose</option>
</select>
<br>
V. arm: <input type="text" name="ghz" id="ghz"><br>
H. arm: <input type="text" name="ram" id="ram"><br>
H. ben: <input type="text" name="gfx" id="gfx"><br>

yohpopsMedlem sedan feb. 20011 198 inlägg

20 dec. 2004 22:02#6

Hjälpte detta?
Kan inte php vidare bra.

<?
include('config.php');

$SQL = mysql_query("SELECT * FROM computer ORDER BY ID") or die (mysql_error());
?>
<script>
var arrtext = "";

function window.onload()
{
    var sel = document.getElementById("prod")
    <?
    $i = 0;
    while($row = mysql_fetch_array($SQL)) {
    $i++;
    ?>
        sel.options.add(new Option(<?=$i?>+" <?=$row['Dator']?>",<?=$i?> ));
        arrtext += "<?=$row[ID]?>" + "|" + "<?=$i?>" + "|" + "test3" + "#"
    <?
    }
    ?>
}
function populateTextboxes(in_val)
{
    if (in_val!=null && in_val!='')
    {
        var arr = arrtext.split("#");
        var arrarr = arr[in_val].split("|");
        document.getElementById("ghz").value=arrarr[0];
        document.getElementById("ram").value=arrarr[1];
        document.getElementById("gfx").value=arrarr[2];
    }
}
</script>
<select name="prod" id="prod" onchange="populateTextboxes(this.value)">
<option>Choose</option>
</select>
<br>
V. arm: <input type="text" name="ghz" id="ghz"><br>
H. arm: <input type="text" name="ram" id="ram"><br>
H. ben: <input type="text" name="gfx" id="gfx"><br>

SteadyMedlem sedan dec. 2004225 inlägg

20 dec. 2004 22:06#7

Den sista posten (dvs gfx) blir undefined, gjorde ingen skillnad.

Peter SMedlem sedan dec. 20025 483 inlägg

21 dec. 2004 10:30#8

<script type="text/javascript">

function Comp(name, ghz, ram){
    this.name = name;
    this.ghz  = ghz;
    this.ram  = ram;
}

var comps = [
    new Comp("Dell", "2,4", 1024),
    new Comp("Compaq", "1,3", 512)
];

function showInfo(obj){
    var elms = obj.form.elements,
	comp = comps[obj.selectedIndex];

    elms["name"].value = comp.name;
    elms["ghz"].value  = comp.ghz;
    elms["ram"].value  = comp.ram;
}

</script>

<form>
    <select onchange="showInfo(this)">
	<option>Dell</option>
	<option>Compaq</option>
    </select>
    <input type="text" name="name">
    <input type="text" name="ghz">
    <input type="text" name="ram">
</form>

SteadyMedlem sedan dec. 2004225 inlägg

21 dec. 2004 21:54#9

Kanonfint! Tack båda två och God jul :)