Jump to content


Photo

jquery calender not working via ajax page load in php

php jquery ajax

  • Please log in to reply
No replies to this topic

#1 websoftexpert

websoftexpert

    Member

  • Members
  • PipPip
  • 21 posts

Posted 26 February 2013 - 03:58 AM

I have html page with calender select input. It is working fine when I open in localhost but I call same code in php page via ajax it is not working. Below is HTML Code

 

 

 

<html>
   <head>
   <link rel="stylesheet" href="http://code.jquery.com/ui/1.9.2/themes/base/jquery-ui.css" />
   <script src="http://code.jquery.com/jquery-1.8.3.js"></script>
   <script src="http://code.jquery.com/ui/1.9.2/jquery-ui.js"></script>
   <script>
      $(function() {
      $( "#datepicker" ).datepicker({
            numberOfMonths: 3,
            showButtonPanel: true
      });
      });
   </script>
   </head>

   <body>
   <input type="text" id="datepicker" />
   </body>
   </html>

 

 

 

If I am call above code in php page and loading that page via ajax the above code not working.

I am using 2 php file delete.php, deleteDateCalender.php

code for delete.php

 

<html>
<head>
<title>test</title>

 <script>

        function deleteCalDateAjax()
        {

        if (window.XMLHttpRequest)
          {// code for IE7+, Firefox, Chrome, Opera, Safari
          xmlhttp=new XMLHttpRequest();
          }
        else
          {// code for IE6, IE5
          xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
          }
        xmlhttp.onreadystatechange=function()
          {
          if (xmlhttp.readyState==4 && xmlhttp.status==200)
             {
                 //alert(xmlhttp.responseText);
                 document.getElementById("calenderDIV").innerHTML=xmlhttp.responseText;
                 //alert(xmlhttp.responseText);
             }
          }

            xmlhttp.open("GET","deleteDateCalender.php",true);
            xmlhttp.send(null); 
        }

 </script>

</head>

<body>

                        <form>
                            <input type="button" value="test" onclick="deleteCalDateAjax();" />
                            <div id="calenderDIV">
                            &nbsp;
                            </div>
                        </form>
</body>
</html> 

 

code for deleteDateCalender.php

 

<input type="text" id="datepicker" />


  <link rel="stylesheet" href="http://code.jquery.com/ui/1.9.2/themes/base/jquery-ui.css" />
 <script src="http://code.jquery.com/jquery-1.8.3.js"></script>
 <script src="http://code.jquery.com/ui/1.9.2/jquery-ui.js"></script>
 <script>
 $(function() {
      $( "#datepicker" ).datepicker({
            numberOfMonths: 3,
            showButtonPanel: true
      });
 });
 </script>

 

 

 

deleteDateCalender.php called on click of test button in delete.php

Can anyone see what is wrong in the above code?

Any help will be appreciated.






0 user(s) are reading this topic

0 members, 0 guests, 0 anonymous users

Cheap Linux VPS from $5
SSD Storage, 30 day Guarantee
1 TB of BW, 100% Network Uptime

AlphaBit.com