I have written this blog to generate 24 digit alphanumeric key/password while creating the signup form.
CREATE A PHP FILE AND PASTE FOLLOWING CODE INTO IT.
<html>
<body>
<h1><b>ADD VENDOR</b></h1>
<form method="POST" action="#"> [replace # with the file path]
<table>
<tr><td>VENDOR NAME:</td><td><input type="text" name="vendor_name" required></td></tr><tr><td>
<tr><td>
KEY:</td><td><input type="text" name="key_provided" value="<?php echo $password = random_password(24);?>" size="35" required></td><td><a class="myButton" href='insert_vendor_details.php?key=true'>Generate Another KEY</a></td></tr>
<tr>
<td>
<center><input type="submit" value="SUBMIT DETAILS"></center></td>
</tr>
</table>
</form>
<?php
//change length according to need
function random_password( $length = 24 ) {
$chars = "abcdefghijklmnopqrstuvwxyzABCDEFGHIJKLMNOPQRSTUVWXYZ0123456789!@#$%^&*()_-=+;:,.?";
$password = substr( str_shuffle( $chars ), 0, $length );
return $password;
}
if (isset($_GET['key'])) {
random_password();
}
?>
<!– below given is the style sheet. you can change it according to your need–>
<style>
input[type=text], select {
width: 100%;
padding: 12px 20px;
margin: 8px 0;
display: inline-block;
border: 1px solid #ccc;
border-radius: 4px;
box-sizing: border-box;
}
input[type=submit]{
width: 100%;
background-color: #4CAF50;
color: white;
padding: 14px 20px;
margin: 8px 0;
border: none;
border-radius: 4px;
cursor: pointer;
}
input[type=submit]:hover {
background-color: #45a049;
}
div {
border-radius: 5px;
background-color: #f2f2f2;
padding: 20px;
}
.myButton {
-moz-box-shadow: 0px 10px 14px -7px #276873;
-webkit-box-shadow: 0px 10px 14px -7px #276873;
box-shadow: 0px 10px 14px -7px #276873;
background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, #599bb3), color-stop(1, #408c99));
background:-moz-linear-gradient(top, #599bb3 5%, #408c99 100%);
background:-webkit-linear-gradient(top, #599bb3 5%, #408c99 100%);
background:-o-linear-gradient(top, #599bb3 5%, #408c99 100%);
background:-ms-linear-gradient(top, #599bb3 5%, #408c99 100%);
background:linear-gradient(to bottom, #599bb3 5%, #408c99 100%);
filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#599bb3', endColorstr='#408c99',GradientType=0);
background-color:#599bb3;
-moz-border-radius:8px;
-webkit-border-radius:8px;
border-radius:8px;
display:inline-block;
cursor:pointer;
color:#ffffff;
font-family:Arial;
font-size:15px;
font-weight:bold;
padding:13px 32px;
text-decoration:none;
text-shadow:0px 1px 0px #3d768a;
}
.myButton:hover {
background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, #408c99), color-stop(1, #599bb3));
background:-moz-linear-gradient(top, #408c99 5%, #599bb3 100%);
background:-webkit-linear-gradient(top, #408c99 5%, #599bb3 100%);
background:-o-linear-gradient(top, #408c99 5%, #599bb3 100%);
background:-ms-linear-gradient(top, #408c99 5%, #599bb3 100%);
background:linear-gradient(to bottom, #408c99 5%, #599bb3 100%);
filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#408c99', endColorstr='#599bb3',GradientType=0);
background-color:#408c99;
}
.myButton:active {
position:relative;
top:1px;
}
</style>
</body>
</html>