I've tried this a bunch of different ways, stuck on the call to XML data. I've debugged it, code comes out clean, but when I execute, it does nothing.
Here is the JS
//----------------------THE MAIL FORM---------------------------
function mailMe(form) {
return true;
}
//----------------------ADD ITEM---------------------------
function addItem() {
var id = document.getElementById("id").value;
$("#itemCont").append("<div id='item" + id + "' class='service'><span style='font-weight: bold;'>Item: </span><select name='ITEM" + id + "' style='width: 300px;'><option value=' '>Select an item...</option></select><span style='font-weight: bold;'> S/N: </span><input name='SN' type='text' style='width: 100px;'><p><span style='font-weight: bold;'> Parts: </span></p><div id='partCont'></div><a href='#' onClick='addPart(test.xml); return false;'>Add Part</a><div class='ri'><p><a href='#' onClick='removeItem(\"#item" + id + "\"); return false;'>Remove Item</a></p></div></div>");
id = (id - 1) + 2;
document.getElementById("id").value = id;
}
function removeItem(id) {
$(id).remove();
}
//----------------------ADD PART---------------------------
function addPart(url) {
var pn = document.getElementById("pn").value;
var xmlhttp;
var txt, x, xx, i;
if (window.XMLHttpRequest) { // code for IE7+, Firefox, Chrome, Opera, Safari
xmlhttp = new XMLHttpRequest();
}
else { // code for IE6, IE5
xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
}
xmlhttp.onreadystatechange = function() {
if (xmlhttp.readyState == 4 && xmlhttp.status == 200) {
txt = "<select name='test'><option value=''>Make a selection...<option>";
x = xmlhttp.responseXML.documentElement.getElementsByTagName("part");
for (i = 0; i < x.length; i++) {
txt = txt + "<option value='";
xx = x[i].getElementsByTagName("lawson");
try {
txt = txt + xx[0].firstChild.nodeValue + "'>";
}
catch (er) {
txt = txt + "'>";
}
}
xx = x[i].getElementsByTagName("desc");
try {
txt = txt + xx[0].firstChild.nodeValue + "</option>";
}
catch (et) {
txt = txt + "</option>";
}
}
};
txt = txt + "</select>";
$("#partCont").append("p);
xmlhttp.open("POST", url, true);
xmlhttp.send();
pn = (pn - 1) + 2;
document.getElementById("pn").value = pn;
}
function removePart(id) {
$(id).remove();
}
And the HTML:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>EIS Kodak - Service Parts Form</title>
<link rel="stylesheet" type="text/css" href="style.css" />
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript" src="addInput.js"></script>
</head>
<body>
<div id="nav">
<h1>Service Parts Form</h1>
</div>
<div id="content">
<p><a href="#" onClick="addItem(); return false;">Add Item</a></p>
<form id="form1" action="mailto:letichiak.broderick@kodak.com?subject=Service Parts Form" method="post" onsubmit="return mailMe( this.form )" enctype="text/plain">
<input type="hidden" id="id" value="1">
<input type="hidden" id="pc" value="1">
<input type="hidden" id="pn" value="1">
<div id="itemCont"></div>
<p style="margin-top: 20px;">
<input type="submit" value=" Submit " >
<input type="reset" value="Reset" name="reset">
</p>
</form>
</div><!--Content-->
</body>
</html>
And the XML:
<service>
<part>
<desc>Part 1 Description</desc>
<lawson>L#1</lawson>
<partnum>P#1</partnum>
<category>Category1</category>
</part>
<part>
<desc>Part 2 Description</desc>
<lawson>L#2</lawson>
<partnum>P#2</partnum>
<category>Category2</category>
</part>
<part>
<desc>Part 3 Description</desc>
<lawson>L#3</lawson>
<partnum>P#3</partnum>
<category>Category3</category>
</part>
<part>
<desc>Part 4 Description</desc>
<lawson>L#4</lawson>
<partnum>P#4</partnum>
<category>Category3</category>
</part>
</service>
I'm either missing something in the syntax or I don't know what I'm doing. Or both?
txt = txt + "</select>";
Shouldn't that line be inside the AJAX success function and also the append? Or I am missing something here. Are you atleast getting the AJAX to post properly and get the response data?