Assign id upon elementCreate [Archive]

devinrayolsen

05-25-2008, 07:49 PM

Hi i have this little project that creates a div box upon clicking a button.
However I would like to make it so when a user clicks this "Create DIV" button an alert window pops up and asks them to name the new div box before it creates the div box. What ever the user names the div box it will be set as the div boxes id. Any idea on how to do this?

Here is my code thus far.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
<style>
html,body {
margin:0;
}

#Pallet {
width:100%;
height:740px;
border:#000 thin solid;
overflow:scroll;
background:#F7F5E6;
}

#newDiv {
width:50px;
height:50px;
background:#FFFFCC;
color:#FFFFFF;
}
</style>
</head>

<body>
<div id="Pallet">
</div>

<script type="text/javascript">

function insertDIV()
{
//Create Div Boxes
var Pallet = document.getElementById("Pallet");
var divBox = document.createElement("div");
Pallet.appendChild(divBox);
}
</script>
<button onclick="insertDIV();">Create DIV</button>
</body>
</html>

Thanks everyone!

devinrayolsen

05-25-2008, 09:54 PM

Ok I have gotten this far but script still seems to not be working can anyone help please?

<script type="text/javascript">
function createDIV()
{
var divID = prompt("Please Name Your New Div Box","");

if(divID != null)
document.createElement(false, divID);

else (divID = true)
var pallet = document.getElementById("Pallet");
var divBox = document.createElement("div");
divBox.setAttribute("id", var divID);
divBox.setAttribute("style","width:50px; height:50px; background:#000;");
Pallet.appendChild(divBox);
}
</script>

<button onclick="createDIV();">Create DIV</button>