June 2014 - Development Simply Put

A blog simplifies main concepts in IT development and provides tips, hints, advices and some re-usable code. "If you can't explain it simply, you don't understand it well enough" -Albert Einstein

  • Development Simply Put

    If you can't explain it simply, you don't understand it well enough.

    Read More
  • Integrant

    Based in the U.S. with offshore development centers in Jordan and Egypt, Integrant builds quality custom software since 1992. Our staff becomes an extension of your team to eliminate the risks of software development outsourcing and our processes...

    Read More
  • ITWorx

    ITWorx is a global software professional services organization. Headquartered in Egypt, the company offers Portals, Business Intelligence, Enterprise Application Integration and Application Development Outsourcing services to Global 2000 companies.

    Read More
  • Information Technology Institute

    ITI is a leading national institute established in 1993 by the Information and Decision Support Centre.

    Read More


How To Access ASP.NET Web.config AppSettings On Client-Side Javascript

You can download the code presented into this post from here

There are many ways by which you can access your ASP.NET web application web.config application settings through your client-side javascript code. The common thing between all of these ways is that to do so you for sure need to access the server-side.

The most proper way I prefer is to load all your application settings in a batch the first time your page is loaded and I think the best practice here is to use a handler to achieve this task. The handler will be responsible for accessing the web.config and retrieving all the application settings keys and their corresponding values and finally returning the response as a javascript file to be loaded once the handler is requested.

This way all what you have to do is to include the handler as a javascript resource on your page or master page then once the page is loaded you will have all your application settings as javascript variables.

Let's have a look on the code below to see what I am talking about.

<?xml version="1.0"?>

  For more information on how to configure your ASP.NET application, please visit

      <compilation debug="true" targetFramework="4.5" />
      <httpRuntime targetFramework="4.5" />

    <add key="SampleSetting" value="This is the setting value"/>

using System;
using System.Collections.Generic;
using System.Configuration;
using System.Globalization;
using System.IO;
using System.Linq;
using System.Web;
using System.Web.SessionState;
using System.Collections.Specialized;

namespace DevelopmentSimplyPut.Handlers
    public class ClientGlobalVars : IHttpHandler, IRequiresSessionState 
        public void ProcessRequest(HttpContext context)
   context.Response.ContentType = "application/x-javascript";
   context.Response.CacheControl = Convert.ToString(HttpCacheability.Public);
            context.Response.Write("var AppSettings = new Object();\n");

            NameValueCollection appSettings = ConfigurationManager.AppSettings;

            for (int i = 0; i < appSettings.Count; i++)
                string key = appSettings.GetKey(i);
                string value = appSettings.Get(i);
                context.Response.Write(string.Format(CultureInfo.InvariantCulture, "AppSettings.{0} = '{1}';\n", key, value));

        public bool IsReusable
                return false;

<%@ WebHandler Language="C#" CodeBehind="ClientGlobalVars.ashx.cs" Class="DevelopmentSimplyPut.Handlers.ClientGlobalVars" %>

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Default.aspx.cs" Inherits="AccessAppSettingsFromJs.Default" %>

<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <script type="text/javascript" src="/Handlers/ClientGlobalVars.ashx"></script>

    <form id="form1" runat="server">

So now once you open Default.aspx in a web browser you get the result in the image below.

That's it. You can now access your application settings from client-side javascript.


Paging Concept - The Main Equations To Make It Easy

The paging concept is used in many fields that it is even used in our daily lives. When you have a set of items and you want to divide them equally between some sort of containers or groups, you are thinking of paging but may be you don't recognize it.

The aim of this post is to explain some mathematical equations which can make it easy for you to implement the paging concept. If you are expecting to find explanations for the paging concept on specific applications like operating systems memory management or file system or whatever, then you are reading the wrong article.

The best way to explain paging is to apply on an example. Let's assume that we have a collection of 10 items and we want to divide these 10 items into groups where each group contains 3 items.

If we apply the calculations manually, we will have the items distributed as in the image below.

This was easy as the items count is not that big but this is not always the case. Also, we need to come up with the mathematical operation or equation which can be used to carry out the paging task automatically or through code.

After some analysis you will find that the mathematical relation will end up as in the image below.

The equation states that when we divide the "Item Index" on "Page Size", we get the "Page Index" and the remainder will be the "Item Index Per Page". Let's apply this mathematical equation on the example we have on hand right now.

When we divided "Item Index = 2" (Third item) on "Page Size = 3" we got "Page Index = 0" and "Item Index Per Page = 2". This means that the third item is the third item on the first page.

Also, when we divided "Item Index = 3" (Fourth item) on "Page Size = 3" we got "Page Index = 1" and "Item Index Per Page = 0".  This means that the fourth item is the first item on the second page.

Also, when we divided "Item Index = 7" (Eighth item) on "Page Size = 3" we got "Page Index = 2" and "Item Index Per Page = 1".  This means that the eighth item is the second item on the third page.

Also, when we divided "Item Index = 9" (Tenth item) on "Page Size = 3" we got "Page Index = 3" and "Item Index Per Page = 0".  This means that the tenth item is the first item on the fourth page.

So, we can transform the equation into the shape below:

Item Index = (Page Index * Page Size) + Item Index Per Page

This means that if we have a value for "Page Index" and a value for "Page Size" and we need to know the index of the first item and the last item on this page we can use the equation above as follows.

First Item Index = (Page Index * Page Size) + Min Item Index Per Page
                             = (Page Index * Page Size) + 0
                             = (Page Index * Page Size)

Last Item Index = (Page Index * Page Size) + Max Item Index Per Page
                            = (Page Index * Page Size) + (Page Size - 1)

But note that if the calculated "Last Item Index" is greater than the index of the last item in the whole collection, then take the smaller number which is the index of the last item in the whole collection.

To verify the equations above let's apply on the example we have on hand.

On the first page, (first item index = 0 * 3 = 0) and (last item index = (0 * 3) + (3 - 1) = 2)
On the second page, (first item index = 1 * 3 = 3) and (last item index = (1 * 3) + (3 - 1) = 5)
On the third page, (first item index = 2 * 3 = 6) and (last item index = (2 * 3) + (3 - 1) = 8)
On the fourth page, (first item index = 3 * 3 = 9) and (last item index = (3 * 3) + (3 - 1) = 11 which is greater than the max available item index (9), therefore, last item index = 9)

That's it, as you can see these equations can make your life much easier.