469,267 Members | 979 Online
Bytes | Developer Community
New Post

Home Posts Topics Members FAQ

Post your question to a community of 469,267 developers. It's quick & easy.

Created table using Ajax but can't change td inner html for a specific table element

Below are my 3php and 2js files.

I create a table using ajax/php and then want to change the values in the tables add(+ number for teamid) id's for each specific td in the table. I don't know if I have the entirely wrong approach, but my code is below. Any or all help is appreciated!

What currently happens is that the getdivision.php script works perfectly and gives me an entire table of correct data. The problem is that when I click add or remove in a td element in tha ttable, the entire table disappears and I only get the data that I want to input into the single td element where the entire table used to display at.

edited to display the current situation/results.

Best,

ThatCollegeGuy

teamreports.php

Expand|Select|Wrap|Line Numbers
  1. <?php 
  2. include 'dbc.php';
  3. page_protect();
  4.  
  5. $myid = $GET[id];
  6.  
  7. $query = "SELECT * FROM teamreports";
  8. $teamreport = mysql_query($query);
  9.  
  10. $num_rows = mysql_num_rows($teamreport);
  11.  
  12.  
  13. ?>
  14.  
  15.  
  16. <html>
  17. <head>
  18. <title> <? echo "Team Reports"; ?> </title>
  19. <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
  20.  
  21. <link href="stylesheet.css" rel="stylesheet" type="text/css">
  22. <script type="text/javascript" src="teamreports.js"></script>
  23. <script type="text/javascript" src="sorttable.js"></script>
  24. <script type="text/javascript" src="selectdivision.js"></script>
  25.  
  26. </head>
  27. <body>
  28. <div id="container">
  29. <div id="top">
  30. <img src="http://smarterfootball.com/images/sfootball_logo_original.jpg">
  31. </div>
  32. <div id="login">
  33. <?
  34. if (isset($_SESSION['user_id'])) {?>
  35.  
  36. Welcome <? echo $_SESSION['user_name'];?> 
  37. <br />
  38.   <a href="myaccount.php">My Account</a> | 
  39.   <a href="mysettings.php">Settings</a> | 
  40.     <a href="logout.php">Logout </a>
  41.  
  42. <? } 
  43. /*******************************END**************************/
  44. ?>
  45. </div>
  46. <?
  47. include 'membernavigation.php';
  48. ?>
  49.  
  50. <h3> Team Reports </h3>
  51.  
  52. <form>
  53. Select a Division:
  54. <select name="users" onchange="showUser(this.value)">
  55. <option value="0" selected>Select a Division</option>
  56. <option value="I">Division I</option>
  57. <option value="I-AA">Division I-AA</option>
  58. <option value="II">Division II</option>
  59. <option value="III">Division III</option>
  60. </select>
  61. <br />
  62. Select a State:
  63. <select name="state" onchange="getState(this.value)">
  64.     <option value="0">Select a State</option>
  65.     <option value="Alabama">Alabama</option>
  66.     <option value="Alaska">Alaska</option>
  67.     <option value="Arizona">Arizona</option>
  68.     <option value="Arkansas">Arkansas</option>
  69.     <option value="California">California</option>
  70.     <option value="Colorado">Colorado</option>
  71.     <option value="Connecticut">Connecticut</option>
  72.     <option value="Delaware">Delaware</option>
  73.     <option value="District of Columbia">District of Columbia</option>
  74.     <option value="Florida">Florida</option>
  75.     <option value="Georgia">Georgia</option>
  76.     <option value="Hawaii">Hawaii</option>
  77.     <option value="Idaho">Idaho</option>
  78.     <option value="Illinois">Illinois</option>
  79.     <option value="Indiana">Indiana</option>
  80.     <option value="Iowa">Iowa</option>
  81.     <option value="Kansas">Kansas</option>
  82.     <option value="Kentucky">Kentucky</option>
  83.     <option value="Louisiana">Louisiana</option>
  84.     <option value="Maine">Maine</option>
  85.     <option value="Maryland">Maryland</option>
  86.     <option value="Massachusetts">Massachusetts</option>
  87.     <option value="Michigan">Michigan</option>
  88.     <option value="Minnesota">Minnesota</option>
  89.     <option value="Mississippi">Mississippi</option>
  90.     <option value="Missouri">Missouri</option>
  91.     <option value="Montana">Montana</option>
  92.     <option value="Nebraska">Nebraska</option>
  93.     <option value="Nevada">Nevada</option>
  94.     <option value="New Hampshire">New Hampshire</option>
  95.     <option value="New Jersey">New Jersey</option>
  96.     <option value="New Mexico">New Mexico</option>
  97.     <option value="New York">New York</option>
  98.     <option value="North Carolina">North Carolina</option>
  99.     <option value="North Dakota">North Dakota</option>
  100.     <option value="Ohio">Ohio</option>
  101.     <option value="Oklahoma">Oklahoma</option>
  102.     <option value="Oregon">Oregon</option>
  103.     <option value="Pennsylvania">Pennsylvania</option>
  104.     <option value="Rhode Island">Rhode Island</option>
  105.     <option value="South Carolina">South Carolina</option>
  106.     <option value="South Dakota">South Dakota</option>
  107.     <option value="Tennessee">Tennessee</option>
  108.     <option value="Texas">Texas</option>
  109.     <option value="Utah">Utah</option>
  110.     <option value="Vermont">Vermont</option>
  111.     <option value="Virginia">Virginia</option>
  112.     <option value="Washington">Washington</option>
  113.     <option value="West Virginia">West Virginia</option>
  114.     <option value="Wisconsin">Wisconsin</option>
  115.     <option value="Wyoming">Wyoming</option>
  116. </select>
  117.  
  118. </form>
  119. <br />
  120. <div id="txtHint"><b>Created table will go here.</b></div>
  121.  
  122. <?
  123. include 'footer.php';
  124. ?>
  125.  
  126. ------------------------------------------------------------------------
  127. ------------------------------------------------------------------------
  128. ------------------------------------------------------------------------
  129.  
  130. getdivision.php
  131.  
  132.  
  133. <?php
  134.     include('dbc.php');
  135.     include('functions.php');
  136.     page_protect();
  137.  
  138.     $query = "SELECT * FROM myschools WHERE id = '$_SESSION[user_id]'";
  139.     $myschools = mysql_query($query);
  140.     $myschool_num_rows = mysql_num_rows($myschools);
  141.  
  142.  
  143. $q=$_GET["q"];
  144. $state=$_GET["state"];
  145.  
  146. if (!$state)
  147. {
  148.    $sql="SELECT * FROM teamreports WHERE division = '".$q."' ORDER BY university";
  149. }
  150. else
  151. {
  152.    $sql="SELECT * FROM teamreports WHERE state = '".$state."' ORDER BY university";
  153. }
  154.  
  155.  
  156. $result = mysql_query($sql);
  157.  
  158. echo '<table class="sortable" border="0">';
  159. echo"<tr>
  160. <th>University</th>
  161. <th>Division</th>
  162. <th>Conference</th>
  163. <th>State</th>
  164. <th>Add to My List</th>
  165. </tr>";
  166.  
  167. while($row = mysql_fetch_array($result))
  168.   {
  169.   echo "<tr>";
  170.   echo '<td><a href="teamreport.php?id=' . $row['id'] . '">' . $row['university'] . '</a></td>';
  171.   echo "<td>" . $row['division'] . "</td>";
  172.   echo "<td>" . $row['conference'] . "</td>";
  173.   echo "<td>" . $row['state'] . "</td>";
  174.  
  175.   $k=0;
  176.   $p=0;
  177.  
  178.   while ($k < $myschool_num_rows)
  179.       {
  180.        if ($row['university']== mysql_result($myschools,$k,'university'))
  181.          {
  182.        if (mysql_result($myschools,$k,'inactive')==1)
  183.           {
  184.           echo '<td valign="bottom" id="add' . $row[id] . '"><div id="ad' . $row[id] . '"><form method="post">
  185.           <input type="hidden" name="school" value="' . mysql_result($myschools,$k,"university") . '">
  186.           <input type="hidden" name="teamid" value="' . mysql_result($myschools,$k,"teamid") . '">
  187.           <input type="submit" value="Remove" onclick="addSchool(' . $teamid . '); return false"></form></div>';
  188.           $p=1;
  189.           }
  190.        }
  191.       $k++;
  192.       }    
  193.   if ($p==0)
  194.        {
  195.      echo '<td valign="bottom" id="add' . $row[id] . '"><div id="ad' . $row['id'] . '"><form method="post">
  196.      <input type="hidden" name="school" value="' . $row['university'] . '">
  197.      <input type="hidden" name="teamid" value="' . $row['id'] . '">
  198.      <input type="image" name="add" class="add-btn" src="http://www.smarterfootball.com/images/btn.gif" alt="submit" title="submit" onclick="addSchool(' . $teamid . '); return false" /></form></div>';
  199.        }
  200.   echo "add" . $row['id'];
  201.   echo "</td>";
  202.   echo "</tr>";
  203.   }
  204. echo "</table>" . $state;
  205.  
  206. ?> 
  207.  
  208.  
  209. -----------------------------------------------------------------------------------
  210. ----------------------------------------------------------------------------------
  211. changebutton.php
  212.  
  213.  
  214. <?php
  215.     include('dbc.php');
  216.     include('functions.php');
  217.     page_protect();
  218.  
  219. $teamid=$_GET["teamid"];
  220.  
  221. $query = "SELECT university FROM teamreports WHERE id = '$teamid'";
  222. $result = mysql_query($query);
  223. $myuniversity = mysql_fetch_array($result);
  224.  
  225.  
  226. $university=$myuniversity["university"];
  227.  
  228.  
  229.  
  230. $sql="SELECT * FROM myschools WHERE teamid = '$teamid' AND id = '$_SESSION[user_id]'";
  231.  
  232. $result = mysql_query($sql);
  233. $myschools = mysql_fetch_array($result);
  234. $num_rows = mysql_num_rows($result);
  235.  
  236. if ($num_rows==0)
  237. {
  238.     $sql_insert = "INSERT into `myschools`
  239.       (`id`,`university`,`teamid`,`inactive`)
  240.     VALUES
  241.     ('$_SESSION[user_id]','$university','$teamid',1)
  242.     ";
  243.     mysql_query($sql_insert,$link) or die("Insertion Failed:" . mysql_error());     
  244.  
  245.        echo '<div id="add' . $teamid . '"><form method="post">
  246.     <input type="hidden" name="school" value="' . $university . '">
  247.     <input type="hidden" name="teamid" value="' . $teamid . '">
  248.     <input type="submit" value="Remove" onclick="addSchool(' . $teamid . '); return false"></form></div>';   
  249. }
  250. else if ($num_rows > 0)
  251. {
  252. if ($myschools['inactive']==1)
  253.    {
  254.      echo '<div id="add' . $teamid . '"><form method="post">
  255.      <input type="hidden" name="school" value="' . $university . '">
  256.      <input type="hidden" name="teamid" value="' . $teamid . '">
  257.      <input type="image" name="add" class="add-btn" src="http://www.smarterfootball.com/images/btn.gif" alt="submit" title="submit" onclick="addSchool(' . $teamid . '); return false" /></form></div>';
  258.  
  259.       $sql_insert = "UPDATE `myschools` SET inactive=0 WHERE university = '$university' AND id = '$_SESSION[user_id]'";
  260.      mysql_query($sql_insert,$link) or die("Insertion Failed:" . mysql_error());
  261.    }
  262. else
  263.    {
  264.         echo '<div id="add' . $teamid . '"><form method="post">
  265.      <input type="hidden" name="school" value="' . $university . '">
  266.      <input type="hidden" name="teamid" value="' . $university . '">
  267.      <input type="submit" value="Remove" onclick="addSchool(' . $teamid . '); return false"></form></div>';
  268.  
  269.      $sql_insert = "UPDATE `myschools` SET inactive=1 WHERE university = '$university' AND id = '$_SESSION[user_id]'";
  270.      mysql_query($sql_insert,$link) or die("Insertion Failed:" . mysql_error());
  271.  
  272.    }
  273. }
  274.  
  275. ?> 
  276.  
  277.  
  278. ---------------------------------------------------------------------------------
  279. ---------------------------------------------------------------------------------
  280. ---------------------------------------------------------------------------------
  281. teamreports.js
  282.  
  283. var xmlhttp;
  284. var logcloser;
  285. function addSchool(str)
  286. {
  287. xmlhttp=GetXmlHttpObject();
  288. if (xmlhttp==null)
  289.   {
  290.   alert ("Browser does not support HTTP Request");
  291.   return;
  292.   }
  293.            var url="changebutton.php";
  294.            url=url+"?teamid="+str;
  295.            url=url+"&sid="+Math.random();
  296.  
  297. xmlhttp.onreadystatechange=function() {
  298.                 if (xmlhttp.readyState != 4) {
  299.                     document.getElementById("add" + str).innerHTML='<img src="http://www.sanbaldo.com/wordpress/wp-content/bigrotation2.gif">';                    
  300.                 }
  301.                 if (xmlhttp.readyState == 4) {
  302.                     document.getElementById("add" + str).innerHTML=stateChanged(str,xmlhttp.responseText);
  303.  
  304.                 }
  305.             }
  306. xmlhttp.open("GET",url,true);
  307. xmlhttp.send(null);
  308. }
  309.  
  310.  
  311. function stateChanged(str, responseMsg)
  312. {
  313.     if (xmlhttp.readyState==4)
  314.     {
  315.         document.getElementById("add" + str).innerHTML=xmlhttp.responseText;
  316.  
  317.     }
  318. }
  319.  
  320.  
  321. function GetXmlHttpObject()
  322. {
  323. if (window.XMLHttpRequest)
  324.   {
  325.   // code for IE7+, Firefox, Chrome, Opera, Safari
  326.   return new XMLHttpRequest();
  327.   }
  328. if (window.ActiveXObject)
  329.   {
  330.   // code for IE6, IE5
  331.   return new ActiveXObject("Microsoft.XMLHTTP");
  332.   }
  333. return null;
  334. }
  335.  
  336.  
  337.  
  338. ---------------------------------------------------------------------------------
  339. ---------------------------------------------------------------------------------
  340. ---------------------------------------------------------------------------------
  341. ---------------------------------------------------------------------------------
  342. selectdivision.js
  343.  
  344.  
  345.  
  346. var xmlhttp;
  347.  
  348. function getState(str)
  349. {
  350. xmlhttp=GetXmlHttpObject();
  351. if (xmlhttp==null)
  352.   {
  353.   alert ("Browser does not support HTTP Request");
  354.   return;
  355.   }
  356. var url="getdivision.php";
  357. url=url+"?state="+str;
  358. url=url+"&sid="+Math.random();
  359. xmlhttp.onreadystatechange=stateChanged;
  360. xmlhttp.open("GET",url,true);
  361. xmlhttp.send(null);
  362. }
  363.  
  364.  
  365. function showUser(str)
  366. {
  367. xmlhttp=GetXmlHttpObject();
  368. if (xmlhttp==null)
  369.   {
  370.   alert ("Browser does not support HTTP Request");
  371.   return;
  372.   }
  373. var url="getdivision.php";
  374. url=url+"?q="+str;
  375. url=url+"&sid="+Math.random();
  376. xmlhttp.onreadystatechange=stateChanged;
  377. xmlhttp.open("GET",url,true);
  378. xmlhttp.send(null);
  379. }
  380.  
  381. function stateChanged()
  382. {
  383. if (xmlhttp.readyState!=4)
  384. {
  385. document.getElementById("txtHint").innerHTML='<div align="center"><img src="http://www.sanbaldo.com/wordpress/wp-content/bigrotation2.gif"></div>';
  386. }
  387. if (xmlhttp.readyState==4)
  388. {
  389. document.getElementById("txtHint").innerHTML=xmlhttp.responseText;
  390. }
  391. }
  392.  
  393. function GetXmlHttpObject()
  394. {
  395. if (window.XMLHttpRequest)
  396.   {
  397.   // code for IE7+, Firefox, Chrome, Opera, Safari
  398.   return new XMLHttpRequest();
  399.   }
  400. if (window.ActiveXObject)
  401.   {
  402.   // code for IE6, IE5
  403.   return new ActiveXObject("Microsoft.XMLHTTP");
  404.   }
  405. return null;
  406. }
Nov 17 '09 #1
5 4103
acoder
16,027 Expert Mod 8TB
Change the line:
Expand|Select|Wrap|Line Numbers
  1. document.getElementById("add" + str).innerHTML=stateChanged(str,xmlhttp.responseText);
to
Expand|Select|Wrap|Line Numbers
  1. document.getElementById("add" + str).innerHTML=xmlhttp.responseText;
Nov 21 '09 #2
I made the change and I am still getting the same error.

TCG
Nov 21 '09 #3
I just used firebug to get a better idea of the code that is showing in my html page after the first basic ajax change. I assumed that I missed a </td> to make it not work correctly, but this was not the case. Maybe this can help someone help me debug the current coding.

Expand|Select|Wrap|Line Numbers
  1. <td id="add73" valign="bottom">
  2. <div id="ad73">
  3. <form method="post">
  4. <input type="hidden" value="Albany" name="school"/>
  5. <input type="hidden" value="73" name="teamid"/>
  6. <input class="add-btn" type="image" onclick="addSchool(); return false" title="submit" alt="submit" src="http://www.smarterfootball.com/images/btn.gif" name="add"/>
  7. </form>
  8. </div>
  9. add73
  10. </td>
Nov 24 '09 #4
Plater
7,872 Expert 4TB
I don't see a javascript Add function. If your add function is being done in backend code with a submit form, then things are probably being wiped out by the page reload
Nov 24 '09 #5
it's on line 285 - addSchool(str) in teamreports.js

if you still think your solution can solve the problem - what changes can I make in order to fix it?

Thanks!
Nov 24 '09 #6

Post your reply

Sign in to post your reply or Sign up for a free account.

Similar topics

1 post views Thread by Lars Erik Hansen | last post: by
1 post views Thread by ghjk | last post: by
1 post views Thread by CARIGAR | last post: by
reply views Thread by zhoujie | last post: by
reply views Thread by suresh191 | last post: by
By using this site, you agree to our Privacy Policy and Terms of Use.