jsharmony-tutorials
Version:
jsHarmony Tutorials
157 lines (131 loc) • 5.32 kB
HTML
<html>
<head>
<script type="text/javascript" src="/js/jsHarmony.loader.js?oninit=app.init(jsh);"></script>
<script type="text/javascript">
var SampleApp = function(){
var _this = this;
var jsh = null;
var XExt = null;
var XPage = null;
var XForm = null;
var $ = null;
var CUST_FORM_CONTAINER_CLASS= 'sample_cust_form_container';
this.namespace = 'jsHarmonyTutorials/';
this.LOVs = {};
//Called when jsHarmony is loaded (via querystring parameter to jsHarmony.loader.js)
this.init = function(_jsh){
jsh = _jsh;
XExt = jsh.XExt;
XPage = jsh.XPage;
XForm = jsh.XForm;
$ = jsh.$;
this.initForm();
}
//Create model, draw controls
this.initForm = function(){
if('Customer' in jsh.XModels) return; //Form already loaded
//Check for changes before leaving page
window.onbeforeunload = XExt.chain(window.onbeforeunload, function(){ return XPage.GetChangesMessage('Customer'); });
//Define the form in-memory
XPage.LoadVirtualModel($('.'+CUST_FORM_CONTAINER_CLASS)[0], {
"id": "Customer",
"layout": "form",
"unbound": true,
"caption": ['Customer','Customers'],
"buttons": [{"link": "js:_this.showTestMessage()", "icon": "ok", "actions":"BIU", "text":"Test Message"}],
"ejs": "<div class='<%=model.class%>_sample_ejs'>Sample EJS for <%=model.id%> model</div>",
"css": ".<%=model.class%>_sample_ejs { background-color:#f0f0f0; border:1px solid #bbb; padding:4px 20px; margin-top:10px; }",
"js": function(){ //This function is virtual and cannot reference any variables outside its scope
var _this = this;
//var modelid = [current model id];
//var xmodel = [current model];
_this.oninit = function(xmodel){
//Custom oninit function
}
_this.onload = function(xmodel){
//Custom onload function
}
_this.save = function(){
app.commitForm();
}
_this.showTestMessage = function(){
XExt.Alert('Test Message');
}
},
"oninit":"_this.oninit(xmodel);",
"onload":"_this.onload(xmodel);",
"fields": [
{"name": "cust_id", "caption":"Customer ID", "type": "int", "actions":"B",
"control":"textbox", "controlstyle":"width:80px;", "validate": ["IsNumeric","Required"] },
{"name": "cust_name", "caption":"Name", "type": "varchar", "length": 256, "actions":"B",
"control":"textbox", "controlstyle":"width:260px;", "validate": ["MaxLength:256","Required"] },
{"name": "cust_sts", "caption":"Status", "type": "varchar", "length":32,
"control":"dropdown", "validate": ["Required"] },
{"control":"html","value":"<b>Sample HTML:</b> Content"},
{"control":"button","value":"Save", "onclick": "js:_this.save();"},
]
}, function(custmodel){
//Model loaded
//Get customer data from API
_this.api_getData(function(){ jsh.init_complete = true; });
});
}
//Render Form
this.renderForm = function(){
//Apply List of Values
jsh.XModels['Customer'].controller.setLOV('cust_sts', _this.LOVs.cust_sts);
jsh.XModels['Customer'].controller.Render(_this.cust);
}
//Get / Validate Form Values, Save to API
this.commitForm = function(){
if(!jsh.XModels['Customer'].controller.Commit(_this.cust, 'U')) return;
_this.api_saveData();
}
/////////
// API //
/////////
//Get customer status data from the database API
this.api_getData = function(onComplete){
var emodelid = app.namespace + 'FormVirtual_Standard_Get_Cust';
//Execute the FormVirtual_Standard_Get_Cust model
XForm.prototype.XExecutePost(emodelid, { cust_id: jsh._GET.cust_id }, function (rslt) { //On Success
if ('_success' in rslt) {
if(!rslt[emodelid][0] || !rslt[emodelid][0].length) return XExt.Alert('Customer not found');
//Populate arrays + Render
_this.cust = rslt[emodelid][0][0];
if(rslt[emodelid][1]) rslt[emodelid][1].unshift({ code_val: '', code_txt: 'Please select...' });
_this.LOVs.cust_sts = rslt[emodelid][1];
_this.renderForm();
if (onComplete) onComplete();
}
else XExt.Alert('Error while loading data');
}, function (err) {
//Additional error handling
});
}
//Save new customer status to database API
this.api_saveData = function(onComplete){
if(!_this.cust) return XExt.Alert('Customer data not loaded');
//Execute the FormVirtual_Standard_Update_CustSts model
var params = {
cust_id: _this.cust.cust_id,
cust_sts: _this.cust.cust_sts
};
XForm.prototype.XExecutePost(app.namespace + 'FormVirtual_Standard_Update_CustSts', params, function (rslt) { //On Success
if ('_success' in rslt) {
//Reload customer data
_this.api_getData(onComplete);
}
else XExt.Alert('Error while saving data');
}, function (err) {
//Additional error handling
});
}
}
window.app = new SampleApp();
</script>
</head>
<body style="padding:15px 30px;">
<div class='sample_cust_form_container'></div>
</body>
</html>