[JS] script maakt van een variabele een 'x'

[Theske]

Ik heb twee selectboxen gemaakt waarmee je de waardes uit de linker selectbox naar de rechter kunt sturen. De waardes uit de rechterbox kunnen hierna ook weer verwijderd worden.
Nu wil ik alle waardes in de rechterbox in een variabele stoppen en dat wil ik doen met hetvolgende script:::

JavaScript:

function updateField(){
  var medewerkers = document.getElementById('medewerkers');
  var FLOutput = document.getElementById('FLOutput');
  var tmp = '';
  for (var i = 0; i<=(FLOutput.length-1); i++) {
    tmp += FLOutput.options[i].value + ';';
  }
  medewerkers.value = tmp;
  }

Dit script doet in principe z'n werk, maarrrrr ipv dat hij de juiste waarde neemt (bijv. Piet Puk) neemt hij als waarde 'x'. Dit doet hij echter alleen met de waardes die op dat moment van de linker box naar de rechter zijn gehaald. De waardes die er al in stonden (gehaald uit de database) die geeft hij wel weer zoals het zou moeten.
Van beide boxen zijn de option values precies hetzelfde, dus daar kan het niet aan liggen neem ik aan.

PHP:

echo "<option value='".$Projectleden."'>".$Projectleden."</option>";

En met de volgende code haal ik de waarde van de linker box naar de rechter:

JavaScript:

function addToList(listField, newText, newValue) {
   if ( newText == "" ) {
      alert("Selecteer alstublieft een waarde");
   } else {
      var len = listField.length++; // Increase the size of list and return the size
      listField.options[len].value = newValue;
      listField.options[len].text = newText;
      listField.selectedIndex = len; // Highlight the one just entered (shows the user that it was entered)
   } // Ends the check to see if the value entered on the form is empty

}

Ik neem aan dat dit alle code die er verder aan te pas komt, en ik hoop dat jullie mij kunnen helpen met waarom hij een 'x' neerzet ipv de juiste waarde.
Momenteel komt het er dus zo uit als 1 variabele:
Piet Puk;x;x;
ipv
Piet Puk;Klaas Vink;Andre Gevel;

[crisp]

Opties maak je normaliter aan met new Option() of dmv de DOM methods createElement en appendChild.
Verder moet je denk ik de listField.options.length hebben en niet de listField.length (idem in updateField()) en hoef je die niet te incrementen aangezien de offset 0-based is.

[ Voor 14% gewijzigd door crisp op 31-10-2005 08:57 ]

[JKVA]

Beetje offtopic, maar naar mijn idee hou je er een rare manier van for schrijven op na:

Persoonlijk zou ik het herschrijven als for(var i = 0; i<length; i++)
Dat is iets sneller en je ziet meteen dat je door een array o.i.d. heenloopt.

Over je probleem, wat zijn de waarden van de parameters?

[Theske]

Ah oke, dat is dan weer een leer voor de volgende keer ;-)
Ik ben verder nog niet zover met javascript.
Maar verder is mijn probleem hier nog niet mee opgelost Weet iemand misschien hoe ik dat kan oplossen?

[JKVA]

JKVA schreef op maandag 31 oktober 2005 @ 09:01:

Over je probleem, wat zijn de waarden van de parameters?

[Theske]

JKVA schreef op maandag 31 oktober 2005 @ 10:18:
[...]

Okej, sorry
Bedoel je dus eigenlijk de waardes van de 'options' in mn selectbox??
Dat is eigenlijk wat ik ook al aangaf:

PHP:

<?
echo "<option value='".$Projectleden."'>".$Projectleden."</option>";
?>

Deze worden dus gewoon ge'echoot in m'n selectboxen en dat is ook wat ik uiteindelijk in mijn variabele wil terug vinden....

Of zit ik nou over iets heel anders te lullen dan dat wat jij wilde weten?? Zou je dan iets beter kunnen aangeven welke parameters je bedoelt ofsow? :-$

[faabman]

Volgens mij bedoelt JKVA de parameters van je javascript functie... het lijkt er op dat je het value attribute van je optie de waarde X meegeeft...

[Theske]

Nou, nog een gokje dan wat betreft de parameters

Alle gegevens haalt hij uit deze selectbox met de betreffende waardes....

PHP:

          <select name="listField" id="FLoutput" size="5" multiple="mutiple" ondblclick="removeFromList(document.getElementById('FLoutput'))" style= "width: 170px;" >
          <?
        $qryProjL= "SELECT * FROM projectleden WHERE [Project-Id] = ".$Project_id;
                                            
        if( $resProjL = odbc_exec($conn, $qryProjL) )
        {
          while ($obj = odbc_fetch_array($resProjL))
          { 
        //  echo '<pre>'.print_r($obj, 1).'</pre>';
          $Afkorting = $obj['Afkorting'] ;
        //  echo "$Afkorting ";
            if ($obj['Afkorting'] == "") 
                {
                $Projectleden = $obj['Volledigenaam'];
                }
            else
                {
                    $db1 = "C:\Inetpub\wwwroot\Projectdb\MainDB.mdb";
                    $conn1 = odbc_connect('DRIVER={Microsoft Access Driver (*.mdb)}; DBQ='.$db1, '', '');
                    $qryProjL1= "SELECT * FROM medewerker WHERE afkorting = '".$Afkorting."'";
                    $resProjL1 = odbc_exec($conn1, $qryProjL1);
                    while($obj1 = odbc_fetch_array($resProjL1))
                     {
                        $Projectleden = "$obj1[roepnaam] $obj1[tussenvoegsels] $obj1[naam]";
                     }
                }
             echo "<option value='".$Projectleden."'>".$Projectleden."</option>";
           }
        } 
        ?>
          </select> 

en nu hopen dat jullie me hiermee verder kunnen helpen....

[crisp]

[rml]crisp in "[ JS] script maakt van een variabele een ..."[/rml] --> al naar gekeken?

[Theske]

Ja, daar had ik al wel naar gekeken en had die listField.length ook aangepast.. Ik neem aan dat je bedoelde FLOutput.length in FLOutput.option.length bij mijn updateFiel() en bij addToList() listField.length in listField.option.length.

En zoals ik ook al aangaf ben ik geen ster in JS, dus het aanmaken van een optie op de manier zoals jij bedoelt... zou je me daar mee kunnen helpen dan als je denkt dat dat de oplossing is..??

Wat ik momenteel als benodigde functies heb:::

JavaScript:

function addToList(listField, newText, newValue) {
   if ( newText == "" ) {
      alert("Selecteer alstublieft een waarde");
   } else {
      var len = listField.options.length++; // Increase the size of list and return the size
      listField.options[len].value = newValue;
      listField.options[len].text = newText;
      listField.selectedIndex = len; // Highlight the one just entered (shows the user that it was entered)
   } // Ends the check to see if the value entered on the form is empty

}

function updateField(){
  var medewerkers = document.getElementById('medewerkers');
  var FLOutput = document.getElementById('FLOutput');
  var tmp = '';
  for (var i = 0; i<=(FLOutput.options.length-1); i++) {
    tmp += FLOutput.options[i].value + ';';
  }
  medewerkers.value = tmp;
  }

[Verwijderd]

JavaScript:

function addToList(listField, newText, newValue) {
   if ( newText == "" ) {
      alert("Selecteer alstublieft een waarde");
   } else {
      listField.options[listField.options.length] = new Option(newText, newValue);
      listField.selectedIndex = len; // Highlight the one just entered (shows the user that it was entered)
   } // Ends the check to see if the value entered on the form is empty

}

[Theske]

Hmmmz, ook dit heeft nog niet tot succes geleid
Verder niemand nog mogelijkheden hiervoor?

[Theske]

ff een bescheiden schopje

[faabman]

Kun je laten zien waar en hoe je de functie addToList aanroept?

[Theske]

PHP:

 <select name="listField" id="FLinput" size="5" multiple="multiple" ondblclick="addToList(document.getElementById('FLoutput'),document.getElementById('FLinput').options[document.getElementById('FLinput').selectedIndex].value,'x')" style="width: 170px;">
                   <?

                    $db1 = "C:\Inetpub\wwwroot\Projectdb\MainDB.mdb";
                    $conn1 = odbc_connect('DRIVER={Microsoft Access Driver (*.mdb)}; DBQ='.$db1, '', '');
                    $qryProjL1= "SELECT * FROM medewerker";
                    $resProjL1 = odbc_exec($conn1, $qryProjL1);
                    while($obj1 = odbc_fetch_array($resProjL1))
                     {                      
                        $Projectleden = "$obj1[roepnaam] $obj1[tussenvoegsels] $obj1[naam]";
                        echo "<option value='".$Projectleden."'>".$Projectleden."</option>";                    
                     }

        ?>
               </select>
             </div></td>
         <td width="3%">
           <div align="center"><br>
               <a href="" onclick="addToList(document.getElementById('FLoutput'),document.getElementById('FLinput').options[document.getElementById('FLinput').selectedIndex].value,'x');return false;" >[img]"frm-add.gif"[/img] </a>
               <br>
               <a href="" onclick="removeFromList(document.getElementById('FLoutput'));return false;" > [img]"frm-remove.gif"[/img] </a>
           </div></td>
         <td width="67%">
          <select name="listField" id="FLoutput" size="5" multiple="mutiple" ondblclick="removeFromList(document.getElementById('FLoutput'))" style= "width: 170px;" >
          <?
        $qryProjL= "SELECT * FROM projectleden WHERE [Project-Id] = ".$Project_id;
                                            
        if( $resProjL = odbc_exec($conn, $qryProjL) )
        {
          while ($obj = odbc_fetch_array($resProjL))
          { 
        //  echo '<pre>'.print_r($obj, 1).'</pre>';
          $Afkorting = $obj['Afkorting'] ;
        //  echo "$Afkorting ";
            if ($obj['Afkorting'] == "") 
                {
                $Projectleden = $obj['Volledigenaam'];
                }
            else
                {
                    $db1 = "C:\Inetpub\wwwroot\Projectdb\MainDB.mdb";
                    $conn1 = odbc_connect('DRIVER={Microsoft Access Driver (*.mdb)}; DBQ='.$db1, '', '');
                    $qryProjL1= "SELECT * FROM medewerker WHERE afkorting = '".$Afkorting."'";
                    $resProjL1 = odbc_exec($conn1, $qryProjL1);
                    while($obj1 = odbc_fetch_array($resProjL1))
                     {
                        $Projectleden = "$obj1[roepnaam] $obj1[tussenvoegsels] $obj1[naam]";
                     }
                }
             echo "<option value='".$Projectleden."'>".$Projectleden."</option>";
           }
        } 
        ?>
          </select>        
          <input type="hidden" name="medewerkers" id="medewerkers" value="" />  

[faabman]

Kijk en dan is het probleem zo opgelost

JavaScript:

addToList(document.getElementById('FLoutput'),document.getElementById('FLinput').options[document.getElementById('FLinput').selectedIndex].value,'x');

Doordat je bij de bovenstaande functieaanroep als laatste parameter een X opgeeft krijgen nieuw toegevoegde opties een value X...

Je kunt de X beter vervangen door

JavaScript:

document.getElementById('FLinput').options[document.getElementById('FLinput').selectedIndex].value

(en misschien is het zinvol om in de tweede parameter van je functie niet de value van de optie, maar de text van de optie mee te sturen )

[Theske]

Hij werkt eindelijk!!! Bedankt heeeeeee
Whoohoooo

faabman schreef op dinsdag 01 november 2005 @ 14:05:
(en misschien is het zinvol om in de tweede parameter van je functie niet de value van de optie, maar de text van de optie mee te sturen )

Value en text zijn precies hetzelfde, dus dan maakt het niks uit lijkt mij