New example page and added nestObjects function

seedcode · Feb 1, 2015 · 46239df · 46239df
1 parent facd4df
commit 46239df
Show file tree

Hide file tree

Showing 14 changed files with 1,804 additions and 1,239 deletions.
diff --git a/css/fmxj.css b/css/fmxj.css
diff --git a/databases/Contacts.fmp12 b/databases/Contacts.fmp12
diff --git a/examples/deleteQuery.html b/examples/deleteQuery.html
@@ -0,0 +1,151 @@
+<!doctype html>
+
+<html>
+
+<head>
+<title>&nbsp;</title>
+
+<script src="../fmxj.js" type="text/javascript"></script> 
+<link rel="stylesheet" type="text/css" href="../css/fmxj.css">
+<script src="../libraries/prism.js" type="text/javascript"></script> 
+<link rel="stylesheet" type="text/css" href="../libraries/prism.css">
+
+</head>
+
+<body>
+
+<div style="float:right">
+	<a href="http://SeedCode.com" style="cursor:pointer"><img src="../logowhite.png" alt="SeedCode Logo" style="width:290px;height:93px;display:block"></a>
+</div>
+<p>
+	<br>
+</p>
+<div class="title">
+	fmxj.js
+</div>
+<div class="sub-title">
+	a JavaScript approach to FileMaker Custom Web Publishing
+</div>
+<div class="sidebar" id="sb"></div>
+
+	<div class="content">
+		<h3 class="functionTitle">deleteRecordURL(fileName, layoutName, recid)</h3>
+		<div class="text">Create a FileMaker -delete query url by specifying the FileMaker record id. These queries are then passed to the <span class="func">postQueryFMS()</span> function which returns the results as a single object array. The object contains the error code with "0" meaning a succesful delete.</div>
+	</br>
+		<div class="divSeparator"></div>
+		<div class="argument">
+			fileName
+		</div>
+		<span class="text">
+			Type:
+		</span>
+		<span class = "type string">
+			String
+		</span>
+		<div class="desc">
+			A String of the name of the hosted FileMaker file.
+		</div>
+		<div class="divSeparator"></div>
+		<div class="argument">
+			layoutName
+		</div>
+		<span class="text">
+			Type:
+		</span>
+		<span class = "type string">
+			String
+		</span>
+		<div class="desc">
+			A String of the name of the target layout in the specified file.
+		</div>
+		<div class="divSeparator"></div>
+		<div class="argument">
+			recid
+		</div>
+		<span class="text">
+			Type:
+		</span>
+		<span class="type number">
+			number
+		</span>	
+		<div class="desc">The FileMaker Record ID (-recid) of the record to be deleted.</div>
+
+		<div class="divSeparator"></div>
+		<div class="argument">example 1</div>
+		<div class="text">Create a -delete query by passing the -recid id to the function. Then POST the query. For this example we'll create a new record to delete (so we don't run out of sample data!)
+		</div>
+<pre class="line-numbers">
+<code class="language-javascript">
+//create new record query from object
+var newRecord =	{
+				"DateStart" : "02/25/2014" ,
+				"DateEnd" : "02/25/2014" ,
+				"Description" : "delete example" ,
+				"Status" : "Open" ,
+				"Summary" : "test delete example"
+				} ;
+var query = fmxj.editRecordURL("Events", "Events", newRecord);
+fmxj.postQueryFMS(query, writeResult);//POST query
+function writeResult (js) { // define handler for results.
+	var record = js[0];
+	updateElement("example1",JSON.stringify(js, null, 4));//write new record to element as JSON
+	if(record["-recid"]){//this is the result for our new record.
+	var recid = record["-recid"];//retrieve record id so we can delete it
+	var dq = fmxj.deleteRecordURL("Events", "Events", recid );//create query
+	fmxj.postQueryFMS(dq, writeResult);//POST query
+	}
+	else//this is the result of our delete request so write it to element
+	{
+	updateElement("example1", JSON.stringify(js, null, 4), true);
+	}
+};</code></pre>
+
+<button id="btn1">try example 1</button>
+<pre id="example1" class="result" style="height:600px;max-height:none"></pre>
+
+</div>
+
+</body>
+
+<footer>
+
+<script src="../fmxjDemo.js" type="text/javascript"></script> 
+
+<script>
+
+//button for new record
+var btn = document.getElementById("btn1");
+btn.addEventListener("click",function(){
+start = new Date().getTime();
+var newRecord =	{
+	"DateStart" : "02/25/2014" ,
+	"DateEnd" : "02/25/2014" ,
+	"Description" : "delete example" ,
+	"Status" : "Open" ,
+	"Summary" : "test delete example"
+				} ;
+var query = fmxj.editRecordURL("Events", "Events", newRecord);
+fmxj.postQueryFMS(query, writeResult, null, relay);//POST query
+function writeResult (js,utc) { // define handler for results.
+	var record = js[0];
+	if(record["-recid"]){//this is the result for our new record.
+		var message = createDisplay(js, utc, start);
+		updateElement("example1",message + "\n\n");
+		var recid = record["-recid"];//retrieve record id so we can delete it
+		var dq = fmxj.deleteRecordURL("Events", "Events", recid );//create query
+		fmxj.postQueryFMS(dq, writeResult, null, relay);//POST query
+	}
+	else//this is the result of our delete request so write it to element
+	{
+		var message = createDisplay(js, utc, start);
+		updateElement("example1",message, true);
+	}
+}
+});
+
+
+</script>
+
+</footer>
+
+</html>
diff --git a/examples/editQuery.html b/examples/editQuery.html
@@ -0,0 +1,191 @@
+<!doctype html>
+
+<html>
+
+<head>
+<title>&nbsp;</title>
+
+<script src="../fmxj.js" type="text/javascript"></script> 
+<link rel="stylesheet" type="text/css" href="../css/fmxj.css">
+<script src="../libraries/prism.js" type="text/javascript"></script> 
+<link rel="stylesheet" type="text/css" href="../libraries/prism.css">
+
+</head>
+
+<body>
+
+<div style="float:right">
+	<a href="http://SeedCode.com" style="cursor:pointer"><img src="../logowhite.png" alt="SeedCode Logo" style="width:290px;height:93px;display:block"></a>
+</div>
+<p>
+	<br>
+</p>
+<div class="title">
+	fmxj.js
+</div>
+<div class="sub-title">
+	a JavaScript approach to FileMaker Custom Web Publishing
+</div>
+<div class="sidebar" id="sb"></div>
+
+	<div class="content">
+		<h3 class="functionTitle">editRecordURL(fileName, layoutName, editObj)</h3>
+		<div class="text">Create a FileMaker -edit or -new query url from a javascript object. These queries are then passed to the <span class="func">postQueryFMS()</span> function which returns the results as a single object array.</div>
+	</br>
+		<div class="divSeparator"></div>
+		<div class="argument">
+			fileName
+		</div>
+		<span class="text">
+			Type:
+		</span>
+		<span class = "type string">
+			String
+		</span>
+		<div class="desc">
+			A String of the name of the hosted FileMaker file.
+		</div>
+		<div class="divSeparator"></div>
+		<div class="argument">
+			layoutName
+		</div>
+		<span class="text">
+			Type:
+		</span>
+		<span class = "type string">
+			String
+		</span>
+		<div class="desc">
+			A String of the name of the target layout in the specified file.
+		</div>
+		<div class="divSeparator"></div>
+		<div class="argument">
+			editObj
+		</div>
+		<span class="text">
+			Type:
+		</span>
+		<span class="type object">
+			Object
+		</span>	
+		<div class="desc">An Object that specifies the changes to be made to the FileMaker record.  Property names represent the FileMaker field names.  Specifying a -recid property will edit the specified record with an -edit query.  Not specifying the -recid will create a new FileMaker record with a -new query. The -modid property can be optionally specified to ensure you are editing the most current version of that record.  See more about using the -mod id in <a href="https://fmhelp.filemaker.com/docs/13/en/fms13_cwp_xml.pdf" target="_blank">FileMaker's XML CWP Guide</a>
+		</div>
+
+
+				<div class="divSeparator"></div>
+				<div class="argument">example 1</div>
+				<div class="text">Create a new FileMaker record by not specifying the -recid in the edit object.  If the record creation is succesful on the server, then the record will be returned and converted into an object.
+				</div>
+<pre class="line-numbers">
+<code class="language-javascript">
+var newRecord =	{
+				"DateStart" : "02/25/2014" ,
+				"DateEnd" : "02/25/2014" ,
+				"Description" : "test" ,
+				"Status" : "Open" ,
+				"Summary" : "test summary ubi"
+				} ;
+var query = fmxj.editRecordURL("Events", "Events", newRecord) ;
+fmxj.postQueryFMS(query, callBackFunction) ;</code></pre>
+		<button id="btn1">try example 1</button>
+		<pre id="example1" class="result tall"></pre>
+
+
+		<div class="divSeparator"></div>
+		<div class="argument">example 2</div>
+		<div class="text">Specifying a -recid property in an object will create a edit query to edit the fields specified in the object. Retrieve the first record on the Events layout and toggle its status. If the status is open, set it to closed and vice-versa.
+		</div>
+<pre class="line-numbers">
+<code class="language-javascript">
+// query to find all records, unsorted and return the first one.
+var query = fmxj.findRecordsURL("Events", "Events", null, null, 1);
+fmxj.postQueryFMS(query,createEdit,null,relay); // Perform request
+function createEdit(js){ //define handler for returned record
+	var recid = js[0]["-recid"]; //retrieve record/object's -recid
+	var modid = js[0]["-modid"]; //retrieve record/object's -modid
+	var recordStatus = js[0]["Status"]; //retrieve record/object's status
+	if ( recordStatus == "Open" ){ //toggle status
+		 recordStatus = "Closed" 
+	} 
+	else {
+		 recordStatus = "Open" 
+	} ;
+	var editObj = { //create new object to edit the record
+		"-recid":recid,
+		"-modid":modid,
+		"Status":recordStatus,
+				  };
+	//create query from object
+	var query = fmxj.editRecordURL("Events", "Events", editObj);
+	fmxj.postQueryFMS(query,writeResult,null,relay); //POST edit query
+	function writeResult(js){ //define handler for writing edited object.
+		updateElement("example2", message, true);
+	};
+};</code></pre>
+<button id="btn2">try example 2</button>
+<pre id="example2" class="result" style="height:600px;max-height:none"></pre>
+
+
+
+</div>
+
+</body>
+
+<footer>
+
+<script src="../fmxjDemo.js" type="text/javascript"></script> 
+
+<script>
+
+//button for editing the first object in the array
+var btnedit = document.getElementById("btn2");
+btnedit.addEventListener("click",function(){
+	start = new Date().getTime();
+	document.getElementById("example2").innerHTML =  "" ;
+	// query to find all records, unsorted and return the first one.
+	var query = fmxj.findRecordsURL("Events", "Events", null, null, 1);
+	fmxj.postQueryFMS(query,createEdit,null,relay); // Perform request
+	function createEdit(js,utc){ //define handler for returned record
+		var message = "Before\n" + createDisplay(js, utc, start);
+		updateElement("example2", message + "\n\n");
+		var recid = js[0]["-recid"]; //retrieve record/object's -recid
+		var modid = js[0]["-modid"]; //retrieve record/object's -modid
+		var recordStatus = js[0]["Status"]; //retrieve record/object's status
+		if ( recordStatus == "Open" ){ //toggle status
+			 recordStatus = "Closed" 
+		} 
+		else {
+			 recordStatus = "Open" 
+		} ;
+		var editObj = { //create object to edit the record
+			"-recid":recid,
+			"-modid":modid,
+			"Status":recordStatus,
+					  };
+		var query = fmxj.editRecordURL("Events", "Events", editObj);
+		fmxj.postQueryFMS(query,writeResult,null,relay);
+		function writeResult(js,utc){ //define handler for writing edited object.
+			var message = "After\n" + createDisplay(js, utc, start);
+			updateElement("example2", message, true);
+	};
+}
+});
+
+//button for new record
+var btnnew = document.getElementById("btn1");
+btnnew.addEventListener("click",function(){
+	start = new Date().getTime();
+	document.getElementById("example1").innerHTML =  "" ;
+	function writeResults ( js, utc ) {
+		var message = createDisplay(js, utc, start);
+		updateElement("example1",message);
+	} ;
+	var q = fmxj.editRecordURL("Events" , "Events" , newRecord ) ;
+	fmxj.postQueryFMS(q,writeResults,null,relay)
+});
+
+</script>
+
+</footer>
+
+</html>