1

I want to make a datepicker and I use javascript to make the calendar. The code is below:

<html>
<head>
 <link rel="stylesheet" href="http://code.jquery.com/ui/1.10.3/themes/smoothness/jquery-ui.css" />
 <script src="http://code.jquery.com/jquery-1.9.1.js"></script>
 <script src="http://code.jquery.com/ui/1.10.3/jquery-ui.js"></script>
<script>
$(function() {
$( ".datepicker" ).datepicker();
});
</script>
</head>
<body>
    <div class="date-picker">
    <p>From:<input type="text" class="datepicker" /></p><br>
    <p>To  : <input type="text" class="datepicker" /></p>
    </div>
</body>
</html>

If I write this in a html file it works fine, but I want to write it into a php because I also want to use database queries. So, I write the javascript in php like this:

<html>
<head>
 <link rel="stylesheet" href="http://code.jquery.com/ui/1.10.3/themes/smoothness/jquery-ui.css" />
 <script src="http://code.jquery.com/jquery-1.9.1.js"></script>
 <script src="http://code.jquery.com/ui/1.10.3/jquery-ui.js"></script>
<?php
echo '<script>';
echo '$(function() {';
echo '$( ".datepicker" ).datepicker();';
echo '});';
echo '</script>';
?>
</head>
<body>
<?php
echo '<div class="date-picker">';
echo '<p>From:<input type="text" class="datepicker" /></p><br>';
echo '</div>';
?>
</body>
</html>

And it's not working. Any ideas?

5
  • Any errors you see in firebug console etc? Commented Aug 9, 2013 at 11:54
  • 1
    I tested your code. There is no problem. Commented Aug 9, 2013 at 11:56
  • 1
    no need to write multiple echo Commented Aug 9, 2013 at 11:57
  • No, Pushpesh...i don't see any error. I test the code again in a separate php file and it works just fine. I guess it's something with other part of the code but i can't figure out what could be. Commented Aug 9, 2013 at 12:19
  • Found the problem, was this link in the <head>: <script src="ajax.googleapis.com/ajax/libs/jquery/1.7.2/…> . Does anyone know why? Commented Aug 9, 2013 at 13:48

4 Answers 4

1

I'm not sure you understand the client-server architecture correcty:

  1. The php-code is interpreted on a http server that executes the code if a url is requested. The output of the php-code is then sent to the client.
  2. The javascript is executed on the client when the page has been loaded from the server.

The php-part of a web-application (at least in classical designs) does not run simultaneously to the client side javascript code. If you want to do the database stuff on the server side in php and some visual effects/controls by javascript on the client you hava some options:

  1. Generate a javascript in php: You generate the code that is to be executed on the client. This might be filling an array that will be interpreted by the js afterwards.
  2. Deliver a static html-page that contains javascript and that asks the server for php-generated data. This can be achieved using XMLHTTPRequest.
  3. Some other methods exist but are not widely used, communication could be done via WebSockets instead of the XMLHTTPRequest for example.
Sign up to request clarification or add additional context in comments.

Comments

1

Replace $(function() {}) with

  $(document).ready(function() {
    $('.datepicker').datepicker()
  });

Also, you don't need to echo javascript. Remember, php is a template-based language, so you can just pass data in somewhat like that way:

$('<?php echo $selector ?>').width(<?php echo (int) $width ?>);

Comments

1

you can use this code to call the javascript function.

<?

    if ($value eq "") {
    echo "<SCRIPT LANGUAGE="javascript"><!--n";
    echo "datepicker();n";
    echo "// --></SCRIPT>n";
    }

    ?>

Comments

0

Write your script simple as below :

<?php
    echo "<script>
      $(function() {
         $( '.datepicker' ).datepicker();
      });
   </script>";
?>

Comments

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.