How to get a form using AJAX, JSON and PHP when changing a value in a select box?

Question

I have a select field, when I select a value in it, I need to display a form in which there is a Date field that includes the functionality of the javascript calendar. I tried it with the usual combination of AJAX and PHP, but I don't get a calendar in it, so I just need to know how I can do this using JSON and AJAX and PHP?

thank

Every help is appreciated ....

THE CODE

This is the Javascript that I use for the AJAX function:

<script>
function Inint_AJAX() {
try { return new ActiveXObject("Msxml2.XMLHTTP");  } catch(e) {} //IE
try { return new ActiveXObject("Microsoft.XMLHTTP"); } catch(e) {} //IE
try { return new XMLHttpRequest();          } catch(e) {} //Native Javascript
alert("XMLHttpRequest not supported");
return null;
};
function dochange(path,val) {
var req = Inint_AJAX();
req.onreadystatechange = function () {
 if (req.readyState==4) {
      if (req.status==200) {
            document.getElementById('docfields').innerHTML="";
            if(req.responseText != ''){
           document.getElementById('docfields').innerHTML=req.responseText; //retuen value
            }else{
            document.getElementById('docfields').innerHTML="<br>&nbsp;\t<font size='2'><b>No Fields Available</b></font>";
            }
      }
 }
};
req.open("GET", path+"getDocFields.php?doctype_id="+val); //make connection
req.setRequestHeader("Content-Type", "application/x-www-form-urlencoded;charset=iso-8859-1"); // set Header
req.send(null); //send value
}
</script>

Below is the HTML form that I need to display using the Calendar (tcal) object created in the script tag:

<form onsubmit="" action="" method="post" name="newdoc">
         <table border="0" style="border: medium none;" id="docfield">
          <tbody>
          <tr>
            <td style="border-right: medium none;">
                Date
            </td>
         <td style="border-right: medium none;">
            <input type="text" value="" maxlength="10" name="Test" style="width: 100px;" id="date">
        <script>
         new tcal ({  
      'formname': 'newdoc',  
      'controlname': 'Test'
         });
     </script>
        </td>
     </tr>
    </tbody>
 </table>
</form>

I do not get a calendar ...

Answer 1

javascrip html, , html ajax. javascript

new tcal ({
'formname': 'newdoc',
'controlname': 'Test'
});

, XMLHttpRequest '#docfields'.

if (req.readyState==4)
{
   if (req.status==200)
   {
      document.getElementById('docfields').innerHTML="";
      if(req.responseText != '')
      {
          document.getElementById('docfields').innerHTML=req.responseText; //retuen value
          /** here **/
          new tcal ({'formname': 'newdoc','controlname': 'Test'});
          /** here **/
      }
      else
      {
          document.getElementById('docfields').innerHTML="No Fields Available";
      }
   }
}

, .

Answer 2

. . :

var scripts = "";
$('form)'.find("script").each(function() {
            var content = $(this).html();
            content = content.replace(/<!--/g, "").replace(/(\/\/)?-->/g, "");
            scripts += content;
        });
eval (scripts); // eval is evil, but in this case...