How to use this in ionic?

ionic-v1
1

I want to be able to get text from a textbox and POST to parse…

Button
<button class="button button-dark button-block" id="shifttime">Add Now</button>

POST Method
`$(‘button’).click(function(e) {
e.preventDefault();

var text = $('#shifttime');
$.ajax({
	url : 'https://api.parse.com/1/classes/shifts',
	type : 'POST',
	contentType : 'application/json',
	headers : {
		'X-Parse-Application-Id': '',
              'X-Parse-REST-API-Key': '',
              'Content-Type': 'application/json'
	},
	data : JSON.stringify({
				shifttime : text.val()
			}),
	error : function(data) {
		console.log('error');
	},
	success : function(data) {
		console.log('success', data)
		$('ul').append('<li>' + "Shift Added" + '</li>');
	}
});

However JQuery isn’t working in Ionic… So how can i do this exact same thing with $HTTP Post?

2

You can post data using Parse REST API like this. Hope this helps.

$http({
    method: 'POST',
    url: 'https://api.parse.com/1/classes/shifts',
    data: {
          columnName: 'value',
          columnName: 'value'
    },
    headers: {
        'X-Parse-Application-Id': '',
        'X-Parse-REST-API-Key': '',

    }
})
.success(function (data, status) {

})
.error(function (data, status) {

});
3

How to assign a value to a column name? Eg

<label class="item item-input"> <span class="input-label">Number</span> <input id="shifttime" type="text" placeholder=""> </label>

4

I recommend to watch these videos.

It will make you more familiar with Angular. Or read more about Angular scopes and data binding (ng-model).

5

Came here to ask a question, have went through all other solutions this as a final result; i was looking for hands on help, not continuous learning. Thanks.

6

If you’re ok with the fact you do not know what’s going on. Here is one possible solution. It should work.

  <body ng-app="app" ng-controller="ctrl">

<span style="color: #007700">&lt;ion</span><span style="color: #0000CC">-pane</span><span style="color: #007700">&gt;</span>
  <span style="color: #007700">&lt;ion</span><span style="color: #0000CC">-header-bar</span> <span style="color: #0000CC">class=</span><span style="background-color: #fff0f0">&quot;bar-stable&quot;</span><span style="color: #007700">&gt;</span>
    <span style="color: #007700">&lt;h1</span> <span style="color: #0000CC">class=</span><span style="background-color: #fff0f0">&quot;title&quot;</span><span style="color: #007700">&gt;</span>Awesome App<span style="color: #007700">&lt;/h1&gt;</span>
  <span style="color: #FF0000; background-color: #FFAAAA">&lt;</span>/ion-header-bar&gt;
  <span style="color: #007700">&lt;ion</span><span style="color: #0000CC">-content</span> <span style="color: #0000CC">class=</span><span style="background-color: #fff0f0">&quot;padding has-header&quot;</span><span style="color: #007700">&gt;</span>
    <span style="color: #007700">&lt;label</span> <span style="color: #0000CC">class=</span><span style="background-color: #fff0f0">&quot;item item-input&quot;</span><span style="color: #007700">&gt;</span>



<span class=“input-label”>Number</span>

<input id=“shifttime” type=“text” placeholder="" ng-model=“number”>

</label>

<button ng-click=“postData(number)” class=“button”>Send data</button>

</ion-content>

</ion-pane>

<script>

angular.module(‘app’, [‘ionic’]).controller(‘ctrl’, function($scope, $http){


$scope.postData = function (number) {

console.log(number + " posted");

$http({

method: ‘POST’,

url: ‘https://api.parse.com/1/classes/shifts’,

data: {

input: number

},

headers: {

‘X-Parse-Application-Id’: ‘’,

‘X-Parse-REST-API-Key’: ‘’,

}

})

.success(function (data, status) {


})

.error(function (data, status) {


});

};

});</script>

</body>
7

I appreciate that; i learn by “doing” not by watching a video, now i’ve done the same thing with 4 different text boxes, thank you.