I've programmed a simple dice roller but when I append the values to the div, they show up for a split second and then disappear. It only does it for the custom roll section where you input data (ex: 2d20+3d20) into a form and submit.
Here's where I generate the values. I don't expect the problem to be here as you can see all the values for a split second unless maybe it's something in the way that diceUpdate() is called.
(Note: This is only wrapped in PHP tags to make distinguishing the code simpler)
PHP Code:
//Custom Rolls
$("#diceCustom").submit(function() {
var rollText = $("#diceCustomText").val();
//Splits the string into separate dice rolls
var rollSplit = rollText.split(",");
for (var a = 0; a < rollSplit.length; a++) {
//Splits rolls that require addition
var additionSplit = rollSplit[a].split("+");
var diceTotal = 0;
for (var e = 0; e < additionSplit.length; e++) {
//Splits each individual roll into sides and number of dice
var diceSplit = additionSplit[e].split("d");
diceTotal = diceTotal + diceRoll(diceSplit[0], diceSplit[1]);
}
diceUpdate(rollSplit[a], diceTotal);
}
});
And here is the portion of code that actually updates the div to display the value:
PHP Code:
function diceUpdate(dice, total) {
var rollUpdate = '<span style="color: #000;"><b>' + total + '</b> : ' + dice + '</span><br>';
$("#diceWindowDiceRolls").append(rollUpdate);
$("#diceWindowDiceRolls").animate({scrollTop: $("#diceWindowDiceRolls").prop("scrollHeight")}, 10);
}
The really interesting thing is that I have single quick rolls setup and they work properly:
PHP Code:
//Quick Rolls
$("div.dice").click(function() {
var sides = $(this).attr("value");
var roll = diceRoll(1, sides);
if (roll == sides) {
var rollColor = '0F0';
} else if (roll == '1') {
var rollColor = 'F00';
} else {
var rollColor = '000';
}
var rollUpdate = '<span style="color: #' + rollColor + ';"><b>' + roll + '</b> : 1d' + sides + '</span><br>';
$("#diceWindowDiceRolls").append(rollUpdate);
$("#diceWindowDiceRolls").animate({scrollTop: $("#diceWindowDiceRolls").prop("scrollHeight")}, 10);
});