Clear button not clearing textbox field php

Question

Clear button not clearing textbox field php

48 Views Asked by fam At 21 October 2024 at 20:54

I'm creating a simple site since I'm still studying. We have an activity which includes user signup, viewing of records of the signed up users, editing/updating records. In updating, once the user click edit, an update form wil show with its textboxes filled with the values of the row that the user wanted to edit. My problem is when the user click clear button, it's not working, i need to use php for clearing.


<?php
/* Attempt MySQL server connection. Assuming you are running MySQL
server with default setting (user 'root' with no password) */
$link = mysqli_connect("localhost", "root", "", "ortegadb");
 
// Check connection
if($link === false){
    die("ERROR: Could not connect. " . mysqli_connect_error());
}
 
// Attempt select query execution
$id = $_REQUEST["userid"];
$sql = "SELECT * FROM usertb WHERE id=$id";
if($result = mysqli_query($link, $sql)){
    $row = mysqli_fetch_array($result);
            $username = $row["username"];
            $password= $row["password"];
            $fullname = $row["fullname"];
           
    
} else{
    echo "ERROR: Could not able to execute $sql. " . mysqli_error($link);
}
 

// Close connection
mysqli_close($link);
?>  

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Update</title>
    <style>
        body {
            font-family: 'Arial', sans-serif;
            background-color: #f4f4f4;
            margin: 0;
            padding: 0;
            display: flex;
            justify-content: center;
            align-items: center;
            height: 100vh;
        }

        form {
            background-color: #fff;
            padding: 20px;
            border-radius: 8px;
            box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
            max-width: 400px;
            width: 100%;
        }

        input {
            width: 100%;
            padding: 10px;
            margin: 8px 0;
            box-sizing: border-box;
            border: 1px solid #ccc;
            border-radius: 4px;
        }

        input[type="submit"], input[type="reset"] {
            background-color: #4caf50;
            color: white;
            padding: 10px 15px;
            border: none;
            border-radius: 4px;
            cursor: pointer;
        }

        input[type="submit"]:hover, input[type="reset"]:hover {
            background-color: #45a049;
        }
    </style>
</head>
<body>

    <?php
    // Your PHP code here...
    ?>

<form action="updaterecord.php" method="POST">

<h2><center>Update</center></h2> <br>
Userid:
<input type="text" name="id" value="<?php echo $id ?> "><br>
Username
<input type="text" name="uname" value="<?php echo $username ?> "><br>
Full Name:
<input type="text" name="fullname" value="<?php echo $fullname ?> "><br>
Password:
<input type="text" name="pass" value="<?php echo $password ?> "><br>
<input type="submit" name="sbt" value="Update">
<input type="reset" value="Clear">

</form>
</body>
</html>

I tried using javascript but we're not allowed to use it and besides it is still not working. I also tried just making the values "" but not working still.

Original Q&A

There are 1 best solutions below

**Pippo** · Answer 1

You can do it using javascript

First change the reset button with a simple button:

<input id="clear-button" type="button" value="Clear" >

and then add a listener on click:

<script>

    document.addEventListener("DOMContentLoaded", () => {

        document.getElementById("clear-button").addEventListener("click", (e) => {

            e.target.form.querySelectorAll("input:not([type=button]):not([type=submit])").forEach( (el) => {
                el.value = '';
            })
        });

    });

</script>

Clear button not clearing textbox field php

There are 1 best solutions below

Related Questions in PHP

Related Questions in SQL-UPDATE

Related Questions in CLEARTEXT

Trending Questions

Popular # Hahtags

Popular Questions