new to ajax

[php_b34st]

Hi, I am new to ajax and got a lot of help on this script yesterday the thread was ajax, javascript and mysql I thought a fresh topic would be best as the other one was getting a bit hard to follow. I now have a semi-working version of the script i require which can be found at http://fantasyfootball.sportsontheweb.net/formation.php

 

To test the script use the following codes: 002 226 174 185 295 553 564 577 952 882 972

I am now having the following problems:

 

1. If a user enters info into all the fields and then decides they entered the wrong info in one of the boxes and changes it, the script does not remove the first player and still adds the new one

 

2. I would like to output all 11 fields into a mysql database at some point in the future but am having difficulties getting all 11 entries into an array so that this can be done at the same time, as the php page refreshes each time a new text field is used so does the array.

 

Any advice/help/info would be great thanks

[Davidammit]

Thats an interesting program you've got set up.

 

You could have the AJAX re-evaluate the entire form when the user changes one box, that way the list would be correct and you could have the submit button send the data to a different PHP file that stores the form contents to a database.

[php_b34st]

Thanks for the reply again, how would I get the ajax to re-evaluate the whole form? can ajax do sums? what kind of functions do i need to look intp?

[ibechane]

It seems like you're going to have the same number of total players and positions.  Therefore, you can structure your html to anticipate all 11 eleven players and give them ids, like:

 

<div id="player1"></div><br />
<div id="player2"></div><br />
etc..

or 

<tr><td id="p1code"></td><td id="p1name"></td><td id="p1club"></td><td id="p1price"></td></tr>
etc...

 

 

Your php document seems to output table elements.  Instead of that, you could output a string separated by commas, like "2,M Almunia,Arsenal,5.0" and then use the javascript method split() to turn that string into an array.  Then, in your javascript, use the document.getElementById("p1name").innerHTML property and set that equal to the correct array element.  You could even use eval() to construct your javascript string if your id naming scheme is consistent. That way, if it's updated, it will update the innerHTML, which should overwrite a previous entry.

[php_b34st]

Thank you, i will look into these functions and see what outcome I can get.

[php_b34st]

Hi, after reading up on the functions you suggested I came up with the following:

 

javascript file:

var xmlHttp

function showUser(str)
{ 
xmlHttp=GetXmlHttpObject()
if (xmlHttp==null)
{
alert ("Browser does not support HTTP Request")
return
}
var url="includes/getuser.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 || xmlHttp.readyState=="complete")
{
var myArray = xmlHttp.responseText.split(",");
document.getElementById("p1code").innerHTML=myArray[0]   
document.getElementById("p1name").innerHTML=myArray[1]
document.getElementById("p1club").innerHTML=myArray[2]
document.getElementById("p1price").innerHTML=myArray[3]
}
}

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;
}

 

php file:

<table border="1" cellpadding="0" cellspacing="0" width="400px">
<tr><td id="p1code"></td><td id="p1name"></td><td id="p1club"></td><td id="p1price"></td></tr>
<tr><td id="p2code"></td><td id="p2name"></td><td id="p2club"></td><td id="p2price"></td></tr>
<tr><td id="p3code"></td><td id="p3name"></td><td id="p3club"></td><td id="p3price"></td></tr>
<tr><td id="p4code"></td><td id="p4name"></td><td id="p4club"></td><td id="p4price"></td></tr>
<tr><td id="p5code"></td><td id="p5name"></td><td id="p5club"></td><td id="p5price"></td></tr>
<tr><td id="p6code"></td><td id="p6name"></td><td id="p6club"></td><td id="p6price"></td></tr>
<tr><td id="p7code"></td><td id="p7name"></td><td id="p7club"></td><td id="p7price"></td></tr>
<tr><td id="p8code"></td><td id="p8name"></td><td id="p8club"></td><td id="p8price"></td></tr>
<tr><td id="p9code"></td><td id="p9name"></td><td id="p9club"></td><td id="p9price"></td></tr>
<tr><td id="p10code"></td><td id="p10name"></td><td id="p10club"></td><td id="p10price"></td></tr>
<tr><td id="p11code"></td><td id="p11name"></td><td id="p11club"></td><td id="p11price"></td></tr>
</table>

original form:

<input type="text" id="player1" name="player1" size=6 maxlength=3 class="playername" onchange="showUser(this.value)" onclick="this.select()" value="000"/>
<input type="text" id="player2" name="player2'" size=6 maxlength=3 class="playername" onchange="showUser(this.value)" onclick="this.select()" value="000"/>
etc for 11 input fields

 

but the problem is all input fields output to p1 how do i get it to recognise each different id and then output to the correct place ie player1 = p1code,p1name,p1club,p1price and player2 = p2code,p2name,p2club,p2price?