0 Replies - 383 Views - Last Post: 16 October 2015 - 06:11 AM

#1 sampsoninc916   User is offline

  • New D.I.C Head

Reputation: 0
  • View blog
  • Posts: 25
  • Joined: 14-February 13

AngularFire - Get data from Firebase and put in other Firebase

Posted 16 October 2015 - 06:11 AM

I am working on learning AngularFire, and I need to figure out how to get data from one Firebase table and put it in another Firebase table programmatically. My friend Eljay suggests that I have two separate references. If that's the case, then where do I put the two separate references? The factory or the controller?

displayquotes.js:

var app = angular.module("myApp", ["firebase"]);

app.factory("quotesList", ["$firebaseArray", function ($firebaseArray) {
    var randomquoteId = Math.round(Math.random() * 12);
    var ref = new Firebase("https://cana-1.firebaseio.com/");
    return $firebaseArray(ref);
}]);

app.factory("quotesListadded", ["$firebaseArray", function ($firebaseArray) {
    var quotenum = new Firebase("https://cana2.firebaseio.com/1/QuoteNum");
    var project = new Firebase("https://cana2.firebaseio.com/1/Project");
    var lastupdateuserid = new Firebase("https://cana2.firebaseio.com/1/LastUpdateUserID");
    var lastupdated = new Firebase("https://cana2.firebaseio.com/1/LastUpdated");
    var status = new Firebase("https://cana2.firebaseio.com/1/Status");
    var quoteid = new Firebase("https://cana2.firebaseio.com/1/QuoteID");
    var finalsalesid = new Firebase("https://cana2.firebaseio.com/1/FinalSalesID");

    var quotenumarray = $firebaseArray($scope.quotenum);
    var projectarray = $firebaseArray($scope.project);
    var lastupdateuseridarray = $firebaseArray($scope.lastupdateuserid);
    var lastupdatedarray = $firebaseArray($scope.lastupdated);
    var statusarray = $firebaseArray($scope.status);
    var quoteidarray = $firebaseArray($scope.quoteid);
    var finalsalesidarray = $firebaseArray($scope.finalsalesid);

    return quotenumarray, projectarray, lastupdateuseridarray, lastupdatedarray, statusarray, quoteidarray, finalsalesidarray;
}]);

app.controller("QuotesController", ["$scope", "quotesList", "quotesListadded", function ($scope, quotesList) {
    $scope.quotes = quotesList;
    $scope.addedquotes = quotesListadded;

    // a method to create new messages; called by ng-submit
    $scope.addQuote = function () {
        // calling $add on a synchronized array is like Array.push(),
        // except that it saves the changes to our database!
        $scope.quotesList.$add({
            QuoteNum: $scope.quotenumarray,
            Project: $scope.projectarray,
            LastUpdateUserID: $scope.lastupdateuseridarray,
            LastUpdated: $scope.lastupdatedarray,
            Status: $scope.statusarray,
            QuoteID: $scope.quoteidarray,
            FinalSalesID: $scope.finalsalesidarray
        });

        // reset the message input
        $scope.message = "";
    };
}]);


quotes.html:

<!doctype html>
<html ng-app="myApp">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<!-- The above 3 meta tags *must* come first in the head; any other head content must come *after* these tags -->
<meta name="description" content="">
<meta name="author" content="">
<title>Cana Communications Quote System</title>
<link href="bootstrap.min.css" rel="stylesheet">
<link href="navbar-fixed-top_quotes.css" rel="stylesheet">
</head>

<body>
<nav class="navbar navbar-default navbar-fixed-top">
      <div class="container">
        <div class="navbar-header">
          <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar" aria-expanded="false" aria-controls="navbar">
            <span class="sr-only">Toggle navigation</span>
            <span class="icon-bar"></span>
            <span class="icon-bar"></span>
            <span class="icon-bar"></span>
          </button>
        </div>
        <div id="navbar" class="navbar-collapse collapse">
          <ul class="nav navbar-nav">
            <li class="dropdown"><a href="quotes.html" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">Quotes<span class="caret"></span></a>
            <ul class="dropdown-menu">
            	<li><a href="quotes.html">View</a></li>
                <li><a href="quotes.html">Filter</a></li>
                <li><a href="quotes.html">New</a></li>
                <li><a href="quotes.html">Installation Multiplier</a></li>
            </ul>
            </li>
            <li><a href="submittedquotes.html">Awaiting Approval</a></li>
            <li><a href="salesreviewedquotes.html">Sales Review</a></li>
            <li><a href="engineeringquotes.html">Engineering</a></li>
            <li><a href="backlog.html">Reporting</a></li>
            <li><a href="users.html">Administration</a></li>
            <li><a href="signinpage.html">Log Off</a></li>
          </ul>
        </div><!--/.nav-collapse -->
      </div>
      <br>
    </nav>

    <div class="container">

      <!-- Main component for a primary marketing message or call to action -->
      <div class="jumbotron" ng-controller="QuotesController">
        <div class="tabletop">
        <h3>Quotes</h3>
        <p>
        <button type="button" class="btn btn-xs btn-new">New</button>
        <button type="button" class="btn btn-xs btn-view">Filter</button>
        <button type="button" class="btn btn-xs btn-filter">Print</button>
        </p>
        </div>
      	<table class="table table-bordered">
        	<thead>
            	<tr>
                	<th>Quote</th>
                    <th>Project</th>
                    <th>Created By</th>
                    <th>Created On</th>
                    <th>Status</th>
                    <th>Archive</th>
                    <th>Job #</th>
                </tr>
            </thead>
            <tbody>
            	<tr ng-repeat="quote in quotes">
                	<td>{{ quote.QuoteNum }}</td>
                    <td>{{ quote.Project }}</td>
                    <td>{{ quote.LastUpdateUserID }}</td>
                    <td>{{ quote.LastUpdated }}</td>
                    <td>{{ quote.Status }}</td>
                    <td>{{ quote.QuoteID }}</td>
                    <td>{{ quote.FinalSalesID }}</td>
                </tr>
            </tbody>
	  	</table>
        <div class="bottomout">
        </div>
        <br><br>
        <button type="button" class="btn btn-xs btn-filter" ng-click="addQuote()">Add Quote</button>
      </div>
    </div>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.4/jquery.min.js"></script>
<!-- Latest compiled and minified Bootstrap Javascript -->
  <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.min.js"></script>
  <!-- Latest compiled and minified Angular Javascript -->
  <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.7/angular.min.js"></script>
  <!-- ngRoute -->
  <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.7/angular-route.js"></script>
  <!-- Firebase -->
  <script src="https://cdn.firebase.com/js/client/2.3.1/firebase.js"></script>
  <!-- AngularFire -->
    <script src="https://cdn.firebase.com/libs/angularfire/1.1.3/angularfire.min.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/angular-ui-bootstrap/0.14.2/ui-bootstrap.min.js"></script>
      <script src="js/displayquotes.js"></script>

</body>
</html>


Is This A Good Question/Topic? 0
  • +

Page 1 of 1