Tuesday, April 11, 2017

use ng-repeat for edit form data

I can't get the edit function working in angularJS 1.

I am using Laravel 5.4 as an API for my backend. It spits out all the JSON and what not. I checked out my edit method in Laravel using PostMan and it is working fine.

I am having trouble understanding how I can implement that into AngularJS with Ionic.

So below I have provided my form I am using, the controller function I am using.

eventUpdate.html

<form id="eventForm-form1" class="list" role="form" >
  <label class="item item-input item-stacked-label" id="eventForm-input2">
    <span class="input-label"></span>
    <input type="text" ng-model="editEvent.event_title" required="true">
  </label>
  <label class="item item-input item-stacked-label" id="eventForm-input3">
    <span class="input-label">Description</span>
    <input type="text" ng-model="editEvent.event_description" required="true">
  </label>
  <label class="item item-input item-stacked-label" id="eventForm-input4">
    <span class="input-label">Location</span>
    <input placeholder="123 Maple Lane" type="text" ng-model="editEvent.event_location" required="true">
  </label>
  <label class="item item-input item-stacked-label" id="eventForm-input5">
    <span class="input-label">Date</span>
    <input type="date" ng-model="editEvent.event_date" required="true">
  </label>
  <label class="item item-input item-stacked-label" id="eventForm-input6">
    <span class="input-label">Time</span>
    <input type="time" ng-model="editEvent.event_time" required="true">
  </label>
</div>
  <a ui-sref="tabsController.eventView" id="eventForm-button1" class="button button-positive  button-block ng-click="update()"">Create Event</a>

  <input type="button" ng-click="reset(form)" value="Reset" />
    <div class="modal-footer">
                        <button type="button" ng-click="update()" >Update</button>
                    </div>
</form>

App.js

ThesisApp.controller('UpdateController',['$scope', '$http', 
'$ionicLoading', '$routeParams', function($scope, $http, $ionicLoading, 
$routeParams){

$scope.edit = function(){
  $http.get("http://thesis-app.dev/events/edit/"+$routeParams.id)
   .success(function(response){
    console.log('get info');
    $scope.editEvent = response;
  })
.error(function(response) {
    console.log("not working");
    });
  }

}]);



via Meaghan Florence

Advertisement