Rather than gathering my order data from one JSON file I know need to access individual records displayed in JSON. Is it possible to adapt the http.get request so it has a variable option(for the order number) and change the ng-repeat to display individual records.

So on list.html, if I search for order ref 12145 it will pull the data from http://example.com/api/booking/get/guest/12145 and the ng-repeat output in list.html and detail.html will display that exact order.

I assume the ng-model search query will need to be appended onto the http.get url?

Here is the code in a Plunker: https://plnkr.co/edit/eS28uBh2y1tmbAP597zM?p=catalogue

and a gif showing what I am trying to do (search order ref, append to url, fetch data) http://i.imgur.com/6RVsHof.gif

  // Ionic Starter App

  // angular.module is a global place for creating, registering and retrieving Angular modules
  // 'starter' is the name of this angular module example (also set in a <body> attribute in index.html)
  // the 2nd parameter is an array of 'requires'
  angular.module('starter', ['ionic','ngCordova'])

  .run(function($ionicPlatform) {
    $ionicPlatform.ready(function() {



      if(window.cordova && window.cordova.plugins.Keyboard) {
        // Hide the accessory bar by default (remove this to show the accessory bar above the keyboard
        // for form inputs)
        cordova.plugins.Keyboard.hideKeyboardAccessoryBar(true);

        // Don't remove this line unless you know what you are doing. It stops the viewport
        // from snapping when text inputs are focused. Ionic handles this internally for
        // a much nicer keyboard experience.
        cordova.plugins.Keyboard.disableScroll(true);
      }
      if(window.StatusBar) {
        StatusBar.styleDefault();
      }
    });
  })

  .config(function($stateProvider, $urlRouterProvider) {

    $stateProvider
      .state('tabs', {
        url: '/tab',
        abstract: true,
        templateUrl: 'templates/tabs.html'
      })
      .state('tabs.home', {
        url: '/home',
        views: {
          'home-tab' : {
           templateUrl: 'templates/home.html'
          }
        }
      })
      .state('tabs.list', {
        url: '/list',
        views: {
          'list-tab' : {
           templateUrl: 'templates/list.html',
           controller: 'ListController'
          }
        }
      })
      .state('tabs.detail', {
        url: '/list/:aId',
        views: {
          'list-tab' : {
           templateUrl: 'templates/detail.html',
           controller: 'ListController'
          }
        }
      })

        // if none of the above states are matched, use this as the fallback
        $urlRouterProvider.otherwise('/tab/home');

  })

  .controller('ListController', ['$scope', '$http', '$state','$cordovaBluetoothSerial', '$window', '$location', function($scope, $http, $state, $cordovaBluetoothSerial, $window, $location) {
          $http.get('http://example.com/api/booking/get/guest/{{ query }}').success(function(data) {
            $scope.orders = data;
            $scope.whichorder = $state.params.aId;

          })

          $scope.orders = [];

           function onPay(order) {
           var itemsArr = [];
           var invoice = {};
           var myItems = {};
           var myItem = {};
           //var order = $scope.orders[];

           myItem['name'] = "Sphero";
           myItem['description'] = "A robotic ball that can be controlled via apps";
           myItem['quantity'] = "1.0";
           myItem['unitPrice'] = order.bkor_subtotal;
           myItem['taxRate'] = '0.0';
           myItem['taxName'] = 'Tax';
           itemsArr.push(myItem);
           myItems['item'] = itemsArr;

           invoice['itemList'] = myItems;
           invoice['paymentTerms'] = 'DueOnReceipt';
           invoice['currencyCode'] = 'GBP';
           invoice['discountPercent'] = '0';
           invoice['merchantEmail'] ="[email protected]";
           invoice['payerEmail'] = '[email protected]';

           var returnUrl = order.bkor_seatcount;
           var retUrl = encodeURIComponent(returnUrl + "?{result}?Type={Type}&InvoiceId={InvoiceId}&Tip={Tip}&Email={Email}&TxId={TxId}");
           //var pphereUrl = "paypalhere://takePayment/?returnUrl={{returnUrl}}&invoice=%7B%22merchantEmail%22%3A%22{{merchantEmails}}%22,%22payerEmail%22%3A%22{{payerEmails}}%22,%22itemList%22%3A%7B%22item%22%3A%5B%7B%22name%22%3A%22{{name}}%22,%22description%22%3A%22{{description}}%22,%22quantity%22%3A%221.0%22,%22unitPrice%22%3A%22{{price}}%22,%22taxName%22%3A%22Tax%22,%22taxRate%22%3A%220.0%22%7D%5D%7D,%22currencyCode%22%3A%22{{currency}}%22,%22paymentTerms%22%3A%22DueOnReceipt%22,%22discountPercent%22%3A%220.0%22%7D";
           var pphereUrl = "paypalhere://takePayment/v2?returnUrl=" + retUrl;
           pphereUrl = pphereUrl + "&accepted=cash,card,paypal";
           pphereUrl = pphereUrl + "&step=choosePayment";
           pphereUrl = pphereUrl + '&invoice=' + escape(JSON.stringify(invoice));
           console.log(pphereUrl);

           return pphereUrl;

           }

          $scope.pay = function (order) {
          var url = onPay(order);
          window.open(url, "_system");
          }
  }]);
share|improve this question
    
Is there any way you could get some server side code like PHP or Node.JS running to parse the JSON faster than client side? It would be ideal to store in a database. If you must use a static JSON file, could you make each index be equivalent to the id? so for id=12145, the item is the 12146th item in the list (starting from zero). So, then you can get all the guests and just do a guests[guestID] to get the correct guest. – forrestmid Jun 15 at 1:48
    
Possible duplicate of Search AngularJS resource using query string – Paul Sweatte Jul 27 at 19:10

Your Answer

 
discard

By posting your answer, you agree to the privacy policy and terms of service.

Browse other questions tagged or ask your own question.