0

我似乎无法让 datepicker (jquery) 在我的引导注册页面中工作。我试图点击，但似乎没有任何反应。我错过了什么吗？请看下面的代码！

来自 jquery > http://jqueryui.com/datepicker/的日期选择器

<?php                  
    require("config.php");
    if(!empty($_POST)) 
    { 
        // Ensure that the user fills out fields 
        if(empty($_POST['username'])) 
        { die("Please enter a username."); } 
        if(empty($_POST['password'])) 
        { die("Please enter a password."); } 
        if(!filter_var($_POST['email'], FILTER_VALIDATE_EMAIL)) 
        { die("Invalid E-Mail Address"); }                                                  
           if(empty($_POST['name'])) 
        { die("Please enter your name."); } 
           if(empty($_POST['gender'])) 
        { die("Please enter your gender."); } 
           if(empty($_POST['dateofbirth'])) 
        { die("Please enter your Date of Birth."); } 
           if(empty($_POST['nric'])) 
        { die("Please enter your NRIC."); } 
           if(empty($_POST['address'])) 
        { die("Please enter your address."); } 
            if(!filter_var($_POST['postalcode'], FILTER_SANITIZE_NUMBER_INT)) 
        { die("Invalid Postal Code"); } 
        if(!filter_var($_POST['mobilenumber'], FILTER_SANITIZE_NUMBER_INT)) 
        { die("Invalid Mobile Number"); } 
           if(empty($_POST['profession'])) 
        { die("Please enter your profession."); } 

       // =====================================================  

        // Check if the username is already taken
        $query = " 
            SELECT 
                1 
            FROM users 
            WHERE 
                username = :username 
        "; 
        $query_params = array( ':username' => $_POST['username'] ); 
        try { 
            $stmt = $db->prepare($query); 

            $result = $stmt->execute($query_params); 

        } 
        catch(PDOException $ex){ die("Failed to run query: " . $ex->getMessage()); } 
        $row = $stmt->fetch(); 
        if($row){ die("This username is already in use"); } 


        $query = " 
            SELECT 
                1 
            FROM users 
            WHERE 
                email = :email 
        "; 
        $query_params = array( 
            ':email' => $_POST['email'] 
        ); 
        try { 
            $stmt = $db->prepare($query);      
            $result = $stmt->execute($query_params); 
        } 
        catch(PDOException $ex){ die("Failed to run query: " . $ex->getMessage());} 
        $row = $stmt->fetch(); 
        if($row){ die("This email address is already registered"); } 



        $query = " 
            SELECT 
                1 
            FROM users 
            WHERE 
                nric = :nric 
        "; 
        $query_params = array( ':nric' => $_POST['nric'] ); 
        try { 
            $stmt = $db->prepare($query);       
            $result = $stmt->execute($query_params); 
        } 
        catch(PDOException $ex){ die("Failed to run query: " . $ex->getMessage()); } 
        $row = $stmt->fetch(); 
        if($row){ die("This NRIC is already in use"); }  


                $query = " 
            SELECT 
                1 
            FROM users 
            WHERE 
                mobilenumber = :mobilenumber 
        "; 
        $query_params = array( ':mobilenumber' => $_POST['mobilenumber'] ); 
        try { 
            $stmt = $db->prepare($query);       
            $result = $stmt->execute($query_params); 
        } 
        catch(PDOException $ex){ die("Failed to run query: " . $ex->getMessage()); } 
        $row = $stmt->fetch(); 
        if($row){ die("This Mobile Number is already in use"); }  





        //---------------------------------------------------- Add row to database 
        $query = " 
            INSERT INTO users ( 
                username, 
                password, 
                salt, 
                email,
                name,
                gender,
                dateofbirth,
                nric,
                address,
                postalcode,
                mobilenumber,
                profession



            ) VALUES ( 
                :username, 
                :password, 
                :salt, 
                :email, 
                :name,
                :gender,
                :dateofbirth,
                :nric,
                :address,
                :postalcode,
                :mobilenumber,
                :profession


            ) 
        "; 

        // Security measures
        $salt = dechex(mt_rand(0, 2147483647)) . dechex(mt_rand(0, 2147483647)); 
        $password = hash('sha256', $_POST['password'] . $salt); 
        for($round = 0; $round < 65536; $round++){ $password = hash('sha256', $password . $salt); } 
        $query_params = array( 
            ':username' => $_POST['username'], 
            ':password' => $password, 
            ':salt' => $salt, 
            ':email' => $_POST['email'], 
            ':name' => $_POST['name'], 
            ':gender' => $_POST['gender'], 
            ':dateofbirth' => $_POST['dateofbirth'], 
            ':nric' => $_POST['nric'], 
            ':address' => $_POST['address'], 
            ':postalcode' => $_POST['postalcode'], 
            ':mobilenumber' => $_POST['mobilenumber'], 
            ':profession' => $_POST['profession'], 
        ); 
        try {  
            $stmt = $db->prepare($query); 

            $result = $stmt->execute($query_params); 
        } 
        catch(PDOException $ex){ die("Failed to run query: " . $ex->getMessage()); } 
        header("Location: successful.php"); 
        die("Redirecting to successful.php"); 
    }                              

?>
<!-- Author: Michael Milstead / Mode87.com
     for Untame.net
     Bootstrap Tutorial, 2013
-->


<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta name="description" content="">
    <meta name="author" content="">
    <link rel="shortcut icon" href="../../assets/ico/favicon.png">

    <title>Sign Up -</title>

    <!-- Bootstrap core CSS -->
    <link href="css/bootstrap.css" rel="stylesheet">

    <!-- Custom styles for this template -->
    <link href="jumbotron.css" rel="stylesheet">

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

    <!-- HTML5 shim and Respond.js IE8 support of HTML5 elements and media queries -->
    <!--[if lt IE 9]>
          <script src="../../assets/js/html5shiv.js"></script>
          <script src="../../assets/js/respond.min.js"></script>
        <![endif]-->
</head>
<body>
    <?php if (empty($_SESSION[ 'user'])) { include_once( "header.php"); } else { include_once( "header2.php"); }?>

    <div class="page-header">
        <div class="container">

            <h1> Register  </h1>

            <form action="register2.php" method="post" role="form">
                <div class="form-group">
                    <label>Username:</label>
                    <input type="text" name="username" value="" maxlength="20" />
                </div>
                <div class="form-group">
                    <label>Email: <strong style="color:darkred;">*</strong>
                    </label>
                    <input type="text" name="email" value="" maxlength="20" />
                </div>

                <div class="form-gtroup">
                    <label>Password:</label>
                    <input type="password" name="password" value="" maxlength="20" />
                    <br />
                    <br />
                </div>

                <div class="form-group">
                    <label>Name:</label>
                    <input type="text" name="name" value="" maxlength="20" />
                </div>


                <div class="form-group">
                    <label>Gender:</label>
                    <div class="radio">
                        <label>
                            <input type="radio" name="gender" id="male" value="male">Male
                        </label>
                    </div>
                    <div class="radio">
                        <label>
                            <input type="radio" name="gender" id="female" value="female">Female
                        </label>
                    </div>
                </div>

                <div class="form-group">
                    <label>Date of Birth:</label>
                    <input type="text" name="dateofbirth" value="" />
                </div>


                <div class="form-group">
                    <label>NRIC:</label>
                    <input type="text" name="nric" value="" maxlength="9" />
                </div>

                <div class="form-group">
                    <label>Address:</label>
                    <input type="text" name="address" value="" maxlength="50" />
                </div>

                <div class="form-group">
                    <label>Postal Code:</label>
                    <input type="text" name="postalcode" value="" maxlength="6" />
                </div>


                <div class="form-group">
                    <div class="input-group">
                        <span class="input-group-addon">+65</span>
                        <input type="text" name="mobilenumber" value="" class="form-control" placeholder="Mobile Number" maxlength="8">
                    </div>
                </div>

                <div class="form-group">
                    <label>Profession:</label>
                    <input type="text" name="profession" value="" maxlength="20" />
                </div>

                <div class="form-group">
                    <label>Date:</label>
                    <input type="text" name="dateofbirth" id="datepicker" value="" />
                </div>

                <input type="submit" class="btn btn-info" value="Register" />
            </form>

        </div>
    </div>

    <?php include_once( "footer.php");?>
</body>
</html>
4

3 回答 3

0

你在打电话

 $(function () {
      $("#datepicker").datepicker();
  });

您有 2 个日期字段，Date of Birth字段和Date字段，其中只有一个具有 id datepicker。此外，如果你想要多个，你应该使用类选择器而不是 id 选择器。

我假设您希望两个 Date of Birth字段都Date使用日期选择器。

将您的 javascript 更改为：

 $(function () {
      $(".datepicker").datepicker();
  });

并将该类添加datepicker到您想要启用的任何输入中，就像这样。我也更改了它，因此两个字段的名称不同dateofbirth

<div class="form-group">
    <label>Date of Birth:</label>
    <input class="datepicker" type="text" name="dateofbirth" value="" />
 </div>

和这个：

<div class="form-group">
    <label>Date:</label>
    <input class="datepicker" type="text" name="date" value="" />
</div>

使用我发布的代码查看这个工作的 JS Fiddle。http://jsfiddle.net/AES54/

这是另一个使用相同 jquery ui js 和 css 链接的小提琴：http: //jsfiddle.net/AES54/1/

于 2013-10-22T17:32:16.243 回答
0

尝试在文档就绪函数中添加脚本，如下所示

$(document).ready(function() {
           $(function() {
                  $( "#datepicker" ).datepicker();
           });
 });
于 2013-10-22T16:36:05.630 回答
0

你probebli有JQuery冲突......你可以做......

1. Declare jquery at header
2. Other Js at footer.

因此，当您初始化 datepicker 时，它可以是 jquery ，然后在初始化后被 bootstrap jquery 在页脚覆盖。

或者

 You can have $.noconflict
于 2015-05-02T11:31:29.083 回答