Run through for loop and randomly change values of variable within a range but satisfy all variables

Question

So what I have is a quiz which is generated dynamically. I want the quiz questions to be ordered randomly. Basically, the i is going from 0 to the length of answerArray. I want it to do this, but not in order randomly. For instance: instead of 0,1,2,3,4,5 I want 1,0,2,3,5,4. I have tried doing this but all of my attempts failed. It would be very helpful if I could do this so the test questions would not always be in order. Thank you.

var displayAnswers = function (){
for (var i = 0; i<answerArray.length;i++){
var row1= document.createElement("div");
$(row1).addClass("row");
var colmd= document.createElement("div");
$(colmd).addClass("row");
$(colmd).addClass("text-center");
$(colmd).addClass("rowtxt");
$(colmd).attr('id',"questionTxt"+[i+1]);
$("#contain").append(row1)
$(row1).append(colmd);
var answer = answerArray[i];
}

What does your `answerArray` look like? Give an example, maybe? — Ramsay Smith, Nov 17 '15 at 22:34

score 1 · Accepted Answer · edited May 23 '17 at 10:27

You can use accepted answer in the following question Generate unique random numbers between 1 and 100, that will generate the random numbers first and store them in array and use them inside for loop.

Example :

var arr = [];
var answerArray = ["Answer 1", "Answer 2", "Answer 3"];

while( arr.length < answerArray.length ){
    var randomnumber=Math.ceil( Math.random() * answerArray.length)
    var found=false;
    for(var i=0;i<arr.length;i++){
        if(arr[i]==randomnumber){found=true;break}
    }
    if(!found)arr[arr.length]=randomnumber;
}

Now you have an array of unique numbers between 0 and answerArray length, you can use it inside the loop just by calling arr[i] :

var displayAnswers = function (){
    for (var i = 0; i<answerArray.length;i++){
        var row1= document.createElement("div");
        $(row1).addClass("row");
        var colmd= document.createElement("div");
        $(colmd).addClass("row");
        $(colmd).addClass("text-center");
        $(colmd).addClass("rowtxt");
        $(colmd).attr('id',"questionTxt"+[i+1]);
        $("#contain").append(row1)
        $(row1).append(colmd);

        //Here you get the unique number between 0 and answers length
        var random_number = arr[i]; 

        var answer = answerArray[random_number];
    }
}

Hope this helps.

score 0 · Answer 2 · answered Nov 17 '15 at 22:39

I would start by thinking about what you need to do.

You want to track what numbers you have used already and getting a new number if you have already used the one generated.

Try something like this.

// The initial array
var Array = [1,2,3,4,5];

// The new array or tracking array
var Used = [];

// A function to generate the random index
// We need a function so we can call it if
// the index already exists to ensure we have
// the same amount of values as the inital 
// array
function addRandomNum(array) {
    var random = Math.floor((Math.random() * Array.length) + 1);    
    if(array.indexOf(random) === -1){
        array.push(random);
    } else {
        addRandomNum(array);
    }
};

// Loop the inital array calling the function
for(var i = 0; i < Array.length; i++){
    addRandomNum(Used);
}

// Look at the new randomized array
console.log(Used);

score 0 · Answer 3 · answered Nov 17 '15 at 22:41

You could shuffle the array, if that is what you want. There are shuffle functions if you follow this link of css-tricks: https://css-tricks.com/snippets/javascript/shuffle-array/

I like technique 2. Which uses the sort function to randomly create a negative or positive number which will sort the items according to the returned value. If the returned value is positive, the first item will precede the second that is passed to the function. As you can see, the parameters are unused because we don't want a logic sort but a randomized based on a random number.

You could call it like this:

answerArray.sort(function(item1, item2) { return 0.5 - Math.random() });

score 0 · Answer 4 · edited Nov 17 '15 at 23:06

Ok, I will assume a few things. Your answerArray looks like this:

var answerArray = [
    {
        "q_id": "1",
        "prompt": "Is StackOverflow awesome?",
        "a1": "Yes",
        "a2": "No",
        "correct": "a1"
    }
];

First add a property like this

   "random": Math.floor(Math.random() * 101)

This will create a random number that you can use to sort the array, like so:

answerArray.sort(function(a, b) {
    return parseFloat(a.random) - parseFloat(b.random);
});

This way you can sort the questions randomly.

Run through for loop and randomly change values of variable within a range but satisfy all variables

4 Answers4