example.html - js-orm

‹r7

Source path: svn/ trunk/ examples/ jaxer/ example.html

<html>
	<head>
		<script runat="server" src="../../src/Norm.js"></script>
		<script runat="server" src="../../src/Norm.Logger.Jaxer.js"></script>
		<script runat="server" src="../../src/Norm.Database.Jaxer.js"></script>
		<script runat="server" src="../../src/Norm.ResultIterator.Jaxer.js"></script>
		<script runat="server" src="../../src/Norm.LastIdManager.js"></script>
		<script runat="server" src="../../src/Norm.Events.js"></script>
		<script runat="server" src="../../src/Norm.Sql.js"></script>
		<script runat="server" src="../../src/Norm.Fields.js"></script>
		<script runat="server" src="../../src/Norm.Model.js"></script>
		<script runat="server" src="../../src/Norm.Introspection.js"></script>
		<script runat="server" src="../../src/Norm.Transaction.js"></script>
		<script runat="server">
			
			Norm.Database.name = "demo.v2";
			Company = createCompanyModel();
			Person = createPersonModel();
			if (true) {
				Company.dropTable();
				Person.dropTable();
			}
			Company.createTable();
			Person.createTable();
			
			function oncallback() {
				
				if (typeof window.Norm == 'undefined') {
					Jaxer.load('../../src/Norm.js');
					Jaxer.load('../../src/Norm.Logger.Jaxer.js');
					Jaxer.load('../../src/Norm.Database.Jaxer.js');
					Jaxer.load('../../src/Norm.ResultIterator.Jaxer.js');
					Jaxer.load('../../src/Norm.LastIdManager.js');
					Jaxer.load('../../src/Norm.Events.js');
					Jaxer.load('../../src/Norm.Sql.js');
					Jaxer.load('../../src/Norm.Fields.js');
					Jaxer.load('../../src/Norm.Model.js');
					Jaxer.load('../../src/Norm.Introspection.js');
					Jaxer.load('../../src/Norm.Transaction.js');
					Jaxer.Log.info("loaded js-orm");
				} else {
					if (false) Jaxer.Log.info("Norm already loaded.");
				}
				
				Norm = window.Norm;
				Company = createCompanyModel();
				Person = createPersonModel();
			}
			
			function createCompanyModel() {
				
				return new Norm.Model({
					name : "Company",
					fields : {
						name : new Norm.Fields.String({maxLength : 25}),
						people : new Norm.Fields.ManyToOne({related : "Person"})
					}
				});
			}
			
			function createPersonModel() {
				
				return new Norm.Model({
					name : "Person",
					fields : {
						firstName : new Norm.Fields.String({maxLength : 25}),
						lastName : new Norm.Fields.String({maxLength : 25}),
						company : new Norm.Fields.OneToMany({related : "Company"})
					}
				});
			}
		</script>
		
		<script runat="server-proxy">
			
			function getPersons() {
				
				var array = new Array();
				Person.select().each(function(person) {				// need to change to something like Person.select().toArray().toJSON() or Person.select().toJSON();;
					var object = new Object();
					object.firstName = person.firstName;
					object.lastName = person.lastName;
					object.companyName = person.company.name;
					array.push(object);
				});
				return array;
			}
			
			function getCompanies() {
				
				var array = new Array();
				Company.select().each(function(company) {			// need to change to something like Company.select().toArray().toJSON() or Person.select().toJSON();;
					var object = new Object();
					object.name = company.name;
					object.rowid = company.rowid;
					array.push(object);
				});
				return array;
			}
			
			function insertPerson(firstName, lastName, companyId) {
				
				var person = new Person();
				person.firstName = firstName;
				person.lastName = lastName;
				person.company = companyId;
				person.save();
				return false;
			}
			
			function deletePerson(firstName, lastName, companyID) {
				
				Person.remove("firstName = ? AND lastName = ? AND company_id = ?", [firstName, lastName, companyID]);
				return false;
			}
			
			function insertCompany(name) {
				
				var company = new Company();
				company.name = name;
				company.save();
				return false;
			}
			
			function deleteCompany(name) {
				
				Company.remove("name = ?", [name]);
				return false;
			}
		</script>
		
		<script>
			function render() {
				
				var persons = getPersons();
				var personsElement = document.getElementById("persons");
				personsElement.innerHTML = "";
				for (var i = 0; i < persons.length; i++) {
					var item = document.createElement("div");
					var person = persons[i];
					item.innerHTML = person.firstName + " - " + person.lastName + " - " + person.companyName;
					personsElement.appendChild(item);
				}
				
				var companies = getCompanies();
				var companiesElement = document.getElementById("companies");
				companiesElement.innerHTML = "";
				for (var i = 0; i < companies.length; i++) {
					var item = document.createElement("option");
					var company = companies[i];
					item.innerHTML = company.name;
					item.value = company.rowid;
					companiesElement.appendChild(item);
				}
			}
			
			function addPerson() {
				
				var firstName = document.getElementById("firstName").value;
				var lastName = document.getElementById("lastName").value;
				var companies = document.getElementById("companies");
				var companyID = parseInt(companies.options[companies.selectedIndex].value);
				insertPerson(firstName, lastName, companyID);
				render();
				return false;
			}
			
			function removePerson() {
				
				var firstName = document.getElementById("firstName").value;
				var lastName = document.getElementById("lastName").value;
				var companies = document.getElementById("companies");
				var companyID = parseInt(companies.options[companies.selectedIndex].value);
				deletePerson(firstName, lastName, companyID);
				render();
				return false;
			}
			
			function addCompany() {
				
				var companyName = document.getElementById("companyName").value;
				insertCompany(companyName);
				render();
				return false;
			}
			
			function removeCompany() {
				
				var companyName = document.getElementById("companyName").value;
				deleteCompany(companyName);
				return false;
			}

			window.onload = render;
		</script>		
	</head>
	<body>
		<div id="persons"></div>
		<div>
			<strong>Add or remove a person:</strong>
			<form>
				First Name: <input type="text" id="firstName" name="firstName" value=""/><br/>
				Last Name: <input type="text" id="lastName" name="lastName" value=""/><br/>
				Company: <select id="companies" name="company"></select><br/>
				<input type="button" value="add person" onclick="return addPerson();" />
				<input type="button" value="remove person" onclick="return removePerson();" />
			</form>
			<strong>Add or remove a company:</strong>
			<form>
				Name: <input type="text" id="companyName" name="companyName" value=""/><br/>
				<input type="button" value="add company" onclick="return addCompany();" />
				<input type="button" value="remove company" onclick="return removeCompany();" />
			</form>
		</div>
	</body>
</html>

Show details Hide details

Change log

r8 by philmaker on Feb 09, 2008 Diff

cleanup and fix for issue discovered under
0.9.1

Go to:

Project members, sign in to write a code review

Older revisions

r7 by philmaker on Feb 09, 2008 Diff

comment tweak

r5 by philmaker on Feb 09, 2008 Diff

Primarily updating jaxer/example.html
as the full relational example

r4 by philmaker on Feb 07, 2008 Diff

All revisions of this file

File info

Size: 7010 bytes, 216 lines

View raw file