Posts

Showing posts from 2016

Handling Time Zone across from UI to DB

So I thought about writing a bit about handling date variables across WebAPI to Angular. The Problem When saving date / datetime values sent from the front end how do we keep the timezone information and how do we show them back on the UI. For example let's say you use a simple online note taking application. You wrote a note 8 am in the morning when you were in WA. Now you are looking at your notes from Vic and what time do you want the note to show as the created date/time ? Well I can't tell you what time you should show as it's a business case but I can tell you how to store the time information so that regardless of what time you need to show, you can achieve that. The Solution Code on GitHub  https://github.com/kumudug/DateTime-handling-Front-to-Back What the code demos...... On the WebAPI side You can store the date time values in 2 ways As UTC values in a DateTime variable in SQL Server In a DateTimeOffset variable in SQL server with

Setting up KDiff3 to work with TortoiseGIT

Image
Setting up KDiff3 to work with TortoiseGIT When I work with git I do most of my work on the command line except for a few tasks. Resolving conflicts is one of them. So when it comes to resolving conflicts I prefer the KDiff3 instead of the TortoiseGIT diff. I was googling around to find the proper way and after grabbing things from difference places here is what I did. Obvious steps  :) Install git Install KDiff3 Install TortoiseGIT Then after that Open tortoise GIT settings Go to "Diff Viewer" Go to section "Configure the program used for comparing different revisio...." Choose "External" Enter the following "[ kdiff3 instalation path ]\kdiff3.exe %base %mine --L1 %bname --L2 %yname" Go to "Merge Tool" Choose "External" Enter the following "[ kdiff3 instalation path ]\kdiff3.exe %base %mine %theirs -o %merged" Click apply I will soon write something to show how to actually resolve

Angular directive to validate a decimal input field with min/max

Image
I came across a requirement to validate a simple numeric input field with a minimum and a maximum value. So I tried using the html5 validations first like so    < input   type= "number"   name= "quantity"   min= "1"   max= "5" > The above works perfectly until you need to have decimal minimum and maximum values. So I thought why not write a directive to support this. The code can be found in the following GitHub repo https://github.com/kumudug/angular_min_max_validate  The directive supports the following Decimal min and max validation Decimal min value only validation Decimal max value only validation Usage <input type= "number" class= "form-control" id= "decimal1" name= "decimal1" ng-model= "vm.dec1" required ch-validate-min-max min-val= "0.2" max-val= "1.7" > Initial View After validation is triggered

Inline editing using ng-table

Image
I was working on an enterprise application that needed table in-line editing. I thought why engineer something from scratch when we can use something that's already out there. After doing some looking around ng-table was the preferred option. It supported sorting, filtering etc which were required functionalities but it didn't mention anything about in-line editing. So I started looking at the API on my own. I noticed that the API supports loading data using the "NgTableParams" and I used this service to control the view. Instead of blabbering on I will let the code do the talking. The sample code is hosted in the following GitHub url https://github.com/kumudug/ng-table-inline-editing The code supports the following Adding new items with validation Editing existing items with validation Deleting items with confirmation Undo add, edit and delete

ngTable with custom sort [empty values first]

Image
Let me start by saying the background story I was building a simple grid layout for an enterprise project and the requirement was to show the details in a grid view and the grid view needed sorting. So I just spent a couple of hours to set up the required bower packages for ng-table  and write a simple html template and the angular code to support it and I thought I was done.   Not so fast....... The test came back failed with reasoning "Sorting is not working as expected.". Apparently they wanted the empty values to be displayed on top in an "Ascending" order which is not the default feature of AngularJS  orderby filter . So this is how I fixed it. GitHub repo for the proof of concept:  https://github.com/kumudug/ng-table-customBinding-sorting-inlineEditing Problem When implementing sorting, I used the default AngularJS orderby filter service. Which puts empty values at the bottom. According to the requirement specification this was not