isaacraja/ajaxdom.js

## ajaxdom.js
var Dom = {

	get: function (el) {
		if(typeof el === 'string')
		{
			return document.getElementById(el);
		}
		else
		{
			return el;
		}
	},
	add: function (el, dest) {
		var el = this.get(el);
		var dest = this.get(dest);
		dest.appendChild(el);
	},
	remove: function(el) {
		var el = this.get(el);
		el.parentNode.removeChild(el);
	}

};

var Event = {
	add:
		function() {
			if(window.addEventListener)
			{
				return function (el,type,fn) {
					Dom.get(el).addEventListener(type,fn,false);
				}
			}
			else if(window.attachEvent)
			{
				return function (el,type,fn) {
					var f = function() {
						fn.call(Dom.get(el).window.event);
					};
					Dom.get(el).attachEvent('on'+type,f);
				}
			}
	}()
};

var Ajax = {

	createRequest:
		function()
		{

			try
			{
				return new XMLHttpRequest();
			}
			catch(e)
			{
				console.log("An Error Occured");
			}

			var types = ['Microsoft.XMLHTTP','MSXML2.XMLHTTP'];
			for(var i in types)
			{
				try
				{
					return new ActiveXObject(types[i]);
				}
				catch(e)
				{
					console.log("An Error Occured");
				}
			}
		}


}


Event.add(window,'load',
function()
{
	var i=0;
	Event.add('add-textbox','click',function()
	{
		var di = document.createElement('div');
		var el = document.createElement('input');
		var remo = document.createElement('a');
		remo.setAttribute('href','#');
		remo.innerHTML = 'Remove';
		el.setAttribute('type','text');
		el.setAttribute('name','email[]');
		Dom.add(el, di);
		Dom.add(remo,di);
		Dom.add(di,'content');
		Event.add(remo,'click',function()
		{
			//Dom.remove(this);
			Dom.remove(di);
		});
	}
	);

	Event.add('submitemail','click',function()
	{
		var req = Ajax.createRequest();
		req.onreadystatechange = function() {
			if (req.readyState == 4) {
				if (req.status == 200) {
				if(req.responseText)
				{
					alert('Added the emails successfully');
				}
				}
			}
    	};
		var data = 'id=asdf';
		for(j = 0; j< document.forms[0].elements.length; j++)
		{
			data += '&email[]=' + document.forms[0].elements[j].value;
		}
		data = encodeURI(data);
		console.log(data);
		req.open('POST', 'aj.php', true);
		req.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');
		req.send(data);
	}
	);
}
);


//Alternate Event

var Event = {
	add:
		function(el,type,fn) {
			if(window.addEventListener)
			{
				Dom.get(el).addEventListener(type,fn,false);
			}
			else if(window.attachEvent)
			{
				var f = function() {
					fn.call(Dom.get(el).window.event);
				};
				Dom.get(el).attachEvent('on'+type,f);
			}
	}
};

## email.php
<html>
<head>
<title></title>
<script src="ajax.js" type="text/javascript"></script>
</head>
<body>
<form name="emailAdd">
<div id="content">
</div>
<div>
	<a href="#" id="add-textbox">Add Email</a>
</div>
<div>
	<input id="submitemail" type="button" onClick="" value="Submit"/>
	<input type="button" onClick="" value="Reset"/>
</div>
</form>
</body>
</html>
	var Dom = {

	get: function (el) {
	if(typeof el === 'string')
	{
	return document.getElementById(el);
	}
	else
	{
	return el;
	}
	},
	add: function (el, dest) {
	var el = this.get(el);
	var dest = this.get(dest);
	dest.appendChild(el);
	},
	remove: function(el) {
	var el = this.get(el);
	el.parentNode.removeChild(el);
	}

	};

	var Event = {
	add:
	function() {
	if(window.addEventListener)
	{
	return function (el,type,fn) {
	Dom.get(el).addEventListener(type,fn,false);
	}
	}
	else if(window.attachEvent)
	{
	return function (el,type,fn) {
	var f = function() {
	fn.call(Dom.get(el).window.event);
	};
	Dom.get(el).attachEvent('on'+type,f);
	}
	}
	}()
	};

	var Ajax = {

	createRequest:
	function()
	{

	try
	{
	return new XMLHttpRequest();
	}
	catch(e)
	{
	console.log("An Error Occured");
	}

	var types = ['Microsoft.XMLHTTP','MSXML2.XMLHTTP'];
	for(var i in types)
	{
	try
	{
	return new ActiveXObject(types[i]);
	}
	catch(e)
	{
	console.log("An Error Occured");
	}
	}
	}


	}


	Event.add(window,'load',
	function()
	{
	var i=0;
	Event.add('add-textbox','click',function()
	{
	var di = document.createElement('div');
	var el = document.createElement('input');
	var remo = document.createElement('a');
	remo.setAttribute('href','#');
	remo.innerHTML = 'Remove';
	el.setAttribute('type','text');
	el.setAttribute('name','email[]');
	Dom.add(el, di);
	Dom.add(remo,di);
	Dom.add(di,'content');
	Event.add(remo,'click',function()
	{
	//Dom.remove(this);
	Dom.remove(di);
	});
	}
	);

	Event.add('submitemail','click',function()
	{
	var req = Ajax.createRequest();
	req.onreadystatechange = function() {
	if (req.readyState == 4) {
	if (req.status == 200) {
	if(req.responseText)
	{
	alert('Added the emails successfully');
	}
	}
	}
	};
	var data = 'id=asdf';
	for(j = 0; j< document.forms[0].elements.length; j++)
	{
	data += '&email[]=' + document.forms[0].elements[j].value;
	}
	data = encodeURI(data);
	console.log(data);
	req.open('POST', 'aj.php', true);
	req.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');
	req.send(data);
	}
	);
	}
	);


	//Alternate Event

	var Event = {
	add:
	function(el,type,fn) {
	if(window.addEventListener)
	{
	Dom.get(el).addEventListener(type,fn,false);
	}
	else if(window.attachEvent)
	{
	var f = function() {
	fn.call(Dom.get(el).window.event);
	};
	Dom.get(el).attachEvent('on'+type,f);
	}
	}
	};
	<html>
	<head>
	<title></title>
	<script src="ajax.js" type="text/javascript"></script>
	</head>
	<body>
	<form name="emailAdd">
	<div id="content">
	</div>
	<div>
	<a href="#" id="add-textbox">Add Email</a>
	</div>
	<div>
	<input id="submitemail" type="button" onClick="" value="Submit"/>
	<input type="button" onClick="" value="Reset"/>
	</div>
	</form>
	</body>
	</html>