<!DOCTYPE HTML PUBLIC
"-//W3C//DTD HTML 4.01 Transitional//EN"
"[URL unfurl="true"]http://www.w3.org/TR/html4/loose.dtd">[/URL]
<html>
<head>
<title>test</title>
<script type="text/javascript">
function updateQuery(sel) {
var query = sel.form.query;
var sels = document.getElementsByName(sel.name);
var vals = new Array();
for (var x = 0; x < sels.length; x++) {
if (sels[x].selectedIndex > 0) {
vals.push(sels[x].options[sels[x].selectedIndex].value);
}
}
query.value = vals.join(",");
}
function addSelect(form) {
var container = document.getElementById("select-container");
var div = document.createElement("div");
var sel = document.createElement("select");
var model = form.pubid.length ? form.pubid[0] : form.pubid;
sel.setAttribute("name", "pubid");
sel.onchange = function() { updateQuery(this); };
for (var x = 0; x < model.options.length; x++) {
sel.add( new Option(model.options[x].text, model.options[x].value), null );
}
div.appendChild(sel);
container.appendChild(div);
}
</script>
</head>
<body>
<form>
<div>
<input type="button" value="add another" onclick="addSelect(this.form);" />
</div>
<div id="select-container">
<div>
<select name="pubid" onchange="updateQuery(this);">
<option value="-1">Please select a PubId</option>
<option value="1">1</option>
<option value="2">2</option>
<option value="3">3</option>
<option value="4">4</option>
<option value="5">5</option>
</select>
</div>
<div>
<select name="pubid" onchange="updateQuery(this);">
<option value="-1">Please select a PubId</option>
<option value="1">1</option>
<option value="2">2</option>
<option value="3">3</option>
<option value="4">4</option>
<option value="5">5</option>
</select>
</div>
<div>
<select name="pubid" onchange="updateQuery(this);">
<option value="-1">Please select a PubId</option>
<option value="1">1</option>
<option value="2">2</option>
<option value="3">3</option>
<option value="4">4</option>
<option value="5">5</option>
</select>
</div>
</div>
<div>
<textarea name="query" rows="5" cols="35"></textarea>
</div>
</form>
</body>
</html>