How to get variables to pass to javascript math.random

Question

So I am just totally clueless how to make this happen. Hoping someone could provide some guidance. I have built a chat system that allows random rolls of dice (for a D&D game). Within the chat div I have a form that allows to select the quantity of dice, as well as the dice type (ie. 4 sides, 6 sided, 10 sided, etc.). It then passes the form input with php into a chat.txt file. I am using ajax to display the chat.txt in the chat div.

So when I originally started I made it function for 1d20 (1 20 sided dice). And used x.value=Math.floor((Math.random()*20)+1) to make it pick a random number between 1 and 20. Well now I need it to be able to detect the quantity of dice, as well as the amount of sides of the dice(d4, d6, d8). Is there a way to pass the quantity and dice variables into the math.random ? and even better yet, then display each number separately (meaning say you roll 2 d6 and get a 5 and a 3. I would like to have it display the 5 and 3 separately. But that is not totally needed, mostly i need to know how to get different random ranges based on the $quantity and $dice. Or maybe a totally different approach that would work? Any and all help is much appreciated.

<div id="pageWrap">

<div id="expander"> Expand</div>

<?php
if(isset($_POST['submit']))//on submit
{
    $roll = $_POST['roll'];
    $quantity= $_POST['quantity'];
    $dice = $_POST['dice'];
    $nickname = htmlentities(strip_tags($_POST['nickname']));
    $file = fopen('chat.txt', 'a');
    fwrite($file, "<span>". $nickname . " :</span>" . $roll = str_replace("\n", " ", "    <em> Rolls </em>$quantity $dice <em>for</em> $roll") . "\n");
    fclose($file);
}
?>

<form action="" id="rollBox" name="rollBox" method="post">
    <input type="text" name="roll" id="demo">
    <input type="number" name="quantity" min="1" max="10">
    <select name="dice">
        <option value="d4">d4</option>
        <option value="d6">d6</option>
        <option value="d8">d8</option>
        <option value="d10">d10</option>
        <option value="d12">d12</option>
        <option value="d20">d20</option>
    </select>
    <button type="submit" name="submit" >Roll</button>
</form>

<script>
$(document).ready(function () {
$('#rollBox').submit(function(e) {
var x=document.getElementById("demo")
x.value=Math.floor((Math.random()*20)+1);
e.preventDefault();
var obj = $(this), // (*) references the current object/form each time
                        url = obj.attr('action'),
                        method = obj.attr('method'),
                        data = {};
                        obj.find('[name]').each(function(index, value) {
                        var obj = $(this),
                            name = obj.attr('name'),
                            value = obj.val();
                        data[name] = value;
                    });
$.ajax({
                        url: url,
                        type: method,
                        data: data,
                        success: function(response2) {}
                        });
                        return false; 
});
});

</script>
</form>
<p id="name-area"></p>
<div id="chatWrap"><div id="chat-area"></div></div>

<form id="send-message-area">
    <p>Your message: </p>
    <textarea id="sendie" maxlength = '200' ></textarea>
</form>

</div>

There is no such option, for each dice you have to make separate roll — dev-null-dweller
– dev-null-dweller, Commented Jan 1, 2014 at 21:56
Ok, so say I made it roll a differently based on the dice option selected. Could I some how pass the quantity? — doriansm
– doriansm, Commented Jan 1, 2014 at 21:57
well, as far as i know math.random doesn't take parameters, so a way to do this is to make a loop based on the number of dices and apply the type of each time in each iteration to generate the random, add the result to an array and return the array back to be displayed. An example on a sample user input and desired result would be helpful. — Mohammed Joraid
– Mohammed Joraid, Commented Jan 1, 2014 at 22:04
@MohammedJoraid Ok well basically it's a form that asks the user to select the number of dice (allows between 1 and 10) and then a <select> where each option is a different dice with a different amount of sides. So say the user enters 2 and d10. It should then display "User rolls 2 d10 for (insert random numbers for each 10 sided dice (2 numbers between 1 and 10)). Any code examples would be VERY appreciated. — doriansm
– doriansm, Commented Jan 1, 2014 at 22:09
so the user can choose x number of dices x [1-10] each with different number of faces y (2-10)? and then you want to get x random numbers each between y min and y max e.g I would select 6 dices with different faces d3, d4, d5, d6,d7,d8 and receive random[2,1,5 , 6 , 7 , 8] — Mohammed Joraid
– Mohammed Joraid, Commented Jan 1, 2014 at 22:10

Ahmed Siouani · Accepted Answer · 2014-01-01 23:55:47Z

2

This function takes number of dices and dice type and will return an array filled with random number. However, what you need is loop, javascirpt loop to loop thru the number of dices and get a random value for each dice.

 function getRandome (num_dice , dice_type) {
    var result=[];
    for (var i = 0 ; i < num_dice; i++) {
        result[i] = Math.floor((Math.random()*dice_type)+1)
    }    

    return result;

}

It's up to you how you want to get the input values, but here's a FULL ANSWER JS FIDDLE

now let's see this example

var num_dice = 5;// number of dices
var dice_type = 3;//3 faces
var randomArray = [] ;//will store the random result here as an array
 randomArray  =  getRandome (num_dice , type );
var randomString  = randomeArray.join(",");//convert the array to string adding a comma "," between indexes;  
//assign the string result of random to a text field, div, span etc
$("#demo").val(randomString);//jquery
//OR
document.getElementById("demo").value = randomString;//javascript

edited Jan 1, 2014 at 23:55

Ahmed Siouani

13.9k12 gold badges63 silver badges73 bronze badges

answered Jan 1, 2014 at 22:16

Mohammed Joraid

6,5802 gold badges29 silver badges38 bronze badges

Sign up to request clarification or add additional context in comments.

8 Comments

doriansm Over a year ago

Ok awesome that is exactly what I am looking for. Now I just need to figure out how to integrate it into my code.

Mohammed Joraid Over a year ago

glad to help, lemme know if u need anything else :P

doriansm Over a year ago

I just have one more question on this. Previously it was sending the random number to the #demo text box. This would then take the text in the demo text box and add it as the $roll php variable. With your code, how could I get it back into that demo text box? I see it is saving the random numbers as "result" currently.

Mohammed Joraid Over a year ago

a small suggestion, a good practice is to make ur html elements have the same name/id identifier so u won't get confused. as for your question, you want to display the random result in the #demo text box?if so then use this line document.getElementById("demo").value = "YouValueHERE"; or if u r using jquery then $("#demo").val("YouValueHERE");

Mohammed Joraid Over a year ago

ok i edited my last comment, additionally i will add the details to the answer.

|

Collectives™ on Stack Overflow

How to get variables to pass to javascript math.random

1 Answer 1

8 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

8 Comments

Your Answer

Sign up or log in

Post as a guest

Related