Help with creating two fields on Ionic-1 app
Hello, I wonder if anyone could help. I am trying to create 2 fields (creationTime & creationDate) in ionic1 app, which is online reminder, using jsonblob API. Both fields should show on jsonblob but not be visible on the app. I can't seem to work out how to do this.
MAIN.JS
<ion-view ng-controller="mainCtrl">
<ion-pane>
<ion-header-bar class="bar-stable">
<h1 class="title">{{reminder.titleText}}</h1>
</ion-header-bar>
<ion-content class="has-header">
<ion-item class="item-head">
<h2>Title</h2>
</ion-item>
<ion-item class="item-body">
<input type="text" ng-model='reminder.titleText' id="input-box">
</ion-item>
<ion-item class="item-head">
<h2>Description</h2>
</ion-item>
<ion-item class="item-body">
<textarea rows="5" ng-model='reminder.descText' ng-value="" id="desc-box"></textarea>
</ion-item>
<ion-item class="item-head">
<h2>Priority</h2>
</ion-item>
<span radio-group class="item-body">
<ion-radio ng-model='reminder.priority' ng-value='1'>High</ion-radio>
<ion-radio ng-model='reminder.priority' ng-value='2'>Medium</ion-radio>
<ion-radio ng-model='reminder.priority' ng-value='3'>Low</ion-radio>
</span>
<ion-item class="item-head">
<h2>Complete</h2>
</ion-item>
<ion-toggle class="item-body" ng-model="reminder.complete">Complete</ion-toggle>
<!-- Show save button if there is no saved myjsonblobID, otherwise show update and delete buttons -->
<ion-item ng-if="haveID==false">
<button class="button button-positive large round" ng-click="createmyjsonblob'()">Save</button>
</ion-item>
<ion-item ng-if="haveID==true">
<button class="button button-positive large round" ng-click="updatemyjsonblob()">Update</button>
<button class="button button-positive large round" ng-click="deletemyjsonblob()">Delete</button>
</ion-item>
</ion-content>
</ion-pane>
</ion-view>
CONTROLLER.JS
var app = angular.module('myNews');
app.controller("mainCtrl",function($scope, myjsonblobService, storageService){
//On startup check if there is a myjsonblobID saved in the local storage
$scope.$on("$ionicView.beforeEnter",function(){
var ID = storageService.getIDFromStorage();
//if no id, set reminder data to default
if(ID == "undefined" || ID === null || ID === ""){
$scope.reminder = {
titleText : "",
descText : "",
priority : 1,
complete : false,
}
//show save button
$scope.haveID = false;
}
//if there is an id, set id from storage to myjsonblobService, then get data from myjsonblob
else{
//show update and delete buttons
$scope.haveID = true;
//let the myjsonblob ID service know the current myjsonblob ID
myjsonblobService.setmyjsonblobID(ID);
//get myjsonblob data
myjsonblobService.getmyjsonblob(getCallbackOK,getCallbackNOTOK);
}
});
/*----------------- Link Service Functions -------------------------------------*/
$scope.createmyjsonblob = function(){
myjsonblobService.createmyjsonblob(createCallbackOK,createCallbackNOTOK,$scope.reminder);
}
$scope.updatemyjsonblob = function(){
myjsonblobService.updatemyjsonblob(updateCallbackOK,updateCallbackNOTOK,$scope.reminder);
}
$scope.deletemyjsonblob = function(){
myjsonblobService.deletemyjsonblob(deleteCallbackOK,deleteCallbackNOTOK,$scope.reminder);
}
/*----------------- Callback Functions -------------------------------------*/
//Callback functions for the create new myjsonblob request
function createCallbackOK(){
//update shown buttons
$scope.haveID = true;
//get new myjsonblobID
ID = myjsonblobService.getmyjsonblobID();
//save new myjsonblobID to local storage
storageService.setIDInStorage(ID);
}
function createCallbackNOTOK(){
alert("Sorry, there was an error accessing the server to create the reminder, please try again later.");
}
//Callback functions for the get myjsonblobID request
function getCallbackOK(data){
//update scope data with saved reminder data
$scope.reminder = data;
}
function getCallbackNOTOK(){
alert("Sorry, there was an error accessing the server to get the reminder data, please try again later.");
}
//Callback function for the update myjsonblobID request
function updateCallbackOK(data){
$scope.reminder = data;
//update scope data with new reminder
}
function updateCallbackNOTOK(){
alert("Sorry, there was an error accessing the server to update the reminder data, please try again later.");
}
//Callback function for the delete myjsonblobID request
function deleteCallbackOK(data){
$scope.reminder = data;
//update scope data with new reminder
}
function deleteCallbackNOTOK(){
alert("Sorry, there was an error accessing the server to delete the reminder data, please try again later.");
}
});
SERVICES.JS
var app = angular.module('myNews')
/*
MYJSONBLOBSERVICE
contains all functionality needed to send, recieve and update data from the myjsonblob website
*/
.service('myjsonblobService', function($http){
//url for myjsonblob
var myjsonblobURL = "https://jsonblob.com/api/jsonBlob";
//holds myjsonblobID during runtime
var myjsonblobID ="";
/*------------------ Create --------------------------------------------*/
//function call to create myJSON
this.createmyjsonblob =(createCallbackOK, createCallbackNOTOK,data){
//request to create myjsonblobID using reminder data
$http.post(myjsonblobURL,JSON.stringify(data)).then(postOK,postNOTOK);
//create ok, gets the myjsonblobID and calls back to controller
function postOK(response){
myjsonblobID = response.headers ("x-jsonblob");
console.log("myjsonblobID = " + myjsonblobID);
createCallbackOK();
}
//create not ok, calls back to the controller
function postNOTOK(response){
createCallbackNOTOK();
}
}
/*------------------ Get -----------------------------------------------*/
//function call to get data stored on myjsonblob
this.getmyjsonblob = function(getCallbackOK,getCallbackNOTOK){
$http.get(myjsonblobURL+"/"+myjsonblobID).then(getOK,getNOTOK);
//get ok gets the data associated with myjsonblobID, to be returned to the data attribute of response object
function getOK(response){
console.log("myjsonblobID = " + myjsonblobID);
getCallbackOK(response.data);
}
//get not ok, calls back to the controller
function getNOTOK(response){
getCallbackNOTOK();
}
}
/*------------------ Update --------------------------------------------*/
//function call to update myjsonblob data
this.updatemyjsonblob = function(updateCallbackOK, updateCallbackNOTOK, data){
//request to update myjsonblob using reminder data
$http.put(myjsonblobURL+"/"+myjsonblobID,JSON.stringify(data)).then(putOK,putNOTOK);
//update ok
function putOK(response){
updateCallbackOK (response.data);
//nothing needed to be done
}
//update not ok, calls back to the controller
function putNOTOK(response){
updateCallbackNOTOK();
}
}
/*------------------ Delete --------------------------------------------*/
//function call to delete myjsonblob data
this.deletemyjsonblob = function(deleteCallbackOK, deleteCallbackNOTOK){
//request to delete myjsonblob using reminder data
$http.delete(myjsonblobURL+"/"+myjsonblobID).then(deleteOK,deleteNOTOK);
//delete ok
function deleteOK(response){
var blobID = response.headers("x-jsonblob");
deleteCallbackOK ();
//nothing needed to be done
}
//delete not ok, calls back to the controller
function deleteNOTOK(response){
deleteCallbackNOTOK();
}
}
/*------------------ Get BlobID -----------------------------------------*/
this.getmyjsonblobID = function(){
return myjsonblobID;
}
this.setmyjsonblobID = function(ID){
myjsonblobID = ID;
}
})
/*
STORAGESERVICE
contains all functionality needed to save, recieve and delete the myjsonblobID from the local storage
*/
.service('storageService', function($window){
//Saves/updates the myjsonblobID in local storage
this.setIDInStorage = function(myjsonblobID){
$window.localStorage.setItem("myjsonblobID",myjsonblobID);
}
//Retrieves the myjsonblobID from local storage
this.getIDFromStorage = function(){
return $window.localStorage.getItem("myjsonblobID");
}
//Deletes the myjsonblobID from local storage
this.removeIDFromStorage = function(){
$window.localStorage.removeItem("myjsonblobID");
}
});