Supportnet Computer
Planet of Tech

Supportnet / Forum / Skripte(PHP,ASP,Perl...)

daten aus javascript form auslesen





Frage

hi, habe ein java script gefunden, welches eine tabellen erzeugen ermöglicht - nur leider bekomme ich ich es nicht hin. die daten aus der rechten tabelle auszulesen- code: <html> <head> <title>Unbenanntes Dokument</title> <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"> <script language="JavaScript" TYPE="text/javascript"> <!-- function MoveUp(combo) { i=combo.selectedIndex; if (i>0) { swap(combo,i,i-1); combo.options[i-1].selected=true; combo.options[i].selected=false; } } function MoveDown(combo) { i=combo.selectedIndex; if (i<combo.length-1 && i>-1) { swap(combo,i+1,i); combo.options[i+1].selected=true; combo.options[i].selected=false; } } //this function is used to swap between elements function swap(combo,index1, index2) { var savedValue=combo.options[index1].value; var savedText=combo.options[index1].text; combo.options[index1].value=combo.options[index2].value; combo.options[index1].text=combo.options[index2].text; combo.options[index2].value=savedValue; combo.options[index2].text=savedText; } function MoveToTop(combo) { i=combo.selectedIndex; for (;i>0;i--) { swap(combo,i,i-1); combo.options[i-1].selected=true; combo.options[i].selected=false; } } function MoveToBottom(combo) { i=combo.selectedIndex; if (i>-1) { for (;i<combo.length-1;i++) { swap(combo,i+1,i); combo.options[i+1].selected=true; combo.options[i].selected=false; } } } //moves options from one selection box (combo box) to another //removes the all selected options from one combo box and adds them to the second combo box function MoveElements(FromCombo,ToCombo) { var to_remove_counter=0; //number of options that were removed (num selected options) //move selected options to right select box (to) for (var i=0;i<FromCombo.options.length;i++) { if (FromCombo.options[i].selected==true) { var addtext=FromCombo.options[i].text; var addvalue=FromCombo.options[i].value; ToCombo.options[ToCombo.options.length]=new Option(addtext,addvalue); FromCombo.options[i].selected=false; ++to_remove_counter; } else { FromCombo.options[i-to_remove_counter].selected=false; FromCombo.options[i-to_remove_counter].text=FromCombo.options[i].text; FromCombo.options[i-to_remove_counter].value=FromCombo.options[i].value; } } //now cleanup the last remaining options var numToLeave=FromCombo.options.length-to_remove_counter; for (i=FromCombo.options.length-1;i>=numToLeave;i--) { FromCombo.options[i]=null; } } function SelectAll(combo) { for (var i=0;i<combo.options.length;i++) { combo.options[i].selected=true; } } //--> </script> </head> <body> <?php echo $right_selects; echo $checkbox; ?> <form action="<?=$PHPSELF?>" method="post"> <table border=0 cellspacing=0 cellpadding=0> <tr style='font-size: .8em;'> <td valign=bottom align=left > All Elements [ <span onClick='SelectAll(left_select)' style='color:blue;cursor:hand;' onMouseOver='this.style.color="red"' onMouseOut='this.style.color="blue"'>Select All</span> ] </td> <td>  </td> <td align=left valign=bottom align=right > Selected Elements </td> <td>  </td> </tr> <tr valign=top> <td rowspan=4> <select multiple Name='left_select' size='10' TABINDEX=1 style='width:100%'> <option value="1">"1</option> <option value="2">"2</option> <option value="3">"3</option> <option value="4">"4</option> <option value="5">"5</option> </select> </td> <td rowspan=4 valign=center> <input title='Move elements to the right select box.' TABINDEX=2 onClick='MoveElements(left_select,right_select);' style='width:76;cursor:hand;' type=button value="Add>>"> <br /> <input title='Return elements to the left select box.' TABINDEX=3 onClick='MoveElements(right_select,left_select)' style='width:76;cursor:hand;' type=button value="<<Remove"> </td> <td rowspan=4> <select multiple Name='right_select' size='10' style='width:184px' TABINDEX=4 > </select> </td> <td> <input title='Move selected element to the top.' TABINDEX=5 onClick='MoveToTop(right_select)' style='width:20;height:40px;font-size:x-small;' type=button value=" /\    /\   "> </td> </tr> <tr valign=bottom> <td> <input title='Move selected element up.' TABINDEX=6 onClick='MoveUp(right_select)' style='width:20px;height:20px;font-size : x-small;' type=button value="/\"> </td> </tr> <tr valign='top'> <td> <input title='Move selected element down.' TABINDEX=7 onClick='MoveDown(right_select)' style='width:20px;height:20px;font-size : x-small;' type=button value="\/"> </td> </tr> <tr valign='bottom'> <td> <input title='Move selected element to the bottom.' TABINDEX=8 onClick='MoveToBottom(right_select)' style='width:20px;height:40px;font-size : x-small;' type=button value=" \/    \/   "> </td> </tr> </table> <input type="checkbox" name="checkbox" value="checkbox"> <input type=submit value='Submit Selected Values'> </form> </body> </html> Danke

Antwort 1 von MixMax

also da sind einige fehler drin, zum Beispiel wird eine variable right_selects ausgegeben, die existiert aber gar nicht, nichtmals als Formularfeld.
zudem wäre das rechte selectfeld ein array, keine variable und sollte daher mit join ausgegeben werden.
Die felder in der rechten seite werden nur dann beim absenden an PHP übergeben wenn alle markiert sind.
eine "value" bei einer checkbox ist überflüssig, man sollte besser prüfen ob die die Variable mitübergeben wird, also gesetzt ist.

POST und GET -Daten werden oft nicht in die gleichnamige Variable geschrieben, aus sicherheitsgründen. Nunmehr muß (oder besser gesagt sollte) man den syntax verwenden : $_POST['formelementname']

danach sieht das script etwa so aus:
<html>
<head>
<title>Unbenanntes Dokument</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<script language="JavaScript" TYPE="text/javascript">
<!--


function MoveUp(combo)
{
i=combo.selectedIndex;
if (i>0)
{
swap(combo,i,i-1);
combo.options[i-1].selected=true;
combo.options.selected=false;
}
}

function MoveDown(combo)
{
i=combo.selectedIndex;

if (i<combo.length-1 && i>-1)
{
swap(combo,i+1,i);
combo.options[i+1].selected=true;
combo.options.selected=false;
}
}

//this function is used to swap between elements
function swap(combo,index1, index2)
{
var savedValue=combo.options[index1].value;
var savedText=combo.options[index1].text;

combo.options[index1].value=combo.options[index2].value;
combo.options[index1].text=combo.options[index2].text;

combo.options[index2].value=savedValue;
combo.options[index2].text=savedText;
}

function MoveToTop(combo)
{
i=combo.selectedIndex;

for (;i>0;i--)
{
swap(combo,i,i-1);
combo.options[i-1].selected=true;
combo.options.selected=false;
}
}

function MoveToBottom(combo)
{
i=combo.selectedIndex;

if (i>-1)
{
for (;i<combo.length-1;i++)
{
swap(combo,i+1,i);
combo.options[i+1].selected=true;
combo.options.selected=false;
}
}
}

//moves options from one selection box (combo box) to another
//removes the all selected options from one combo box and
//adds them to the second combo box
function MoveElements(FromCombo,ToCombo)
{
var to_remove_counter=0;
//number of options that were removed (num selected options)

//move selected options to right select box (to)
for (var i=0;i<FromCombo.options.length;i++)
{
if (FromCombo.options.selected==true)
{
var addtext=FromCombo.options.text;
var addvalue=FromCombo.options.value;
ToCombo.options[ToCombo.options.length]=new Option(addtext,addvalue);
FromCombo.options.selected=false;
++to_remove_counter;
}
else
{
FromCombo.options[i-to_remove_counter].selected=false;
FromCombo.options[i-to_remove_counter].text=FromCombo.options.text;
FromCombo.options[i-to_remove_counter].value=FromCombo.options.value;
}
}

//now cleanup the last remaining options
var numToLeave=FromCombo.options.length-to_remove_counter;
for (i=FromCombo.options.length-1;i>=numToLeave;i--)
{
FromCombo.options=null;
}
}

function SelectAll(combo)
{
for (var i=0;i<combo.options.length;i++)
{
combo.options.selected=true;
}
}
//-->
</script>
</head>

<body>
<?php
if (isset($_POST['right_select']))
  echo join(", ", $_POST['right_select'])."<br>\n";
if (isset($_POST['checkbox']))
  echo "on";
else
  echo "off";
?>
<form action="<?= $_ENV['SCRIPT_NAME'] ?>" method="post"
onsubmit="SelectAll(right_select);
document.forms[0].right_select.name='right_select[]';">

<table border=0 cellspacing=0 cellpadding=0>
<tr style='font-size: .8em;'>
<td valign=bottom align=left >
All Elements [ <span onClick='SelectAll(left_select)'
style='color:blue;cursor:hand;' onMouseOver='this.style.color="red"'
onMouseOut='this.style.color="blue"'>Select All</span> ]
</td>
<td>

</td>
<td align=left valign=bottom align=right >
Selected Elements
</td>
<td>

</td>
</tr>
<tr valign=top>
<td rowspan=4>
<select multiple name='left_select' size='10'
TABINDEX=1 style='width:100%'>
<option value="1">"1</option>
<option value="2">"2</option>
<option value="3">"3</option>
<option value="4">"4</option>
<option value="5">"5</option>
</select>
</td>
<td rowspan=4 valign=center>
<input title='Move elements to the right select box.' TABINDEX=2
onClick='MoveElements(left_select,right_select);'
style='width:76;cursor:hand;' type=button value="Add&gt;amp;>">
<br>
<input title='Return elements to the left select box.' TABINDEX=3
onClick='MoveElements(right_select,left_select)'
style='width:76;cursor:hand;' type=button
value="&lt;&lt;Remove">
</td>
<td rowspan=4>
<select multiple name='right_select' size='10'
style='width:184px' TABINDEX=4>
</select>
</td>
<td>
<input title='Move selected element to the top.' TABINDEX=5
onClick='MoveToTop(right_select)'
style='width:20;height:40px;font-size:x-small;'
type=button value=" /\
 /\">
</td>
</tr>
<tr valign=bottom>
<td>
<input title='Move selected element up.' TABINDEX=6
onClick='MoveUp(right_select)'
style='width:20px;height:20px;font-size : x-small;'
type=button value="/\">
</td>
</tr>
<tr valign='top'>
<td>
<input title='Move selected element down.' TABINDEX=7
onClick='MoveDown(right_select)'
style='width:20px;height:20px;font-size : x-small;'
type=button value="\/">
</td>
</tr>
<tr valign='bottom'>
<td>
<input title='Move selected element to the bottom.'
TABINDEX=8
onClick='MoveToBottom(right_select)'
style='width:20px;height:40px;font-size : x-small;'
type=button value=" \/
 \/">
</td>
</tr>
</table>
<input type="checkbox" name="checkbox">
<input type=submit value='Submit Selected Values'>
</form>
</body>
</html>


Antwort 2 von quo

Hi,

und danke leider funtzt dein script nicht - es lassen sich keine einträge mehr verschieben. von links -> nach rechts.

kannst du noch mal nachschauen

danke