SitePoint Sponsor

User Tag List

Results 1 to 5 of 5
  1. #1
    SitePoint Zealot
    Join Date
    Apr 2003
    Location
    canada
    Posts
    126
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    passing javascript variable to hidden field

    Hello,

    2 days of research and trying not working out.. maybe come one can help..
    working on a jquery calender script and passing the results to a hidden file but its not working ou...

    2 input fields.
    date input fields, works
    hidden1 input field not working.. not passing the variable.

    Code:
    <html>
    	<head>
    		<meta charset="utf-8" />
    		<title>jQuery UI Datepicker </title>
    		<script type="text/javascript" src="jquery.js"> </script>
    		<script type="text/javascript" src="jquery-ui-1.10.3/ui/jquery-ui.js"> </script>
    		<link rel="stylesheet" type="text/css" href="jquery-ui-1.10.3/themes/base/jquery-ui.css" />
    		
    		<script type="text/javascript">		
    		   $(document).ready(function(){                
                 $("#date").datepicker({
                    showButtonPanel: true,
                    minDate: '0M',
                    maxDate: '+90D',    
                    dateFormat: "d-MM-yy",  
                    }).onBlur(function(){
                    var dateString = $( "#date" ).datepicker( "getDate" );
                    var timestamp = Date.parse(dateString).getTime()/1000; 
                    $('#hidden1').val( timestamp ); 
                  });          
           });
    		</script>
    	</head>
    	<body>
    	<div> 
    		<form action="<?php echo htmlspecialchars($_SERVER["PHP_SELF"]);?>" method="POST" >
    			<p> Enter expire date: <br />
    			<input type="text" name="date" id="date"/></p>	
    			<input type="hidden" name="hidden1" id="hidden1" value=""  />				
    			<button type="submit" name="btn_test" >Test Button</button>
    		</form>
    	</div>
    	</body>
    </html>

  2. #2
    SitePoint Wizard
    Join Date
    Mar 2001
    Posts
    3,537
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    1) There is no jquery function named onBlur(). And the recommended way to set event handlers is with the on() method.

    2) Date.parse() returns an integer; integers do not have a getTime() method.

    3) The datepicker still doesn't work correctly if I pick the earliest date: The method

    Code:
    $( "#date" ).datepicker( "getDate" )
    returns null.

    3) Your writing ability is atrocious. I suggest you quit all programming until you can write a grammatically correct sentence.

  3. #3
    SitePoint Wizard
    Join Date
    Mar 2001
    Posts
    3,537
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by 7stud View Post

    3) The datepicker still doesn't work correctly if I pick the earliest date: The method

    Code:
    $( "#date" ).datepicker( "getDate" )
    returns null.
    The problem is more serious than that. The onblur event fires as soon as you click on a date in the datepicker--which apparently occurs before datepicker("getDate") can retrieve the selected date, and therefore it returns null.

  4. #4
    SitePoint Wizard
    Join Date
    Mar 2001
    Posts
    3,537
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    You can use the onSelect option of the datepicker to get around the problems with the onblur event.

  5. #5
    SitePoint Zealot
    Join Date
    Apr 2003
    Location
    canada
    Posts
    126
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Ok...

    It took me awhile, almost a week to find the answers to the script I was working on so having said that ill post what I have in the event someone else is searching for same script.

    I had 3 objectives:
    1. display a readable date format, example, 22-june-2013. For the visiting user.
    2. convert the date to a timestamp format. For db use.
    3. save to db.

    The challenge was with the second objective. All thou, for the most part the script works but for some reason the time seems to be stuck at 04:00:00. If anyone can point out why the difference in time, it would be greatly appreciated.

    Example output at 11:21pm
    2013-06-29 04:00:00 - date is correct. Time out of focus.



    <?php
    include('connectionv2.php');

    if(isset($_POST['btn_test']))
    { $ts = $_POST['hidden1'];
    $date = new DateTime("@$ts");
    //echo $saveDate = $date->format('U = Y-m-d H:i:s');
    echo $saveDate = $date->format('Y-m-d H:i:s');
    echo '<br />';

    $db = Connection::getConnection();
    try
    { $STH = $db->prepare("INSERT INTO tbl_servicerequest (projectexpire ) VALUES expirydate )");
    $STH->bindParam(':expirydate', $saveDate);
    //$STH->execute();
    }
    catch(PDOException $e) { echo 'ERROR: ' . $e->getMessage(); }
    }
    ?>

    <html>
    <head>
    <meta charset="utf-8" />
    <title>jQuery UI Datepicker </title>
    <script type="text/javascript" src="jquery.js"></script>
    <script type="text/javascript" src="jquery-ui-1.10.3/ui/jquery-ui.js"> </script>
    <link rel="stylesheet" type="text/css" href="jquery-ui-1.10.3/themes/base/jquery-ui.css" />

    <script type="text/javascript">
    $(document).ready(function(){
    $("#date").datepicker({
    showButtonPanel: true,
    minDate: '0M',
    maxDate: '+90D',
    dateFormat: "d-MM-yy",
    onSelect : function(dateText, inst)
    { var timeStamp = $.datepicker.formatDate('@', $(this).datepicker('getDate')) / 1000;
    $('#hidden1').val(timeStamp);
    }
    });
    });
    </script>

    </head>
    <body>
    <div>
    <form action="<?php echo htmlspecialchars($_SERVER["PHP_SELF"]);?>" method="POST" >
    <p> Enter expire date: <br />
    <input type="text" name="date" id="date"/></p>
    <input type="hidden" name="hidden1" id="hidden1" value="" />
    <button type="submit" name="btn_test" >Test Button</button>
    </form>
    </div>
    </body>
    </html>


Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •