This should give you an idea how to do it. As you can see, AJAX is the key.
Note that $.post()
is almost identical to using $.ajax()
-- but $.post()
has a few settings hard-coded. The structure that I used is usually easiest when starting out, and then move on to the other formats, promise-based, etc.
Sorry, cannot do a jsFiddle for this because AJAX won't work over jsFiddle. However, this answer is completely stand-alone. Just copy/paste it into two files and run:
index.php (or whatever you wish to name it)
your_php_processor.php (if rename file, must also rename it in the ajax code block)
HTML and Javascript/jQuery:
<html>
<head>
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
<script type="text/javascript">
$(document).ready(function() {
var numrolls, ta;
$('#txtArea').attr({'disabled':'disabled'});
$('#gobutt').click(function() {
numrolls = $('#rollnum').val();
$('#txtArea').html('Results of ' +numrolls+ ' automated rolls:\r\n\r\n');
$.ajax({
type: "POST",
url: "your_php_processor.php",
data: 'rolls=' + numrolls,
success:function(data){
ta = $('#txtArea').val() + '\r\n';
$('#txtArea').val(ta + data);
}
});
});
}); //END $(document).ready()
</script>
</head>
<body>
Number of rolls to automate:<br>
<input type="text" id="rollnum" /><input type="button" id="gobutt" value="Go!" /><br>
<br>
Results:<br>
<textarea id="txtArea" rows="20" cols="30" ></textarea>
</body>
</html>
your_php_processor.php
<?php
$rr = $_POST['rolls'];
$all = '';
for ($i=1; $i<=$rr; $i++) {
$rand = mt_rand(1, 6);
$all .= $rand . "\r\n";
}
echo $all;
For more info/examples re AJAX, see the simple examples in this SO post
You may also find the comments following this article to be of interest as they discuss the legality of using various built-in random number generators.