Solved

Assign a value generated by a jquery timer to a hidden form variable.

Posted on 2016-09-16
11
50 Views
Last Modified: 2016-09-20
Thank you all in advance!

I would like to assign a value generated by a jquery timer to a hidden form variable and then store it in a MySQL db in the cloud.

The timer works great but the time value is not being passed to the db. A new row is created but the form data is not being written into the column.

Heres the html:

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html><head>
<meta content="text/html; charset=ISO-8859-1" http-equiv="content-type"><title>TimeSubmitTest</title>

</head><body>
<form method="post" action="inserttime.php" name="Time Submit Test"><br>
<input id="start" name="start" value="" type="hidden"> <input id="end" name="end" value="" type="hidden"> <input id="myButton" value="Start" type="button"> <span id="result"></span>
<script type="text/javascript" src="jquery-3.1.0.js"></script>
<script type="text/javascript" src="timer.js"></script><br>
<input name="start" type="hidden"><br><br><input name="end" type="hidden"><br><br><br><br>
<br>
<input name="Submit" value="Submit" type="submit">

$("#start").val(start);
$("#end").val(end);



</form>
<form method="post" action="inserttime.php" name="Time Submit Test"></form></body></html>

Open in new window


Heres the php action page:

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html><head>
<meta content="text/html; charset=ISO-8859-1" http-equiv="content-type"><title>insert.php</title>

<?php $user_name = "*******";
$password = "*****";
$database = "***********";
$server = "***********";
mysql_connect("$server","$user_name","$password");
mysql_select_db("$database");
$order = "INSERT INTO tbl_AuditCntrol (start,end)
VALUES
('$_POST[start]','$_POST[end]')";
$result = mysql_query($order);
if($result){
echo("<h1>
	<br>Your Audit Data Was Submitted Successfully!
	</h1>");
} else{
echo("<br>Input data is fail");
}
?>
</head><body>
<br>
</body></html>

Open in new window

0
Comment
Question by:Victor Nares
  • 4
  • 3
  • 2
  • +1
11 Comments
 
LVL 82

Expert Comment

by:leakim971
ID: 41802199
could you post timer.js
why do you have javascript with no tag line 14 and 15 ?
0
 
LVL 6

Expert Comment

by:Mukesh Yadav
ID: 41802201
There are two problems

1st is this $("#start").val(start);$("#end").val(end); should be wrapped in script tag
<script>$("#start").val(start);$("#end").val(end);</script>

Open in new window


2nd is the way of accessing values from array id not right:
$order = "INSERT INTO tbl_AuditCntrol (start,end) VALUES ($_POST['start'], $_POST['end'])";

Open in new window


And your sql query is sql injectable so try PDO or mysqli if can't implement any of them atleast use mysql_real_escape_string function.
0
 

Author Comment

by:Victor Nares
ID: 41802224
timer.js :

$('#myButton').click(function() {
  var d = new Date();
  var time = d.getHours() + ":" + d.getMinutes() + ":" + d.getSeconds();
  if ($(this).val() === "Start") {
    $('#start').val(time);
    $(this).val("End");
  } else if ($(this).val() === "End") {
    $('#end').val(time);
    $(this).val("Done");
    $('#result').text("Start time: " + $('#start').val() + " and End time: " + $('#end').val());
  }
});

Open in new window

0
 
LVL 6

Expert Comment

by:Mukesh Yadav
ID: 41802230
What is this?
0
 
LVL 82

Expert Comment

by:leakim971
ID: 41802245
rename(or remove its name) your submit button :

<input name="mySubmit" value="Submit" type="submit" />

Open in new window


also, line 20, I see a duplicate form, remove it if it was not a bad copy/paste
0
3 Use Cases for Connected Systems

Our Dev teams are like yours. They’re continually cranking out code for new features/bugs fixes, testing, deploying, testing some more, responding to production monitoring events and more. It’s complex. So, we thought you’d like to see what’s working for us.

 

Author Comment

by:Victor Nares
ID: 41802432
Still no luck:

html:

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html><head>
<meta content="text/html; charset=ISO-8859-1" http-equiv="content-type"><title>Time Submit Form Test</title>

</head><body>
<form method="post" action="submittime.php" name="SubmitTime"><br>
<input id="start" name="start" value="" type="hidden"> <input id="end" name="end" value="" type="hidden"> <input id="myButton" value="Start" type="button"> <span id="result"></span>
<script type="text/javascript" src="jquery-3.1.0.js"></script>
<script type="text/javascript" src="timer.js"></script><br>
<input name="start" type="hidden"><br>
<br>
<input name="end" type="hidden"><br>
<br>
<br>
<br>
<script>$("#start").val(start);$("#end").val(end);</script>
<input name="mySubmit" value="Submit" type="submit">
</form>
</body></html>

Open in new window


and the php

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html><head>
<meta content="text/html; charset=ISO-8859-1" http-equiv="content-type"><title>insert.php</title>

<?php $user_name = "vnares_optum";
$password = "o******";
$database = "*****";
$server = "********";
mysql_connect("$server","$user_name","$password");
mysql_select_db("$database");

$order = "INSERT INTO tbl_AuditCntrol (start,end) VALUES ($_POST['start'], $_POST['end'])";
 



if($result){
echo("<h1>
	<br>Your Audit Data Was Submitted Succesfully!
	</h1>");
} else{
echo("<br>Input data is fail");
}
?>
</head><body>
<br>
</body></html>

Open in new window

0
 
LVL 82

Assisted Solution

by:leakim971
leakim971 earned 250 total points
ID: 41802473
if you replace the method from post to get, are you seeing the start and end and their respective value in the url after clicking the submit button ?

<form method="get" action="submittime.php" name="SubmitTime"><br>
0
 
LVL 82

Expert Comment

by:leakim971
ID: 41802483
another thing is I don't see quotes around : $_POST['start'] and $_POST['end']

what about :
$order = "INSERT INTO tbl_AuditCntrol (start,end) VALUES ('" . $_POST['start'] ."','" . $_POST['end'] . "')";

Open in new window

0
 
LVL 52

Accepted Solution

by:
Julian Hansen earned 250 total points
ID: 41802694
Here is a working solution using mysqli
HTML (superfluous elements removed)
<!DOCTYPE html>
<html>
<head>
<meta content="text/html; charset=ISO-8859-1" http-equiv="content-type"><title>TimeSubmitTest</title>
</head>
<body>
<form method="post" action="inserttime.php" name="Time Submit Test"><br>
  <input id="start" name="start" value="" type="hidden"> <input id="end" name="end" value="" type="hidden" />
  <input id="myButton" value="Start" type="button" /> <span id="result"></span>
  <br/>
  <input name="Submit" value="Submit" type="submit">
</form>

<script src="http://code.jquery.com/jquery.js"></script>
<script>
$(function() {
  $('#myButton').click(function() {
    var d = new Date();
    // Leading 0's
    var time = ("00" + d.getHours()).substr(-2) + 
          ":" + 
          ("00" + d.getMinutes()).substr(-2) + 
          ":" + 
          ("00" + d.getSeconds()).substr(-2);
          
    if ($(this).val() === "Start") {
      $('#start').val(time);
      $(this).val("End");
    } 
    else {
      $('#end').val(time);
      $(this).val("Done");
      $('#result').text("Start time: " + $('#start').val() + " and End time: " + $('#end').val());
    }
  });

});
</script>
</body>
</html>

Open in new window

PHP
(NB You had a missing closing } in your PHP code which would have generated an error)
<!DOCTYPE html>
<html>
<head>
<meta content="text/html; charset=ISO-8859-1" http-equiv="content-type">
<title>insert.php</title>
<?php
$user_name = "*****";
$password = "*****";
$database = "*****";
$server = "*****";
// GET YOUR DATA
$start = empty($_POST['start']) ? false : $_POST['start'];
$end = empty($_POST['end']) ? false : $_POST['end'];

// ASSUME INVALID
$result = "Invalid input";
// IF DATA IS VALID
if ($start && $end) {
  // NB: MySQL LIB HAS BEEN DEPRECATED - DON'T USE IT
  // OPEN CONNECTION TO DB USING MySQLi
  $mysqli = new mysqli($server,$user_name,$password, $database);

  // SANITIZE DATA
  $start = $mysqli->real_escape_string($start);
  $end = $mysqli->real_escape_string($end);

  // CREATE QUERY  
  $order = "INSERT INTO tbl_AuditCntrol (start,end) VALUES ('{$start}','{$end}')";
  $result = $mysqli->query($order);
  // IF QUERY SUCCESSFULL
  if($result){
    // WE ARE IN THE <head> SO DON'T OUTPUT DIRECTLY
    // CREATE RESULT MESSAGE USING HEREDOC AND SAVE
    // IN $result FOR OUTPUT IN THE <body>
    $result = <<< RESULT
<h1>
  <br>Your Audit Data Was Submitted Successfully!
</h1>
RESULT;
  } 
  // QUERY FAILED: SET RESULT MESSAGE
  else {
    $result = "<br>Input data failed";
  }
} // THIS BRACKET WAS MISSING IN YOUR CODE
?>
</head>
<body>
<?php echo $result;?>
</body>
</html>

Open in new window

0
 

Author Closing Comment

by:Victor Nares
ID: 41807352
Once I reviewed the working code provided by Julian, realized their are three languages at work here...and I'll have to review each:

HTML- Form tags not properly set in my code.
PHP- Using deprecated Code to update MySQL db in my code.
JQuery- Generating and Subsequently Assigning values to variables and passing them over.

Switching Action to GET from POST was a great way to trouble shoot what was being passed to the action page. Thank you leakim971!
0
 
LVL 52

Expert Comment

by:Julian Hansen
ID: 41807385
Another option that you can use that does not require changing from POST to GET is to create a reflect.php script. This script will show you everything that was sent to it including files.
reflect.php
<?php
 header('Access-Control-Allow-Origin: *');  

echo "POST\n";
echo "<pre>" . print_r($_POST, true) . "</pre>";
echo "GET\n";
echo "<pre>" . print_r($_GET, true) . "</pre>";
if ($_FILES) {
  echo "FILES\n";
  echo <<< TABLE
  <table class="table">
    <tr>
      <th>ID</th><th>Name</th><th>Type</th><th>Size</th>
TABLE;
  foreach($_FILES as $id => $file) {
    echo <<< ROW
    <tr>
      <td>{$id}</td><td>{$file['name']}</td><td>{$file['type']}</td><td>{$file['size']}</td>
    </tr>

ROW;
    unlink($file['tmp_name']);
  }
}
echo <<< TABLE
  </table>
TABLE;

Open in new window

1

Featured Post

Is Your Active Directory as Secure as You Think?

More than 75% of all records are compromised because of the loss or theft of a privileged credential. Experts have been exploring Active Directory infrastructure to identify key threats and establish best practices for keeping data safe. Attend this month’s webinar to learn more.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Use these top 10 tips to master the art of email signature design. Create an email signature design that will easily wow recipients, promote your brand and highlight your professionalism.
This article explains how to prepare an HTML email signature template file containing dynamic placeholders for users' Azure AD data. Furthermore, it explains how to use this file to remotely set up a department-wide email signature policy in Office …
In this tutorial viewers will learn how to code links for mobile sites that, once clicked, send a call or text to a specified number. For a telephone link (once clicked, calls a number), begin with a normal "<a href=" link tag. For the href, specify…
The viewer will learn how to create a basic form using some HTML5 and PHP for later processing. Set up your basic HTML file. Open your form tag and set the method and action attributes.: (CODE) Set up your first few inputs one for the name and …

895 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question

Need Help in Real-Time?

Connect with top rated Experts

15 Experts available now in Live!

Get 1:1 Help Now