Ik ben bezig met selectieboxen die aan elkaar zijn gekoppeld. Ik ben al een heel eind, maar hij werkt nog niet naar behoren.


Mijn formulier:
[php]
<?php
session_start();
include("config.inc.php");
include("functions.inc.php");
include("template.class.php");
$pagina = new Layout;
$pagina->titel_instellen("Cijfer toevoegen");
$pagina->toon_begin();
logincheck();
$id = 1;
if(isset($_POST['toevoegen'])) {
//mysql_query("INSERT INTO cijfers (`cijfer`,`weging`,`vak`) VALUES ('".$_POST[cijfer]."','".$_POST[gewicht]."','".$_POST[vak]."')");
echo "Het cijfer wordt toegevoegd...<small>voltooid</small>";
$pagina->toon_einde();
exit();
}
echo "<fieldset><legend>Cijfer toevoegen</legend><form method=\"post\">";
echo "<label for=\"cijfer\">Cijfer:</label><input type=\"text\" name=\"cijfer\" id=\"cijfer\"><br />";
echo "<label for=\"vak\">Vak:</label><select id=\"dhtmlgoodies_country\" name=\"dhtmlgoodies_country\" onchange=\"getCityList(this)\">";
$sql = "SELECT * FROM `uservakken` WHERE `uid` = ".$id."";
$res = mysql_query($sql)or die(mysql_error());
$aantal = mysql_num_rows($res);
echo $aantal;
while($ob = mysql_fetch_array($res)) {
$vakid = $ob['id'];
$haal = "SELECT * FROM `vakken` WHERE `id` = ".$vakid."";
$pak = mysql_query($haal)or die(mysql_error());
while ($binnen = mysql_fetch_array($pak)) {
$naam = $binnen['naam'];
}
echo "<option value=\"".$vakid."\">".$naam."";
}
echo "</select><br>";
echo "<label for=\"taak\">Taak:</label><select id=\"dhtmlgoodies_city\" name=\"dhtmlgoodies_city\">";
echo "</select><br>";
echo "<br><input type=\"submit\" value=\"Toevoegen\" name=\"toevoegen\">";
echo "</form></fieldset>";
$pagina->toon_einde();
?>
[/php]

getCities.php (bestand haalt de waardes voor 2e select op
[php]
<?php
header("Cache-Control: no-cache, must-revalidate");
header("Expires: Mon, 26 Jul 1997 05:00:00 GMT"); // Date in the past

include("config.inc.php");

if( isset( $_GET['countryCode'] ) ) {
$query = "SELECT
id, naam
FROM
pta
WHERE
vakid = '" .mysql_real_escape_string( $_GET['countryCode'] ). "'
ORDER BY
id DESC";
$result = mysql_query($query);
if ( $result !== false ) {
while( $rij = mysql_fetch_array($result) ) {
echo '<option value="' .$rij['id']. '">' .$rij['naam']. '</option>' .PHP_EOL;
}
}
}
?>[/php]

De ajax code



/************************************************************************************************************
Ajax chained select
Copyright (C) 2006  DTHMLGoodies.com, Alf Magne Kalleland

This library is free software; you can redistribute it and/or
modify it under the terms of the GNU Lesser General Public
License as published by the Free Software Foundation; either
version 2.1 of the License, or (at your option) any later version.

This library is distributed in the hope that it will be useful,
but WITHOUT ANY WARRANTY; without even the implied warranty of
MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the GNU
Lesser General Public License for more details.

You should have received a copy of the GNU Lesser General Public
License along with this library; if not, write to the Free Software
Foundation, Inc., 51 Franklin Street, Fifth Floor, Boston, MA  02110-1301  USA

Dhtmlgoodies.com., hereby disclaims all copyright interest in this script
written by Alf Magne Kalleland.

Alf Magne Kalleland, 2006
Owner of DHTMLgoodies.com


************************************************************************************************************/   
var ajax = new Array();

function getCityList(sel)
{
   var countryCode = sel.options[sel.selectedIndex].value;
   document.getElementById('dhtmlgoodies_city').options.length = 0;   // Empty city select box
   if(countryCode.length>0){
      var index = ajax.length;
      ajax[index] = new sack();
      
      ajax[index].requestFile = 'getCities.php?countryCode='+countryCode;   // Specifying which file to get
      ajax[index].onCompletion = function(){ createCities(index) };   // Specify function that will be executed after file has been found
      ajax[index].runAJAX();      // Execute AJAX function
   }
}

function createCities(index)
{
   var obj = document.getElementById('dhtmlgoodies_city');
   eval(ajax[index].response);   // Executing the response from Ajax as Javascript code   
}


function getSubCategoryList(sel)
{
   var category = sel.options[sel.selectedIndex].value;
   document.getElementById('dhtmlgoodies_subcategory').options.length = 0;   // Empty city select box
   if(category.length>0){
      var index = ajax.length;
      ajax[index] = new sack();
      
      ajax[index].requestFile = 'getSubCategories.php?category='+category;   // Specifying which file to get
      ajax[index].onCompletion = function(){ createSubCategories(index) };   // Specify function that will be executed after file has been found
      ajax[index].runAJAX();      // Execute AJAX function
   }
}
function createSubCategories(index)
{
   var obj = document.getElementById('dhtmlgoodies_subcategory');
   eval(ajax[index].response);   // Executing the response from Ajax as Javascript code   
}      


En dit js bestand

/* Simple AJAX Code-Kit (SACK) v1.6.1 */
/* ©2005 Gregory Wild-Smith */
/* www.twilightuniverse.com */
/* Software licenced under a modified X11 licence,
   see documentation or authors website for more details */

function sack(file) {
   this.xmlhttp = null;

   this.resetData = function() {
      this.method = "POST";
        this.queryStringSeparator = "?";
      this.argumentSeparator = "&";
      this.URLString = "";
      this.encodeURIString = true;
        this.execute = false;
        this.element = null;
      this.elementObj = null;
      this.requestFile = file;
      this.vars = new Object();
      this.responseStatus = new Array(2);
     };

   this.resetFunctions = function() {
        this.onLoading = function() { };
        this.onLoaded = function() { };
        this.onInteractive = function() { };
        this.onCompletion = function() { };
        this.onError = function() { };
      this.onFail = function() { };
   };

   this.reset = function() {
      this.resetFunctions();
      this.resetData();
   };

   this.createAJAX = function() {
      try {
         this.xmlhttp = new ActiveXObject("Msxml2.XMLHTTP");
      } catch (e1) {
         try {
            this.xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
         } catch (e2) {
            this.xmlhttp = null;
         }
      }

      if (! this.xmlhttp) {
         if (typeof XMLHttpRequest != "undefined") {
            this.xmlhttp = new XMLHttpRequest();
         } else {
            this.failed = true;
         }
      }
   };

   this.setVar = function(name, value){
      this.vars[name] = Array(value, false);
   };

   this.encVar = function(name, value, returnvars) {
      if (true == returnvars) {
         return Array(encodeURIComponent(name), encodeURIComponent(value));
      } else {
         this.vars[encodeURIComponent(name)] = Array(encodeURIComponent(value), true);
      }
   }

   this.processURLString = function(string, encode) {
      encoded = encodeURIComponent(this.argumentSeparator);
      regexp = new RegExp(this.argumentSeparator + "|" + encoded);
      varArray = string.split(regexp);
      for (i = 0; i < varArray.length; i++){
         urlVars = varArray[i].split("=");
         if (true == encode){
            this.encVar(urlVars[0], urlVars[1]);
         } else {
            this.setVar(urlVars[0], urlVars[1]);
         }
      }
   }

   this.createURLString = function(urlstring) {
      if (this.encodeURIString && this.URLString.length) {
         this.processURLString(this.URLString, true);
      }

      if (urlstring) {
         if (this.URLString.length) {
            this.URLString += this.argumentSeparator + urlstring;
         } else {
            this.URLString = urlstring;
         }
      }

      // prevents caching of URLString
      this.setVar("rndval", new Date().getTime());

      urlstringtemp = new Array();
      for (key in this.vars) {
         if (false == this.vars[key][1] && true == this.encodeURIString) {
            encoded = this.encVar(key, this.vars[key][0], true);
            delete this.vars[key];
            this.vars[encoded[0]] = Array(encoded[1], true);
            key = encoded[0];
         }

         urlstringtemp[urlstringtemp.length] = key + "=" + this.vars[key][0];
      }
      if (urlstring){
         this.URLString += this.argumentSeparator + urlstringtemp.join(this.argumentSeparator);
      } else {
         this.URLString += urlstringtemp.join(this.argumentSeparator);
      }
   }

   this.runResponse = function() {
      eval(this.response);
   }

   this.runAJAX = function(urlstring) {
      if (this.failed) {
         this.onFail();
      } else {
         this.createURLString(urlstring);
         if (this.element) {
            this.elementObj = document.getElementById(this.element);
         }
         if (this.xmlhttp) {
            var self = this;
            if (this.method == "GET") {
               totalurlstring = this.requestFile + this.queryStringSeparator + this.URLString;
               this.xmlhttp.open(this.method, totalurlstring, true);
            } else {
               this.xmlhttp.open(this.method, this.requestFile, true);
               try {
                  this.xmlhttp.setRequestHeader("Content-Type", "application/x-www-form-urlencoded")
               } catch (e) { }
            }

            this.xmlhttp.onreadystatechange = function() {
               switch (self.xmlhttp.readyState) {
                  case 1:
                     self.onLoading();
                     break;
                  case 2:
                     self.onLoaded();
                     break;
                  case 3:
                     self.onInteractive();
                     break;
                  case 4:
                     self.response = self.xmlhttp.responseText;
                     self.responseXML = self.xmlhttp.responseXML;
                     self.responseStatus[0] = self.xmlhttp.status;
                     self.responseStatus[1] = self.xmlhttp.statusText;

                     if (self.execute) {
                        self.runResponse();
                     }

                     if (self.elementObj) {
                        elemNodeName = self.elementObj.nodeName;
                        elemNodeName.toLowerCase();
                        if (elemNodeName == "input"
                        || elemNodeName == "select"
                        || elemNodeName == "option"
                        || elemNodeName == "textarea") {
                           self.elementObj.value = self.response;
                        } else {
                           self.elementObj.innerHTML = self.response;
                        }
                     }
                     if (self.responseStatus[0] == "200") {
                        self.onCompletion();
                     } else {
                        self.onError();
                     }

                     self.URLString = "";
                     break;
               }
            };

            this.xmlhttp.send(this.URLString);
         }
      }
   };

   this.reset();
   this.createAJAX();
} 


Als ik hem debug met Firebug zegt hij dit.

missing ; before statement
[Break on this error] <option value="72">Proefvertaling Week 2</option>\n

Hij haalt ze dus wel goed uit de DB, maar echoot ze nog niet goed.
Ja he, en nu moeten wij maar even die lap code door gaan spitten op zoek naar de fout? Lijkt me niet...

Probeer relevante code te posten in plaats van je complete script. Verder kunnen we met die foutmelding ook vrij weinig. Waar treedt die fout op, in op welke regel in welk bestand?

Kortom, je zult toch echt specifieker moeten zijn als je een antwoord op je vraag wilt...
Volgens mij debug zit de fout hierin:


function createCities(index)
{
var obj = document.getElementById('dhtmlgoodies_city');
eval(ajax[index].response); // Executing the response from Ajax as Javascript code
}
:'( eval das nie goed lijkt me al heb ik zo snel geen idee hoe het wel moet :P
Mijn tip: ga eerst je code eens netjes uitschrijven, en dan heb ik het vooral over je PHP code. Ga dus eens netjes inspringen, op een constante manier gebruik maken van { en } en het wat overzichtelijker proberen te krijgen.

Verder zou je ook eens controleren of de inhoud van ajax[index].response in die functie wel juist is. Grote kans dat daar een fout in staat...

Reageren