Div probleem: Javascript+php?

Status
Niet open voor verdere reacties.
K

Kproz

Gebruiker
Lid geworden
11 jul 2007
Berichten
138
ik heb een code in javascript:
PHP: 
<?php

 <script language="JavaScript" type="text/javascript">
      function doMenu(item) {
          obj=document.getElementById(item);
          col=document.getElementById("x" + item);
          if (obj.style.display=="none") {
              obj.style.display="block";
              col.innerHTML="<i>Hide info</i>";
         }
          else if (obj.style.display == "block"){
              obj.style.display="none";
              col.innerHTML="<i>More info</i>";
          }
     }
</script>
?>

het gaat over films, ik heb meerdere films en info opgeslagen in een database en als je dan op "more info" drukt komt er meer informatie over die film met deze code:
<?php
PHP: 
<a href="javascript:doMenu(\'main\');" id=xmain><i>More info</i></a>
?>
MAAR! omdat deze code meerdere keren aanwezig is per pagina ( er zijn meerdere films, en dus ook meerdere divisions met de naam MAIN. werkt dit niet naar behoren, als je op More info drukt bij de film die bijvoorbeeld als 6de staat in de rij word de informatie van de eerste film in de lijst zichtbaar! hoe los ik dit op
 
Je haalt het toch op uit de database? Die artikelen hebben toch id's? Dan gebruik je toch dat idee om het uniek te maken?
 
SvU zei:
Je haalt het toch op uit de database? Die artikelen hebben toch id's? Dan gebruik je toch dat idee om het uniek te maken?
Klik om te vergroten...

ja maar ik weet niet hoe ik mijn javascript moet aanpassen om het nog te laten werken, of blijft die gewoon hetzelfde? ik ken namelijk geen javascript... ik heb het stukje code ergens op internet gevonden
 
Je moet even kijken naar wat de functie aan parameters vereist.
Aan deze regels
PHP: 
obj=document.getElementById(item);
col=document.getElementById("x" + item);
zie je dat er wordt gekeken naar een id="{naam}".

Het probleem met dit script is eigenlijk dat de inhoud in het javascript wordt ingevuld. (door col.innerHTML)
Maak je daar nou een aparte div voor dan kun je gewoon de inhoud er al neer zetten maar zorgt het javascript er voor dat het wel of niet verschijnt.

Zo'n voorbeeld is in deze thread te vinden. Het is de laatste post.

Je geeft dan het unieke deel uit de database als id mee.

edit: op zich zou het zelfs mooier zijn dat je het pas uit de database haalt wanneer men de "link" aanklikt, met het XMLHttpRequest object kun je dat realiseren.
 
Laatst bewerkt:
Tha Devil zei:
edit: op zich zou het zelfs mooier zijn dat je het pas uit de database haalt wanneer men de "link" aanklikt, met het XMLHttpRequest object kun je dat realiseren.
Klik om te vergroten...


zou je me daarmee kunnen helpen ... :]
ik word uit het script van egel in ieder geval niet wijzer :/
 
Allereerst moet je even weten wat je kunt doen, dit voorbeeld heb ik op deze pagina toegepast.

Wat het script doet is aan de hand van het javascript via de GET-methode gegevens uit de database ophaalt.

Nu is in het voorbeeld en op mijn pagina gebruik gemaakt van een SELECT-box. In principe kun je de js-functie op een link toepassen.

Wat je dus nodig hebt is een afbeeld-pagina, het javascript en een pagina welke jouw gegevens ophaalt aan de hand van $_GET.

Mijn pagina is zo gemaakt:
index.php
PHP: 
<?php
include('config.php');
$counter = 0;
?>
<html>
<head>
 <title>Taken Rooster Heren 2</title>
 <script src="selectuser.js"></script>
 <style type="text/css">
  body { font-family:Verdana; }
  table { border-left: 1px solid #000000; border-right: 1px solid #000000; }
  #txtHint th { 
    border-bottom: 1px solid #000000;
    border-top: 1px solid #000000;
    font-size: 13px;
    color: #FFFFFF;
    background-color: #000000;
    text-align:left;
  }
  #txtHint td {
    font-size: 13px;
    border-bottom: 1px solid #000000;
  }
  .uit {
    background-color: #666666;
    color:#FFFFFF;
  }
  .thuis {
    background-color: #DDDDDD;
    color: #333333;
  }
  #txtHint tr:hover{color:white;background:red;}
 </style>
</head>
<body>
<form> 
Toon taken van:
<select name="users" onChange="showUser(this.value)">
 <option value="0">Iedereen</option>
<?php userList(); ?>
</select>
</form>
<div id="txtHint">
<?php
echo '<table cellpadding="0" cellspacing="0">
<tr>
 <th width="90">Datum</th>
 <th width="50">Tijd</th>
 <th width="70">Vertrek</th>
 <th width="125">Thuis</th>
 <th width="125">Uit</th>
 <th width="125">Hal</th>
 <th width="150">Rijden</th>
 <th width="150">Rijden</th>
 <th width="150">Reserve</th>
 <th width="150">Wassen</th>
</tr>';
$taakQuery = "SELECT *
              FROM wedstrijden";
$taakResult = mysql_query($taakQuery) or die(mysql_error());
while($row = mysql_fetch_array($taakResult)) {
  $datum = explode("-", $row['datum']);
  $datum = $datum[2].$datum[1].$datum[0];
  if(date("Ymd") <= $datum) {
    $stijl = ($row['thuis'] == 'Red Giants') ? 'uit' : 'thuis';
    echo '<tr class="'. $stijl .'">
           <td>'. $row['datum'] .'</td>
           <td>'. $row['tijd'] .'</td>
           <td>'. $row['vertrek'] .'</td>
           <td>'. $row['thuis'] .'</td>
           <td>'. $row['uit'] .'</td>
           <td>'. $row['hal'] .'</td>
           <td>'. getMember($row['rij1']) .'</td>
           <td>'. getMember($row['rij2']) .'</td>
           <td>'. getMember($row['rij3']) .'</td>
           <td>'. getMember($row['wassen']) .'</td>
          </tr>';
    $counter++;
  }
}
if($counter == 0) {
  echo '<tr><td colspan="11">Geen wedstrijden meer te spelen</td></tr>';
}
echo '</table></div><center>';
mysql_close($connection);
// Created by Tha Devil
// Helpmij.nl Forum
function getLine($page, $keyword, $pattern) {
  foreach ($page as $line_num => $line) {
    if(strstr($line, $keyword)){
      if(ereg($pattern, $line, $output)){
        $result = $line_num;
      }
    }
  }
  return $result;
}
// URL van de pagina die je wilt doorzoeken
$url = "http://west.basketball.nl/db/wedstrijd/stand.pl?cmp_ID=365&szn_Naam=2007-2008&LVactie=Selecteren";
// Naar welk begindeel moeten we zoeken?
$search1 = '<FONT SIZE="5"  class="msg" >';

// Naar welk einddeel moeten we zoeken?
$search2 = 'ALT="Standen verloop" >';
// Wat moeten we van die regel opnemen?
// Het patroon maakt gebruik van reguliere expressies
$pattern = '.*';


$lines = file($url);
//Wijzigen op eigen risico
$begin = getLine($lines, $search1, $pattern);
$end = getLine($lines, $search2, $pattern);

for($i=$begin; $i < $end; $i++) {
  echo $lines[$i];
}
?>
</center>
</body>
</html>
selectuser.js
Code: 
// JavaScript Document
var xmlHttp

function showUser(str)
{ 
xmlHttp=GetXmlHttpObject()
if (xmlHttp==null)
 {
 alert ("Browser does not support HTTP Request")
 return
 }
var url="getuser.php"
url=url+"?id="+str
url=url+"&sid="+Math.random()
xmlHttp.onreadystatechange=stateChanged 
xmlHttp.open("GET",url,true)
xmlHttp.send(null)
}

function stateChanged() 
{ 
if (xmlHttp.readyState==4 || xmlHttp.readyState=="complete")
 { 
 document.getElementById("txtHint").innerHTML=xmlHttp.responseText 
 } 
}

function GetXmlHttpObject()
{
var xmlHttp=null;
try
 {
 // Firefox, Opera 8.0+, Safari
 xmlHttp=new XMLHttpRequest();
 }
catch (e)
 {
 //Internet Explorer
 try
  {
  xmlHttp=new ActiveXObject("Msxml2.XMLHTTP");
  }
 catch (e)
  {
  xmlHttp=new ActiveXObject("Microsoft.XMLHTTP");
  }
 }
return xmlHttp;
}
getuser.php
PHP: 
<?php
include('config.php');
$id = $_GET['id'];
if($id == 0) {
  $taakQuery = "SELECT *
              FROM wedstrijden";
} else {
  $taakQuery = "SELECT *
                FROM wedstrijden
                WHERE rij1='". $id ."'
                OR rij2='". $id ."'
                OR rij3='". $id ."'
                OR wassen='". $id ."'";
}
$taakResult = mysql_query($taakQuery) or die(mysql_error());

echo '<table cellpadding="0" cellspacing="0">
<tr>
 <th width="90">Datum</th>
 <th width="50">Tijd</th>
 <th width="70">Vertrek</th>
 <th width="125">Thuis</th>
 <th width="125">Uit</th>
 <th width="125">Hal</th>
 <th width="150">Rijden</th>
 <th width="150">Rijden</th>
 <th width="150">Reserve</th>
 <th width="150">Wassen</th>
</tr>';
if(mysql_num_rows($taakResult) == 0) {
  echo '<tr><td colspan="10"><center>Geen resultaten</center></td></tr>';
} else {
  while($row = mysql_fetch_array($taakResult)) {
    $datum = explode("-", $row['datum']);
    $datum = $datum[2].$datum[1].$datum[0];
    if(date("Ymd") <= $datum) {
      $stijl = ($row['thuis'] == 'Red Giants') ? 'uit' : 'thuis';
      echo '<tr class="'. $stijl .'">
             <td>'. $row['datum'] .'</td>
             <td>'. $row['tijd'] .'</td>
             <td>'. $row['vertrek'] .'</td>
             <td>'. $row['thuis'] .'</td>
             <td>'. $row['uit'] .'</td>
             <td>'. $row['hal'] .'</td>
             <td>'. getMember($row['rij1']) .'</td>
             <td>'. getMember($row['rij2']) .'</td>
             <td>'. getMember($row['rij3']) .'</td>
             <td>'. getMember($row['wassen']) .'</td>
            </tr>';
      $counter++;
    }
  }
}
if($counter == 0) {
  echo '<tr><td colspan="11">Geen wedstrijden meer te spelen</td></tr>';
}
 echo '</table>';

Voor de rest zitten in config.php de database-gegevens en ook deze 2 functies:
PHP: 
function getMember($id) {
  if($id == 0) {
    return "n.v.t.";
  } else {
    $userQuery = "SELECT naam FROM users WHERE id='". $id ."' LIMIT 1";
    $userResult = mysql_query($userQuery);
    $userRow = mysql_fetch_array($userResult);
    if($_GET['id'] == $id) {
      return '<b>'. $userRow['naam'] .'</b>';
    } else {
      return $userRow['naam'];
    }
  }
}
function userList() {
  $userQuery = "SELECT id,naam FROM users WHERE id NOT IN (9)";
  $userResult = mysql_query($userQuery);
  while($userRow = mysql_fetch_array($userResult)) {
    echo'<option value="'. $userRow['id'] .'">'. $userRow['naam'] .'</option>';
  }
}

Hopelijk begrijp je een beetje wat dit script doet (Je weet in ieder geval hoe het uiteindelijk werkt) zodra je dat in de gaten hebt denk ik dat je zelf de juiste aanpassingen kunt maken.
 
Status
Niet open voor verdere reacties.
                    Steun ons                    

Nieuwste berichten

Terug
Bovenaan Onderaan