angularjs - sending data to server using services and controllers -
i want send data client side server side. want send data using service , controller. data won't pass server side,
this view.html
<section class="af-wrapper"> <h3 id="addstyles">add styles</h3> <form class="af-form" id="af-form" novalidate> <label for="input-name" class="header">header image</label> <input type="file" fileread="styles.uploadme"/> <b id="preview">preview:</b> <img src="{{styles.uploadme}}" ng-model="styles.vm.uploadme" width="100" height="50" alt="image preview..."> <div style="white-space:nowrap"> <label for="mycolor" class="background">background</label> <color-picker ng-model="styles.mycolor" class="colorpicker"></color-picker> </div> <br /> <label for="fonts" class="fonttitles">font titles</label> <div ng-controller="stylesctrl"> <div id="fontdropdown"> <select ng-options="font font in fonts" ng-model="styles.textsize.font"></select> </div> <br /> <h3 ng-style="{'font-family': styles.textsize.font, 'font-size': styles.textsize.size + 'px'}">text is</h3> <div class="fontsize">font size slider</div> <br /> <input class="slider" min="12" max="24" ng-model="styles.textsize.size" type="range"> </div> <input type="submit" ng-click='addstyles(styles)' value="add styles"/> </form> </section> this controller font , font sizes
(function () { 'use strict'; angular.module("appbuilderapp").controller("stylesctrl", ["$scope",stylesctrl]); function stylesctrl($scope) { $scope.fonts = [ "arial", "tahoma" ]; $scope.textsize = { font: "arial", size: 18 }; } })(); this controller send data
(function() { 'use strict'; angular.module('appbuilderapp').controller('templateeditorctrl', [ '$scope', '$auth', '$http', '$sce', 'constants', '$stateparams', 'ngdialog', 'server_url', 'alert', 'fileuploader', 'upload','appstylesresource', templateeditorctrl ]); function templateeditorctrl($scope, $auth, $http, $sce, constants, $stateparams, ngdialog, server_url, alert, fileuploader, upload,appstylesresource) { appstylesresource.getfonts() .success(function(data) { $scope.addstyles = data; }); $scope.addstyles = function(styles) { header:styles.uploadme; color: styles.mycolor; font: styles.textsize.font; fontsize: styles.textsize.size; console.log(styles); if(styles != null){ appstylesresource.addfonts($scope.header) .success(function(data){ $scope.addstyles = {}; $scope.addstyles = data; }) } }; } })(); this service
(function(){ 'use strict'; angular.module('appbuilderapp').service('appstylesresource',[ '$http', 'server_url',appstylesresource]); function appstylesresource($http,server_url){ return { getfonts : function() { return $http.get(server_url + 'api/templateedit/addstyles'); }, addfonts : function(fontdata){ return $http.post(server_url + 'api/templateedit/addstyles' + fontdata); } } } })(); my aim inputs user , send server, want use service , controller this. please resolve problem
please fix line of code.
return $http.post(server_url + 'api/templateedit/addstyles' + fontdata); to
return $http.post(server_url + 'api/templateedit/addstyles' , fontdata); and see below changes
$scope.addstyles = function(styles) { $scope.header = { header:styles.uploadme, color: styles.mycolor, font: styles.textsize.font, fontsize: styles.textsize.size }; console.log(styles); if(styles){ appstylesresource.addfonts($scope.header) .success(function(data){ $scope.addstyles = {}; $scope.addstyles = data; }) } }; 
Comments
Post a Comment