{source}
<?php
include(JPATH_SITE . '/tools/password_generator/index.php');
?>
{/source}

---

Required:
1. jQuery v1.12.4 and above
2. Bootstrap

index.php:

<div id="form_click" class="row">
	<input id="password" style="width: 90%; height: 100px !important; margin: auto; font-size: 50px; text-align: center;" type="text" class="form-control col-12">
	<div id="button" class="text-center">
		<input id="generate" class="btn btn-success" type="submit" value="Generate"/>
		<input id="copy" class="btn btn-info" type="submit" value="Copy"/>
	</div>
</div>
<strong>Options:</strong>
<div class="form-group row">
	<div class="col-md-12 text-center">
		<span>Password Length</span>
		<input id="length" style="width: 50px; margin: auto; text-align: center;" type="text" class="form-control" value="15" placeholder="Password length">
	</div>
	<div class="col-md-6">
		<div class="form-check">
			<div class="col-12">
				<span>Numbering</span>
			</div>
			<div class="col-12">
				<input id="numbering" class="form-check-input" style="margin-top: 6px;" type="checkbox" checked>
				<label class="form-check-label" style="margin-left: 20px;" for="numbering">0123456789</label>
			</div>
		</div>
		<div class="form-check">
			<div class="col-12">
				<span>Special</span>
			</div>
			<div class="col-12">
				<input id="special" class="form-check-input" style="margin-top: 6px;" type="checkbox" checked>
				<label class="form-check-label" style="margin-left: 20px;" for="special">~!@#$%^&amp;*()_+-.</label>
			</div>
		</div>
	</div>
	<div class="col-md-6">
		<div class="form-check">
			<div class="col-12">
				<span>Lowercase</span>
			</div>
			<div class="col-12">
				<input id="lowercase" class="form-check-input" style="margin-top: 6px;" type="checkbox" checked>
				<label class="form-check-label" style="margin-left: 20px;" for="lowercase">abcdefghijklmnopqrstuvwxyz</label>
			</div>
		</div>
		<div class="form-check">
			<div class="col-12">
				<span>Uppercase</span>
			</div>
			<div class="col-12">
				<input id="uppercase" class="form-check-input" style="margin-top: 6px;" type="checkbox" checked>
				<label class="form-check-label" style="margin-left: 20px;" for="uppercase">ABCDEFGHIJKLMNOPQRSTUVWXYZ</label>
			</div>
		</div>
	</div>
	<div class="col-md-12">
		<input id="exclude" style="width: 400px; margin: auto; text-align: center;" type="text" class="form-control" placeholder="Exclude any character here">
	</div>
</div>
<strong>Output:</strong>
<div id="output" class="row">
</div>
<script>
jQuery(function($) {
	$('body').on('click', '#generate', function(event) {
		$('#form_click').loading();
		if ($('#numbering').is(':checked')) { var numbering = '1'; } else { var numbering = '2'; }
		if ($('#special').is(':checked')) { var special = '1'; } else { var special = '2'; }
		if ($('#lowercase').is(':checked')) { var lowercase = '1'; } else { var lowercase = '2'; }
		if ($('#uppercase').is(':checked')) { var uppercase = '1'; } else { var uppercase = '2'; }
		
		var length = $('#length').val();
		var exclude = $('#exclude').val();
		
		$.ajax({
			type: "POST",
			url: "ajax.php?",
			data: "numbering=" + numbering + "&special=" + special + "&lowercase=" + lowercase + "&uppercase=" + uppercase + "&length=" + length + "&exclude=" + exclude,
			success: function(data) {
				var parameters = JSON.parse(data);
				$('#password').val(parameters.password);
				$('#form_click').loading('stop');
				$('<div class="col-md-4 text-center">' + parameters.password + '</div>').appendTo('#output')
			}
		});
	});
	$('body').on('click', '#copy', function(event) {
		event.preventDefault();
		var password = $("#password").val();
		var dummy = $('<textarea>').val(password).appendTo('body').select();
		document.execCommand("copy");
		dummy.remove();
		alert('Password <strong>' + password + '</strong> has been copied to clipboard.');
	});
});
</script>

ajax.php:

<?php

if(!$_SERVER['HTTP_X_REQUESTED_WITH']) {
    header("HTTP/1.0 403 Forbidden");
    exit;
}

$length = $_POST['length'];
$numbering = $_POST['numbering'];
$special = $_POST['special'];
$lowercase = $_POST['lowercase'];
$uppercase = $_POST['uppercase'];
$exclude = preg_split('/(?<!^)(?!$)/u', $_POST['exclude']);

if ($numbering == '1') { $numbering = '0123456789'; } else { $numbering = ''; }
if ($special == '1') { $special = '~!@#$%^&amp;*()_+-.'; } else { $special = ''; }
if ($lowercase == '1') { $lowercase = 'abcdefghijklmnopqrstuvwxyz'; } else { $lowercase = ''; }
if ($uppercase == '1') { $uppercase = 'ABCDEFGHIJKLMNOPQRSTUVWXYZ'; } else { $uppercase = ''; }

$characters = str_replace($exclude, "", $numbering . $special . $lowercase . $uppercase);

$password = '';
for($i = 0; $i < $length; $i++) {
	$rand = rand(0, strlen($characters) - 1);
	$password .= substr($characters, $rand, 1);
}

$array = array('password' => $password);

echo json_encode($array);

?>