Anthony's Blog

   The truth is if you want to take server side models for example in Asp.net Mvc directly to a client side mvc framework's enviroment the common approach is via ajax. What has me troubled about this approach is that in some cases we already know the information that will be passed from server side to client before the call based on the request in some cases. So why do we make clients call this ajax? It's simply because we don't have enough ways to bridge the two technologies. Now just to be clear I'm not talking about third party api's or in any extreme case where the data is so dynamic that it is dependent on the front-end. What I am talking about is in cases where the data is in within the web application and we know what is needed by the page request. In case I haven't made myself clear (probably not) here is an example of what I mean. Example       I'm going to use an example from a Asp.net Mvc perspective just because that is what I'm familar w

   From a front-end standpoint it's easy to use ng-grid since a lot of the variables already exist. What I did in my implementation was leverage as much of ng-grid as possible before creating my own functions. Displayed fields in the grid that are checked by default are also checked in the export dialog. This feature was written up to handle hidden fields in the grid as well and gives the user the option to select or deselect all the available fields to export. However this example assumes that "name" field is a key on the server side and if passed to the server could give you whatever is in the database. So if you were looking to attach this to a more meaningful system you would pass just the key and fields to the server in order to get your results.   Solution: <!--Html part--> <button type="button" class="btn btn-success pull-right" data-toggle="modal" data-target="#exportModal">Export to Data</button> <

    This article is just a quick note for some of the things I have forgotten sadly Html but also give an example using AngularJs. Basic Html Solution < input id = "1" type = "checkbox" /> < label for = "1" > TEST </ label > AngularJs Solution < input id = "{{$index}}" type = "checkbox" /> < label for = "{{$index}}" ng-model = "field" ></ label > Thoughts    If I was going to make this more scalable I would need to guarantee that the id is unique. It might become a problem if I'm using multiple ng-repeats then the index would not be so special in the view , maybe I can do the index plus the number for that particular element. Resources Clicking the text to select corresponding radio button - Stack Overflow http://plnkr.co/edit/llSc8o?p=preview

    This is a issue I call the angularjs "blinking syntax" because for a quick second users are able to see angularjs syntax in the web page, which isn't good. This issue becomes a greater problem for those with a slow connection. Cause is simple, using  {{}}  inline, which is much slower compared to other methods. Instead one solution is to use the ng-bind inline or can also create a directive. Resource why ng-bind is better than {{}} in angular? - Stack Overflow inline conditionals in angular.js - Stack Overflow  - Also by using a directive you can separate your logic more. Making your code cleaner or easier to maintain. ng-cloak/ng-show elements blink - Stack Overflow  - This will not always solve the problem, but using this along with ng-bing or a directive I think is appropriate. 

    With my recent experience using ng-grid, I came up with two dynamic variables that would display based on the location of where they were in relationship to a particular page. I wasn't sure how to find a specific example on this. Since most might wrap this up with pagination concept it's difficult to find something on this for Ng-grid.. Not that I need an example but I like to think of them as separate, or as metadata. Dependency      I could have made the dependency on a ajax  return call but I had multiple ways for the Grid data to be insert, so rather than set it at that point I just hooked in the dom. If you wanted to go the other route just change the  self.domAccessProvider call  to whatever you name your data object in the grid . As for the start number this is easier to handle, so there is no dependencies. Solution $scope.endItem = function () { var self = this; //Last page... if (self. maxPages () == self.pagingOptions.currentPage)

    I don't think I need to explain the setup here since the title explains it all and if not there are similar questions I found that can explain the question for me (in the resource). The Solution  Example , I didn't write this example but I did think of one way to improve upon  it. If we have already defined the styles as classes we can than use the $odd or $even in ng-repeat. Since $odd or $even are Boolean we can use either one with a inline if statement and give the <li> tag a class based on it. I haven't tested this but I'm sure it will work, what I actually am curious about is that in the example the definition of odd and even since ng-repeat also have these variables. I wonder if they would ever have a conflict? As a side note for myself note that the example isn't in a un-order list but rather a div . That could another possibly reason behind my issue below. A Possible Alternative Solution column-count - CSS | MDN  -  Example Problems

    I wrote this little snippet for some requirements a while back but since it's so general and if it helps the project to have a quick template to grab it I think it would be much greater to share. Also I was just wanted to write out the documentation as I was learning Angularjs along with ng-grid for the first time during the time I wrote it. So it should be clear that the dependencies are Font-awesome ,  Ng-grid  and Angularjs for this snippet. When I wrote this when I was using Angularjs v1.2.16 stable, font-awesome v4.1.0 both it should not be a problem moving forward but with Ng-grid I used v2.7. It may break with later version as I know a lot has or will change in the template. This snippet should work in all browser but I only tested for Chrome, FireFox, IE8 and greater. My Code $templateCache.put("headerCellTemplate.html", "<div class=\"ngHeaderSortColumn {{col.headerClass}}\" ng-style=\"{'cursor': col.cursor}\" ng

Task For ng-grid I have a set of fields in which they are pulled in via ajax however, when I have setup the cell template I need to not only display one field as a column but instead in the first column with the second another field. Solution I feel the documentation wasn't very clear on this point but the solution is simply using row.getProperty()  with the field you want in quotes. Plunker Example  using two column in the same column definition. Resources Defining columns · angular-ui/ng-grid Wiki · GitHub Templating · angular-ui/ng-grid Wiki · GitHub cellTemplate and grouping: can I change the template for the 'grouping' row - Stack Overflow how to apply field on cell Template using ng-grid - Stack Overflow