Added $location service to redirect after form submission. Also added…

… labels to form elements.
phillipkregg · May 18, 2012 · a95d973 · a95d973
1 parent 846e985
commit a95d973
Show file tree

Hide file tree

Showing 3 changed files with 29 additions and 25 deletions.
diff --git a/app/assets/javascripts/app/controllers/controllers.js b/app/assets/javascripts/app/controllers/controllers.js
@@ -2,14 +2,9 @@
 
 'use strict';
 
-var ContactListCtrl = ['$scope', '$http', 'Contacts', function($scope, $http, Contacts) {  	
-
-  $scope.contacts = Contacts.index();    
-
-  $("#test_btn").click(function() {
-  	 alert($scope.newFirstName);
-  });
+var ContactListCtrl = ['$scope', '$http', '$location', 'Contacts', function($scope, $http, $location, Contacts) {  	
 
+  $scope.contacts = Contacts.index();     
 
   $scope.addContact = function() {
 		var newContact = {
@@ -43,6 +38,9 @@ var ContactListCtrl = ['$scope', '$http', 'Contacts', function($scope, $http, Co
 	 		$scope.newZipcode = "";
 	 		$scope.newZipcode = "";
 	 		$scope.newEmail = "";
+
+	 		//redirect
+	 		$location.path('/#/contacts');
 	    	})
 	    }
 

diff --git a/app/assets/javascripts/app/partials/new-contact.html.erb b/app/assets/javascripts/app/partials/new-contact.html.erb
@@ -3,8 +3,11 @@
 		<h3>Add New Contact</h3>
 	</div>
 		<form id="contact_form" ng-submit="addContact()">
-			<input type="text" id="new_contact_first_name" name="newContactFirstName" ng-model="newFirstName" placeholder="First Name"></br>
-			<input type="text" id="new_contact_last_name" name="newContactLastName" ng-model="newLastName" placeholder="Last Name"></br>
+			<label>First Name</label>
+			<input type="text" id="new_contact_first_name" name="newContactFirstName" ng-model="newFirstName"></br>
+			<label>Last Name</label>
+			<input type="text" id="new_contact_last_name" name="newContactLastName" ng-model="newLastName" ></br>
+			<label>Salutation</label>
 			<select id="salutation" name="salutation" ng-model="newSalutation">
 				<option value="">Pick a Salutation</option>
 				<option value="mr">Mr</option>
@@ -15,16 +18,22 @@
 				<option value="space_cowboy">Space Cowboy</option>
 				<option value="gangster_of_love">Gangster of Love</option>
 			</select></br>
-			<input type="text" id="new_contact_phone" name="newContactPhone" ng-model="newPhoneNum" placeholder="Phone Number"></br>
+			<label>Phone Number</label>
+			<input type="text" id="new_contact_phone" name="newContactPhone" ng-model="newPhoneNum" ></br>
+			<label>Phone Type</label>
 			<select id="phone_type" name="state" ng-model="newPhoneType">
 				<option value="">Pick your Phone Type</option>
 				<option value="home">Home</option>
 				<option value="mobile">Mobile</option>
 				<option value="work">Work</option>
 			</select></br>
-			<input type="text" id="new_contact_address1" name="newContactAddress1" ng-model="newAddress1" placeholder="Address 1"></br>
-			<input type="text" id="new_contact_address2" name="newContactAddress2" ng-model="newAddress2" placeholder="Address 2"></br>
-			<input type="text" id="new_contact_city" name="newContactCity" ng-model="newCity" placeholder="City"></br>			
+			<label>Address 1</label>
+			<input type="text" id="new_contact_address1" name="newContactAddress1" ng-model="newAddress1" ></br>
+			<label>Address 2</label>
+			<input type="text" id="new_contact_address2" name="newContactAddress2" ng-model="newAddress2" ></br>
+			<label>City</label>
+			<input type="text" id="new_contact_city" name="newContactCity" ng-model="newCity" ></br>			
+			<label>State</label>
 			<select id="state" name="state" ng-model="newState">
 				<option value="">Pick your state</option>
 				<option value="AL">Alabama</option>
@@ -79,28 +88,25 @@
 				<option value="WI">Wisconsin</option>
 				<option value="WY">Wyoming</option>
 			</select></br>
-			<input type="text" id="new_contact_zipcode" name="newContactZipcode" ng-model="newZipcode" placeholder="Zip Code"></br>
-			<input type="text" id="new_contact_email" name="newContactEmail" ng-model="newEmail" placeholder="Email Address"></br>
+			<label>Zip Code</label>
+			<input type="text" id="new_contact_zipcode" name="newContactZipcode" ng-model="newZipcode" ></br>
+			<label>Email</label>
+			<input type="text" id="new_contact_email" name="newContactEmail" ng-model="newEmail" ></br>
 			<input type="button" id="contact_submit_btn" value="Add Contact" class="btn btn-primary">
-			<input type="button" id="test_btn" value="What's the value"/>
+			<a href="/#/contacts" class="btn">Cancel</a>
 		</form>
 
 
 
 </div>
 
 <script type="text/javascript">
-	$(document).ready(function(){
+	$(document).ready(function(){	
 
-
-
-		//alert("loaded");
-		$("#contact_submit_btn").click(function(){
-			//alert("button clicked");
+		$("#contact_submit_btn").click(function(){			
 			$("#contact_form").submit();
-		});
 
-
+		});	
 
 	});
 

diff --git a/app/views/home/index.html.erb b/app/views/home/index.html.erb
@@ -9,7 +9,7 @@
        <a class="brand" href="#">Contact Management</a>
        <div class="nav-collapse">
          <ul class="nav">
-           <li class="active"><a href="/">Contacts List</a></li>           
+           <li class="active"><a href="/#/contacts">Contacts List</a></li>           
          </ul>
        </div><!--/.nav-collapse -->
      </div>