PDA

View Full Version : ajax help please



ActingRude
03 Nov 2010, 01:27 PM
First let me tell you i am trying to have a webpage (html/php) with a php created drop down menu call a java script function.
This function is supposed to grab a string from a php script and get a returned string.
This returned string is then injected into a specified div so that it creates a table based on the value set in the drop down box.
I am having issues getting a string returned from the php (which I suspect is because I am not properly calling the php function).
I am also having issues then with style. That is to say, the closest I have gotten is to not call the php file and just inject a string from the js file, but that string ends up not adhering to the style set forth in my css file.
the main page:

<!--
*****
CS 3440
Fall 2010
P02
-->
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
* * * *"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
*<title>Create New Message</title>
*<script type="text/javascript" src="p2b.js"></script>
* <link rel = "stylesheet" *type = "text/css" href = "p2.css" />
</head>
<body onload="checkL()">
*<form id="fam" action="">
* <p class="box" id="logged"> Use responsibly please!
* *<br />
* *<br />
* *Number of Recipients (25 max with standard account):
* *<select name="education" onchange = "fillTable(this.value)">
* *<option value='null'>Select One</option>
* *<?php
* * for ($num=1; $num < 26; $num++)
* * * *{
* * * * echo "<option value='$num'>$num</option>";
* * }
* *?>
* *</select>
* *<br />
* *<br />
* * <input type="button" value="Submit" id="sub" onclick="finish()" style="visibility:visible;" /> * *
* </p>
* *<div id="table">
* *
* *</div>
*</form>
*<p class="box" id="nlogged" style="visibility:visible;" >
* Please log in before attempting to add a text to the cue.
*</p>
</body>
</html>

The javascript file

function checkL()
{
var logged=confirm("View the page as if logged in?");
if(!logged)
{

*document.getElementById('logged').style.visibility='hidden';
*document.getElementById('nlogged').style.visibility='visible';
}
if(logged)
{
*document.getElementById('logged').style.visibility='visible';
*document.getElementById('nlogged').style.visibility='hidden';
}
}
function finish()
{
var myPhone = document.getElementById("num");
var pos = myPhone.value.search(/^\d{3}-\d{3}-\d{4}$/);
if (pos != 0)
* * alert("The phone number you entered (" + myPhone.value + ") does not appear valid.");
* *if(document.getElementById('tcon').valueOf() == "" || document.getElementById('tcon').valueOf() == "Text Content")
* * alert("You did not enter a text to be sent");
}
function fillTable(num)
{
var xhr = new XMLHttpRequest();
* xhr.open("GET", "getTable.php?num=" + num);
* xhr.onreadystatechange = function ()
* {
* * if (xhr.readyState == 4 && xhr.status == 200)
* * {
* var result = xhr.responseText;
* document.getElementById('table').innerHTML = 'result';
* * }
* }

* xhr.send(null);
}

the php file

<?php
var s = "";
$num = $_GET["num"];
for(i=0;i < num; i++)
{
*s += "<tr>
* * <td><input type='text' value='Phone Number (ddd-ddd-dddd)' id='num"+num+"' style='visibility:visible;' /></td>
* * <td><input type='text' value='Text Content' id='tcon"+num+"' style='visibility:visible;' /></td>
* * <td><input type='text' value='Reason' id='rea"+num+"' style='visibility:visible;' /></td>
* * <td><input type='text' value='Cell Carier' id='care"+num+"' style='visibility:visible;' /></td>
* *</tr>";
}
s = ('<table class="victims">' + s);
s = s + ('</table>');
print(s);
?>

if my code is unclear I would be happy to go through and document it more to make it more easily understood.


Thank you in advance, Jake (Actingrude)


(Also if anyone uses coda on a mac with chrome as the preview, why does chrome download the php file instead of displaying it)