diff options
-rw-r--r-- | test/index.php | 66 | ||||
-rw-r--r-- | test/request.js | 38 |
2 files changed, 76 insertions, 28 deletions
diff --git a/test/index.php b/test/index.php index 3b1d7c0..fb6e942 100644 --- a/test/index.php +++ b/test/index.php @@ -1,15 +1,24 @@ <?php + try { + $conn = new PDO("mysql:host=localhost;dbname=testdb", "testuser", "testpass"); + $conn->setAttribute(PDO::ATTR_ERRMODE, PDO::ERRMODE_EXCEPTION); + } + catch (PDOException $e) { + echo $e->getMessage(); + } if ($_SERVER["REQUEST_METHOD"] == "POST" && isset($_POST["name"]) && isset($_POST["date"]) && isset($_POST["time"])) { # values will always be set, check if they are empty... echo "<strong>Information submitted!</strong><br>"; echo "<strong>Date: " . date('Y-m-d H:i:s') . "</strong><br>"; + echo "<strong>User date: " . $_POST["date"] . "</strong><br>"; + echo "<strong>User time: " . $_POST["time"] . "</strong><br>"; + //$toDT='2020-10-10 12:00:00'; + $toDT=$_POST["date"] . " " . $_POST["time"] . ":00"; + echo "<strong>$toDT</strong><br>"; try { - $conn = new PDO("mysql:host=localhost;dbname=testdb", "testuser", "testpass"); - $conn->setAttribute(PDO::ATTR_ERRMODE, PDO::ERRMODE_EXCEPTION); $stmt = $conn->prepare("INSERT INTO tbl1 (`name`, `from`, `to`) VALUES (:name, :from, :to)"); $stmt->bindParam(':name', $_POST['name']); $stmt->bindParam(':from', date('Y-m-d H:i:s')); - $toDT='2020-10-10 12:00:00'; $stmt->bindParam(':to', $toDT); $stmt->execute(); } @@ -24,6 +33,9 @@ if ($_SERVER["REQUEST_METHOD"] == "POST" && isset($_POST["name"]) && isset($_POS <meta charset="UTF-8"> <title>Test table</title> <style> + #notice { + color: red; + } table { border-collapse: collapse; } @@ -31,28 +43,25 @@ if ($_SERVER["REQUEST_METHOD"] == "POST" && isset($_POST["name"]) && isset($_POS border: 1px solid black; padding: 0.3rem; } -</style> -<script> -function subAction(action) { - var xhttp = new XMLHttpRequest(); - - xhttp.onreadystatechange = function() { - if(this.readyState == 4 && this.status == 200) { - console.log(this.responseText); - } + tbody tr:nth-child(even) { + background-color: #ccc; } - /* - xhttp.onload = function() { - console.log(this.responseText); + thead { + color: white; + background-color: black; } - */ - xhttp.open("POST", "edit.inc.php", true); - xhttp.setRequestHeader("Content-type", "application/x-www-form-urlencoded"); - xhttp.send("action=" + action); -} -</script> + .edit { + padding: 2px; + border-top: 1px solid #333; + border-left: 1px solid #333; + border-bottom: 1px solid #666; + border-right: 1px solid #666; + border-radius: 3px; + } +</style> </head> <body> +<p id="notice"></p> <form method="post"> <label for="name">Name: </label> <input type="text" name="name" id="name"> @@ -69,15 +78,15 @@ function subAction(action) { try { echo "<table>\n"; echo "<thead><tr><th>ID</th><th>From</th><th>To</th><th>Name</th><th>Actions</th></tr></thead><tbody>\n"; - foreach ($conn->query("SELECT * FROM tbl1") as $row) { + foreach ($conn->query("SELECT * FROM tbl1 ORDER BY `id` DESC") as $row) { echo "<tr><td>" . $row['id'] . "</td>"; - echo "<td>" . $row['from'] . "</td>"; - echo "<td>" . $row['to'] . "</td>"; - echo "<td contenteditable=\"true\">" . $row['name'] . "</td>"; + echo "<td><div contenteditable=\"true\" class=\"edit\">" . $row['from'] . "</div></td>"; + echo "<td><div contenteditable=\"true\" class=\"edit\">" . $row['to'] . "</div></td>"; + echo "<td><div contenteditable=\"true\" class=\"edit\">" . $row['name'] . "</div></td>"; echo "<td>"; - echo "<button onclick=\"subAction('save')\">Save</button>"; - echo "<button onclick=\"subAction('cancel')\">Cancel</button>"; - echo "<button onclick=\"subAction('delete')\">Delete</button>"; + echo "<button onclick=\"subAction('save', this)\">Save</button>"; + echo "<button onclick=\"subAction('cancel', this)\">Cancel</button>"; + echo "<button onclick=\"subAction('delete', this)\">Delete</button>"; echo "</td></tr>\n"; } echo "</tbody></table>\n"; @@ -86,5 +95,6 @@ catch (PDOException $e) { echo $e->getMessage(); } ?> +<script src="request.js"></script> </body> </html> diff --git a/test/request.js b/test/request.js new file mode 100644 index 0000000..bfcf592 --- /dev/null +++ b/test/request.js @@ -0,0 +1,38 @@ +function subAction(action, btn) { + trDom = btn.parentElement.parentElement; + trData = trDom.children; + + trId = trData[0].innerHTML; + trFrom = trData[1].innerHTML; + trTo = trData[2].innerHTML; + trName = trData[3].innerHTML; + + console.log(trId); + console.log(trFrom); + console.log(trTo); + console.log(trName); + + //for (var i = 0, len = trData.length - 1; i < len; i++) { + //console.log(i + ": " + trData[i].innerHTML); + //} + + if (action == 'delete') + if (confirm("Are you sure you want to delete this reservation?")) + trDom.remove(); + + // Send XHR + var xhttp = new XMLHttpRequest(); + xhttp.onreadystatechange = function () { + if (this.readyState == 4 && this.status == 200) { + document.getElementById("notice").innerHTML = this.responseText; + } + } + xhttp.open("POST", "edit.inc.php", true); + xhttp.setRequestHeader("Content-type", "application/x-www-form-urlencoded"); + data_str = "action=" + action + data_str += "&id=" + trId + data_str += "&from=" + trFrom + data_str += "&to=" + trTo + data_str += "&name=" + trName + xhttp.send(data_str); +} |