Search Posts

Author: Joe

Convert Jquery function to AngularJS [on hold]

I’m trying to implement a function which triggers an event after user has finished typing. The implementation is done on Jquery but i want to convert it to AngularJS. Any help would be highly appreciated. I’m using the AngularJS version of 1.4.3. Here is the function: (function($){ $.fn.extend({ donetyping: function(callback,timeout){ timeout = timeout || 1e3; // 1 second default timeout var timeoutReference, doneTyping = function(el){ if (!timeoutReference) return; timeoutReference = null;; }; return this.each(function(i,el){ […]

Radio button to switch Text Input and submit as text

I have a form built with rails5 and AngularJS 1.6.x. There are 5 radio buttons within a form. The last radio is labeled ‘Other’ and on click, it activates an input text field instead of using the radio. The on and off switch is not a problem. The problem occurs when both ‘Other'(radio) and ‘Other'(text) are both active. If I submit the form by having ‘Other’ radio active, I get the following rails error message: […]

Custom ordering in angularjs list

I have a list of objects something as follows { “Info”:[ { “Id”:1, “shortId”:”PH”, “description”:”Phone” }, { “Id”:2, “shortId”:”Email”, “description”:”Email” }, { “Id”:3, “shortId”:”M-AD”, “description”:”Mailing Address” }, { “Id”:4, “shortId”:”B-AD”, “description”:”Billing Address” }, { “Id”:5, “shortId”:”OTH”, “description”:”Other” } ] } I am ordering them by the ID and displaying on the UI. But now the ordering should be { “Info”:[ { “Id”:2, “shortId”:”Email”, “description”:”Email” }, { “Id”:1, “shortId”:”PH”, “description”:”Phone” }, { “Id”:4, “shortId”:”B-AD”, “description”:”Billing Address” […]

ng-change not working, AngularJS 1.x

AngularJS 1.59 When I edit the quantity input field the ng-change event doesn’t fire. In Chrome Dev Tools I place a breakpoint on $scope.updateToggle and it is never hit. I’ve looked at other posts on SO but cannot see what I’m doing wrong. HTML: @section scripts { <script src=”@Url.Content(“~/Binding/ViewModels/CartViewModel.js”)” type=”text/javascript”></script> } <br /> <span class=”cart-header”>Shopping Cart</span> <div data-ng-app=”appCart”> <div ng-controller=”CartViewModel”> <div class=”spinner-config” ng-show=”viewModelHelper.isLoading”> <i class=”fa fa-spinner fa-spin”></i> </div> <span style=”padding-left:600px”></span> <span class=”cart-price-header”>Price</span> <span class=”cart-quantity-header”>Quantity</span> <hr […]

Angularjs: How to access specific item in ng-repeat

I have a custom directive that consists of a list of buttons dynamically created through ng-repeat as follows: HTML <div ng-controller=”toggleButtonController” ng-init=”init()” id=”parent”> <div ng-repeat=”btn in setting” style=”display:inline”> <button class=”btn” ng-bind=”” ng-click=”click(btn)” ng-class=”getClass(btn, toggleButton.selected)”></button> </div> </div> CONTROLLER var app = angular.module(‘toggleButtonMod’, []) app.directive(‘toggleButton’, function() { return { restrict: ‘E’, scope: { setting: ‘=’ }, templateUrl: “app/Shared/togglebutton/toggleButtonView.html” } }) app.controller(“toggleButtonController”, function($scope) { $scope.init = function() { $scope.setupContent(); } $scope.setupContent = function() { $scope.toggleButton = {selected: null}; […]

Angularjs Manipulate each ng-repeat elements

I have a Custom directives that acts as a widget containing a list of buttons based on parameters passed in setting. Setting passed in ng-repeat $scope.btnGroup = [{“name”:”toggle 1″},{“name”:”toggle 2″}]; HTML <div ng-controller=”toggleButtonController” ng-init=”init()” id=”parent”> <div ng-repeat=”btn in setting” style=”display:inline”> <button class=”btn btn-default” ng-bind=”” ng-click=”click()”></button> </div> So right now, my scenario is when i click one of the buttons, it will set the clicked button to btn-primary class and others to btn-default class and vice […]

How to attach event to dom created in link function

I know that dom created in template function can be attached to an event in controller.As: angular.module(‘app’, []) .directive(‘appClick’, function(){ return { restrict: ‘A’, scope: true, template: ‘<button ng-click=”click()”>Click me</button> Clicked {{clicked}} times’, controller: function($scope, $element){ $scope.clicked = 0; $ = function(){ $scope.clicked++ } } } }); As there is no scope in template so I have to use link function. The same how can I achieve in link function. Like: angular.module(‘app’, []) .directive(‘appClick’, function(){ […]

CORS configuration on IIS 6 webserver

From an angular 4 application I’m trying to access an older .aps webpage on an IIS server. I am getting a 401 error which I believe is CORS related. Based on information I found I have configured the IIS server with the following header information: Access-Control-Allow-Origin: * Access-Control-Allow-Methods: GET,PUT,POST,DELETE,OPTIONS Access-Control-Allow-Headers: Content-Type I have done both at the application level and at the webserver level. But I still get the 401 error. The information I am […]

AngularJS md-autocomplete return all possible substrings

I’m using md-autocomplete to let users search through subjects at my university. The problem is my search function only searches sequentially (left to right) through each display value. For example: If I search “Arts and Architecture” I get “no results found”, which I do not want to happen. I would like “Arts and Architecture” to return a result. The subjects are in this format: $scope.subjects = [ { value: ‘AA’, display: ‘AA – Arts and […]