ajax response into form fields

[antriver]

Hello,
I'm trying to make a button in my form which, when clicked, will get the details for the movie name typed into the 'title' field.
I've got a PHP script which gets the information and this works fine. But I want to know how to get the javascript which is output by my php code to be run so that the details are put into the form.
I don't know if I'm doing it right, but this is the output of my PHP script:

document.theform.year.value = '<?php echo $year; ?>';
document.theform.thumb.value = '<?php echo $thumb; ?>';
document.theform.description.value = '<?php echo $plot; ?>';
document.theform.genre.value = '<?php echo $genre; ?>';

and this is my javascript code

<script language="javascript" type="text/javascript">
<!-- 
//Browser Support Code
function ajaxFunction(){
var ajaxRequest; // The variable that makes Ajax possible!
try{
// Opera 8.0+, Firefox, Safari
ajaxRequest = new XMLHttpRequest();
} catch (e){
// Internet Explorer Browsers
try{
ajaxRequest = new ActiveXObject("Msxml2.XMLHTTP");
} catch (e) {
try{
ajaxRequest = new ActiveXObject("Microsoft.XMLHTTP");
} catch (e){
// Something went wrong
alert("Error getting details.");
return false;
}
}
}
// Create a function that will receive data sent from the server
ajaxRequest.onreadystatechange = function(){
if(ajaxRequest.readyState == 4){
        eval(ajaxRequest.responseText) 
}
}
var url="getmoviedeets.php?name="+document.theform.title.value
ajaxRequest.open("GET", url, true);
ajaxRequest.send(null); 
}
//-->
</script>

it's obviously the "eval(ajaxRequest.responseText)" which needs changing but I don't know how to get it to actually run the output of the php script (putting those values into the form).

Thanks

[gergoe]

AJAX is about communicating between the browser and the server with XML, not with JavaScript code, that was never the intention. The proper way is something like this:

The php script (which produces the XML response):

<?php header('Content-Type: text/xml'); ?><?xml version="1.0"?>
<movie>
<year><?php echo $year; ?></year>
<thumb><?php echo $thumb; ?></thumb>
<description><?php echo htmlentities($plot); ?></description>
<genre><?php echo $genre; ?></genre>
</movie>

The html:

[pre]<script language="javascript" type="text/javascript">
  <!--
  [i]//Browser Support Code[/i]
  function ajaxFunction(){
    var ajaxRequest; [i]// The variable that makes Ajax possible![/i]
    try {
      [i]// Opera 8.0+, Firefox, Safari[/i]
      ajaxRequest = new XMLHttpRequest();
    } catch (e){
      [i]// Internet Explorer Browsers[/i]
      try {
        ajaxRequest = new ActiveXObject("Msxml2.XMLHTTP");
      } catch (e) {
        try {
          ajaxRequest = new ActiveXObject("Microsoft.XMLHTTP");
        } catch (e) {
          [i]// Something went wrong[/i]
          alert("Error getting details.");
          return false;
        }
      }
    }
    [i]// Create a function that will receive data sent from the server[/i]
    ajaxRequest.onreadystatechange = function(){
      if (ajaxRequest.readyState == 4) {
        if (ajaxRequest.responseXML.documentElement) {
          setFromDOM(ajaxRequest.responseXML.documentElement, 'year');
          setFromDOM(ajaxRequest.responseXML.documentElement, 'thumb');
          setFromDOM(ajaxRequest.responseXML.documentElement, 'description');
          setFromDOM(ajaxRequest.responseXML.documentElement, 'genre');
        }
      }
    }
    var url="getmoviedeets.php?name="+document.theform.title.value
    ajaxRequest.open("GET", url, true);
    ajaxRequest.send('');
  }
  [i]//
  // Retrieve a value from the DOM tree, and set in the input field
  // using the functions below.[/i]
  function setFromDOM(domNode, nodeName) {
    setInputValueByName(nodeName, getFromDOM(domNode, nodeName));
  }
  [i]//
  // Retrieves the value of a node from the DOM tree using
  // its name. If there's anything but one such an element found
  // with the given name, return the 'N/A' string.[/i]
  function getFromDOM(domNode, nodeName) {
    var nodes = domNode.getElementsByTagName(nodeName);
    return nodes.length==1 ? nodes[0].firstChild.nodeValue : 'N/A';
  }
  [i]//
  // Sets the form's input box with the given name to the value
  // from the value variable.[/i]
  function setInputValueByName(inputName, value) {
    var inputObj = eval('document.theform.' + inputName);
    if (inputObj) inputObj.value = value;
  }
  [i]//-->[/i]
</script>[/pre]