开发者

2 Ajax divs conflicting

I use this code and the other td's have the same showDetails code

echo '<td width=25 onclick="toggleSlijtd('.$row['id'].')"><img title="'.htmlentities($lang['slijtdeel_minus']).'" src="images/icon/arrow_minus.png"></td>
    <td width=25 align="right" onclick="setHighlighted(this),showDetails('.$row['id'].');">'.$row['aantal_huidig'].'</td>';

showDetails makes the panel come down with some more information, the toggleSlijtd makes the number decrease by one. They are working but:

  1. the new number is shown in the wrong place;
  2. the new number is only shown when showDetails is used once;

2 Ajax divs conflicting

What is wrong with my code? Or should I use an other code completely. I hope not because time is running out.

My Ajax script:

var xmlhttp;

var hold_rowid="";

function toggleSlijtd(str)
{
hold_rowid=str;

xmlhttp=GetXmlHttpObject();
if (xmlhttp==null)
  {
  alert ("Browser does not support HTTP Request");
  return;
  }
var url="inc开发者_C百科ludes/js/ajax_toggle_slijtdeel.php";
url=url+"?q="+str;
url=url+"&sid="+Math.random();
xmlhttp.onreadystatechange=stateChanged;
xmlhttp.open("GET",url,true);
xmlhttp.send(null);
}

function stateChanged()
{
if (xmlhttp.readyState==4)
{
document.getElementById("row"+hold_rowid).innerHTML=xmlhttp.responseText;  //this now identifies which cell to target and change.
}
}

function GetXmlHttpObject()
{
if (window.XMLHttpRequest)
  {
  // code for IE7+, Firefox, Chrome, Opera, Safari
  return new XMLHttpRequest();
  }
if (window.ActiveXObject)
  {
  // code for IE6, IE5
  return new ActiveXObject("Microsoft.XMLHTTP");
  }
return null;
}

php file:

mysql_select_db($database, $con);

$id = $_GET["q"];

    $sql = "SELECT aantal_huidig FROM slijtdelen WHERE id = '".$id."' ";
    $query = mysql_query($sql, $con) or die(mysql_error());

// Verminder hoeveelheid

while($myrow = mysql_fetch_assoc($query))
{
    $hoeveelheid = ($myrow['aantal_huidig'] - 1);
}

$sql="UPDATE slijtdelen SET aantal_huidig = '".$hoeveelheid."' WHERE id = '".$id."' "; 
$query = mysql_query($sql, $con) or die(mysql_error());


// Stuur wel of geen icoon terug
if($hoeveelheid > 0)
{
    echo '<td width=25 onclick="toggleSlijtd('.$row['id'].')"><img title="'.htmlentities($lang['slijtdeel_minus']).'" src="images/icon/arrow_minus.png"></td>
          <td width=25 align="right">'.$hoeveelheid.'</td>';
}
else
{
    echo '';
}    
?>

Rendered page:

  </table><table id="top_header" cellspacing="0" cellpadding="0" width="100%">

  <tr class="top_table floating header">

      <td width=10 class="top_table_start"></td>

      <td width=100>Bestelnr. <a href="/slijtdelen.php?sort_name=slt.bestelnummer&sort=asc" title="Sorteer oplopend"><img src="images/icon/asc.png" ></a> <a href="/slijtdelen.php?sort_name=slt.bestelnummer&sort=desc" title="Sorteer aflopend"><img src="images/icon/desc.png" ></a></td>

      <td width=350>Omschrijving <a href="/slijtdelen.php?sort_name=slt.omschrijving&sort=asc" title="Sorteer oplopend"><img src="images/icon/asc.png" ></a> <a href="/slijtdelen.php?sort_name=slt.omschrijving&sort=desc" title="Sorteer aflopend"><img src="images/icon/desc.png" ></a></td>

      <td width=100 colspan="3">Voorraad <a href="/slijtdelen.php?sort_name=slt.aantal_huidig&sort=asc" title="Sorteer oplopend"><img src="images/icon/asc.png" ></a> <a href="/slijtdelen.php?sort_name=slt.aantal_huidig&sort=desc" title="Sorteer aflopend"><img src="images/icon/desc.png" ></a></td>

      <td width=100 colspan="2">In bestelling <a href="/slijtdelen.php?sort_name=slt.in_bestelling&sort=asc" title="Sorteer oplopend"><img src="images/icon/asc.png" ></a> <a href="/slijtdelen.php?sort_name=slt.in_bestelling&sort=desc" title="Sorteer aflopend"><img src="images/icon/desc.png" ></a></td>

      <td width=125 colspan="2">Prijs per stuk <a href="/slijtdelen.php?sort_name=slt.prijs &sort=asc" title="Sorteer oplopend"><img src="images/icon/asc.png" ></a> <a href="/slijtdelen.php?sort_name=slt.prijs &sort=desc" title="Sorteer aflopend"><img src="images/icon/desc.png" ></a></td>

      <td width=150>Catagorie <a href="/slijtdelen.php?sort_name=cat.catagorie&sort=asc" title="Sorteer oplopend"><img src="images/icon/asc.png" ></a> <a href="/slijtdelen.php?sort_name=cat.catagorie&sort=desc" title="Sorteer aflopend"><img src="images/icon/desc.png" ></a></td>

      <td width=150>Leverancier <a href="/slijtdelen.php?sort_name=adr.klantnaam&sort=asc" title="Sorteer oplopend"><img src="images/icon/asc.png" ></a> <a href="/slijtdelen.php?sort_name=adr.klantnaam&sort=desc" title="Sorteer aflopend"><img src="images/icon/desc.png" ></a></td>

      <td width=10 class="top_table_end"></td>

  </tr><tr onMouseOver="addHighlight(this);" onMouseOut="removeHighlight(this);">

          <td onclick="setHighlighted(this),showDetails(106);"></td>

          <td onclick="setHighlighted(this),showDetails(106);">980SUTA12</td>

          <td onclick="setHighlighted(this),showDetails(106);">Boor HSSE PV10 980SUTA Ø12</td><td width=25 onclick="toggleSlijtd(106)"><img title="Haal &eacute;&eacute;n uit voorraad" src="images/icon/arrow_minus.png" /></td>

                    <td width=25 align="right" onclick="setHighlighted(this),showDetails(106);">12</td><td width=50 onclick="setHighlighted(this),showDetails(106);"></td><td width=65 onclick="setHighlighted(this),showDetails(106);"></td><td width=35 onclick="setHighlighted(this),showDetails(106);"></td><td width=75 align="right">&euro; 21.02</td><td width=50 onclick="setHighlighted(this),showDetails(106);"></td>

          <td onclick="setHighlighted(this),showDetails(106);"></td>

          <td onclick="setHighlighted(this),showDetails(106);">Heku Tools</td>

          <td onclick="setHighlighted(this),showDetails(106);"></td>

      </tr>

      <tr>

          <td colspan="13"> <div id="details106"></div> </td>

      </tr><tr onMouseOver="addHighlight(this);" onMouseOut="removeHighlight(this);">

          <td onclick="setHighlighted(this),showDetails(104);"></td>

          <td onclick="setHighlighted(this),showDetails(104);">980SUTA121</td>

          <td onclick="setHighlighted(this),showDetails(104);">Boor HSSE PV10 980SUTA Ø12,1</td><td width=25 onclick="toggleSlijtd(104)"><img title="Haal &eacute;&eacute;n uit voorraad" src="images/icon/arrow_minus.png" /></td>

                    <td width=25 align="right" onclick="setHighlighted(this),showDetails(104);">4</td><td width=50 onclick="setHighlighted(this),showDetails(104);"></td><td width=65 onclick="setHighlighted(this),showDetails(104);"></td><td width=35 onclick="setHighlighted(this),showDetails(104);"></td><td width=75 align="right">&euro; 39.32</td><td width=50 onclick="setHighlighted(this),showDetails(104);"></td>

          <td onclick="setHighlighted(this),showDetails(104);"></td>

          <td onclick="setHighlighted(this),showDetails(104);">Heku Tools</td>

          <td onclick="setHighlighted(this),showDetails(104);"></td>

      </tr>

      <tr>

          <td colspan="13"> <div id="details104"></div> </td>

      </tr><tr onMouseOver="addHighlight(this);" onMouseOut="removeHighlight(this);">

          <td onclick="setHighlighted(this),showDetails(105);"></td>

          <td onclick="setHighlighted(this),showDetails(105);">980SUTA61</td>

          <td onclick="setHighlighted(this),showDetails(105);">Boor HSSE PV10 980SUTA Ø6,1</td><td width=25 onclick="toggleSlijtd(105)"><img title="Haal &eacute;&eacute;n uit voorraad" src="images/icon/arrow_minus.png" /></td>

                    <td width=25 align="right" onclick="setHighlighted(this),showDetails(105);">5</td><td width=50 onclick="setHighlighted(this),showDetails(105);"></td><td width=65 onclick="setHighlighted(this),showDetails(105);"></td><td width=35 onclick="setHighlighted(this),showDetails(105);"></td><td width=75 align="right">&euro; 16.09</td><td width=50 onclick="setHighlighted(this),showDetails(105);"></td>

          <td onclick="setHighlighted(this),showDetails(105);"></td>

          <td onclick="setHighlighted(this),showDetails(105);">Heku Tools</td>

          <td onclick="setHighlighted(this),showDetails(105);"></td>

      </tr>

      <tr>

          <td colspan="13"> <div id="details105"></div> </td>

      </tr></table>


</tr><tr onMouseOver="addHighlight(this);" onMouseOut="removeHighlight(this);"></td>

The above line has </td> without any <td>. This may cause the alignment issue. Your server side code doesn't show this. It could be an erroneous tag. Take it out as the first step.

0

上一篇:

下一篇:

精彩评论

暂无评论...
验证码 换一张
取 消

最新问答

问答排行榜