Web programming blog

I will create an example and we go through it. Suppose we have a task to display on some web page data from table customers.

at the moment I will not take care about database. let’s say that database already exists, tables and data are there. We can do this task very quickly. It is not some big deal. We will open connection to database, read data from table, display data and close connection.
all of that can be put in one class. Bu the question is: “Is that really good practice?” in my favorite C# I will write down some code. To follow me, create an empty ASP.NET project in your Visual Studio ( I use VS2005)and choose C# for language.
There is Default.aspx page in your solution. Add GridView control (drag and drop from Toolbox). Call your grid view as: “grdCustomers“.
Edit Default.aspx.cs file:

using System;
using System.Data;
using System.Configuration;
using System.Collections;
using System.Web;
using System.Web.Security;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Web.UI.WebControls.WebParts;
using System.Web.UI.HtmlControls;

using System.Data.SqlClient;

namespace Customers
{
    public partial class _Default : System.Web.UI.Page
    {
        protected void Page_Load(object sender, EventArgs e)
        {
            string strConnection = null;
            string strSQL = "select customerID, customerName, customerContact from Customers ";

            strConnection = "server=DB_SERVER_NAME; initial catalog=TestDB; user=usernameValue; password=passwordValue";
            DataSet ds = new DataSet();

            SqlConnection conn = new SqlConnection(strConnection);
            conn.Open();

            SqlDataAdapter da = new  SqlDataAdapter(strSQL, conn);
            da.Fill(ds);

            grdCustomers.DataSource = ds;
            grdCustomers.DataBind();

            conn.Close();
        }
    }
}

and when we start web app with “F5″ button, we get this on the screen:

What is wrong with this? This is working, right. What if we need an other web page to display Employees. The most of the previous code will be the same except the sql query; and we will have the copy paste in our application which is bad. The other problem is sql server connection string which is hardcoded. First we will put sql connection string into configuration: Web.Config.
Edit web config to looks like this:

< ?xml version="1.0"?>

and after that, change your Default.aspx.cs code. This line:

            strConnection = "server=DB_SERVER_NAME; initial catalog=TestDB; user=usernameValue; password=passwordValue";

Chamge with this one:

            strConnection = ConfigurationManager.ConnectionStrings["SQLServerConnStr"].ConnectionString;

That is better. Now we do not need to think about sql server, its location or username/password. When we move our application to some other server, we only need to edit web.config file. No “building” necessary at all. But this can make some problem letter. If in the future Microsoft publish some better way for reading from web config we will need to change our code and recompile it again. To avoid this I will create one new project which will be used in entire solution for reading from web.config.

Create new project, type of Class library, language C#. Call it: “WebCommon“. Renamce Class1.cs to Configuration.cs

using System;
using System.Collections.Generic;
using System.Text;
using System.Configuration;

namespace WebCommon
{
    public static class Configuration
    {
        public static string ReadSqlConfiguration
        {
             get
             {
                return ConfigurationManager.ConnectionStrings["SQLServerConnStr"].ConnectionString;
             }
        }
    }
}

You need to add System.Configuration reference to this WebCommon project.

When this is done, now get back to our web project and add reference to WebCommon project.
this is how Default.aspx.cs looks after modification:

using System;
using System.Data;
using System.Configuration;
using System.Collections;
using System.Web;
using System.Web.Security;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Web.UI.WebControls.WebParts;
using System.Web.UI.HtmlControls;

using System.Data.SqlClient;
using WebCommon;

namespace Customers
{
    public partial class _Default : System.Web.UI.Page
    {
        protected void Page_Load(object sender, EventArgs e)
        {
            string strConnection = null;
            string strSQL = "select customerID, customerName, customerContact from Customers ";

            strConnection = WebCommon.Configuration.ReadSqlConfiguration();
            DataSet ds = new DataSet();

            SqlConnection conn = new SqlConnection(strConnection);
            conn.Open();

            SqlDataAdapter da = new  SqlDataAdapter(strSQL, conn);
            da.Fill(ds);

            grdCustomers.DataSource = ds;
            grdCustomers.DataBind();

            conn.Close();
        }
    }
}

This is how we read from web.config now:

         strConnection = WebCommon.Configuration.ReadSqlConfiguration();

we need this using directive:

         using WebCommon;

Now we will separate our presentation layer and data access layer. Data access layer will deal with database. Create new Project, type of class Library, language C#. Call it: “DAL” Data Access Layer. Rename Class1.cs to Helper.cs
Enter this code to Helper.cs

using System.Text;
using System.Data;
using System.Data.SqlClient;

namespace DAL
{
    public class Helper
    {
        public DataSet GetDataSet(string strSql, string strSqlServerConnection)
        {
            DataSet ds = new DataSet();

            SqlConnection conn = new SqlConnection(strSqlServerConnection);
            conn.Open();

            SqlDataAdapter da = new  SqlDataAdapter(strSql, conn);
            da.Fill(ds);             

            conn.Close();
            return ds;
        }
    }
}

There is a public method GetDataSet(string strSql, string strSqlServerConnection) which executes sql query and return populated data set.
Now add reference to this project to our web project and modify Default.aspx.cs:

using System.Web;
using System.Web.Security;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Web.UI.WebControls.WebParts;
using System.Web.UI.HtmlControls;

using System.Data.SqlClient;
using WebCommon;
using DAL;

namespace Customers
{
    public partial class _Default : System.Web.UI.Page
    {
        protected void Page_Load(object sender, EventArgs e)
        {
            DataSet ds;
            string strSQL = "select customerID, customerName, customerContact from Customers ";

            DAL.Helper objHelper = new DAL.Helper();
            ds = objHelper.GetDataSet(strSQL, WebCommon.Configuration.ReadSqlConfiguration);

            grdCustomers.DataSource = ds;
            grdCustomers.DataBind();
        }
    }
}

This is code in code behind of Default.aspx page. As you can see there is a less code than in the begining. If we need some other page to display similiar info like employees, we will create new page and put some code like this:

using System.Web;
using System.Web.Security;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Web.UI.WebControls.WebParts;
using System.Web.UI.HtmlControls;

using System.Data.SqlClient;
using WebCommon;
using DAL;

namespace Customers
{
    public partial class _Default : System.Web.UI.Page
    {
        protected void Page_Load(object sender, EventArgs e)
        {
            DataSet ds;
            string strSQL = "select employeID, employeeName, employeeAddress, zipCode, COuntry from Employees";

            DAL.Helper objHelper = new DAL.Helper();
            ds = objHelper.GetDataSet(strSQL, WebCommon.Configuration.ReadSqlConfiguration);

            grdCustomers.DataSource = ds;
            grdCustomers.DataBind();
        }
    }
}

If I think a litle bit more I will decide to remove this sql queries from my web project. web project should be presentation layer and there we only use information for publishing or perform some actions. I will create one more Layer for some business logic and derision making. It will be BL(Business Layer)

Create new Project, type of class Library, call it BL and renamce Class1.cs to Customers.cs and put this code there.

using System;
using System.Collections.Generic;
using System.Text;
using System.Data;

using WebCommon;
using DAL;

namespace BL
{
    public class Customers
    {
        public DataSet GetCustomers()
        {
            DataSet ds;
            string strSQL = "select customerID, customerName, customerContact from Customers ";

            DAL.Helper objHelper = new DAL.Helper();
            ds = objHelper.GetDataSet(strSQL, WebCommon.Configuration.ReadSqlConfiguration);
            return ds;
        }

        public int UpdateCustomer()
        {
            // to do
            return 0;
        }

        public int DeleteCustomer(int customerID)
        {
            // to do
            return 0;
        }

    }
}

You need to add references to “WebCommon” and to “DAL” in “BL” project. And now modify Web project. Remove reference to DAL and WebCommon and add reference to BL.
edit Default.aspx.cs:

using System;
using System.Data;
using System.Configuration;
using System.Collections;
using System.Web;
using System.Web.Security;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Web.UI.WebControls.WebParts;
using System.Web.UI.HtmlControls;

using System.Data.SqlClient;
using BL;

namespace Customers
{
    public partial class _Default : System.Web.UI.Page
    {
        protected void Page_Load(object sender, EventArgs e)
        {
            DataSet ds;

            BL.Customers objCustomers = new BL.Customers();
            ds = objCustomers.GetCustomers();

            grdCustomers.DataSource = ds;
            grdCustomers.DataBind();
        }
    }
}

Now our presentation layer, GUI or web form doesn’t know about data sources. All data it will get from BL. Just call proper method of BL. In BL project we can add more classes for Employees, Customers, Orders, …
DAL (Data Access Layer) is used to provide information.
that is all for now. Have a good day.

There is a template for Visual Studio 2008 for MVC template. You can download it from here. After Installation, run VS 2008 and create new project.

VS2008 asks you about test project for your solution:

You can choose test project name and testing framework. And ‘voila’. This is you solution explorer and you can find bunch of some files there.


Some basic functionality is already there. “Home” and “About” pages and “Login” and “Register” functionality is created too.

ASP.NET MVC 1.0 finally published. You can download it from here. For tutorials, videos, and more please check out the official site.
more about asp.net mvc you can read on other blogs:
here:
ASP.NET MVC 1.0 now Live! and Free ASP.NET MVC eBook Tutorial.

Model–View–Controller (MVC) is an architectural pattern used in software engineering. It allows software developers to build a Web application as a composition of three roles: Model, View and Controller. A Model represents the state of a particular aspect of the application. Frequently, a model maps to a database table with the entries in the table representing the state of the table. A Controller handles interactions and updates the model to reflect a change in state of the application. A View extracts necessary information from a model and renders a user interface to display that”.<br/>

Here is the code for simple Calculator application written in Java which is organized according the the Model-View-Controller (MVC) pattern.<br/>

The main program initializes everything and ties everything together.

Main.java:

import javax.swing.*;

public class Main{
    public static void main(String[] args) {

        CalcModel      model      = new CalcModel();
        CalcView       view        = new CalcView(model);
        CalcController controller = new CalcController(model, view);

        view.setVisible(true);
    }
}

here is the View class:

import java.awt.*;
import javax.swing.*;
import java.awt.event.*;

class CalcView extends JFrame {
    private static final String INITIAL_VALUE = "1";

    private JTextField m_userInputTf = new JTextField(5);
    private JTextField m_totalTf     = new JTextField(20);
    private JButton    m_multiplyBtn = new JButton("Multiply");
    private JButton    m_clearBtn    = new JButton("Clear");

    private CalcModel m_model;

    CalcView(CalcModel model) {
        m_model = model;
        m_model.setValue(INITIAL_VALUE);

        m_totalTf.setText(m_model.getValue());
        m_totalTf.setEditable(false);

        JPanel content = new JPanel();
        content.setLayout(new FlowLayout());
        content.add(new JLabel("Input"));
        content.add(m_userInputTf);
        content.add(m_multiplyBtn);
        content.add(new JLabel("Total"));
        content.add(m_totalTf);
        content.add(m_clearBtn);

        //... finalize layout
        this.setContentPane(content);
        this.pack();

        this.setTitle("Simple Calc - MVC");

        this.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
    }

    void reset() {
        m_totalTf.setText(INITIAL_VALUE);
    }

    String getUserInput() {
        return m_userInputTf.getText();
    }

    void setTotal(String newTotal) {
        m_totalTf.setText(newTotal);
    }

    void showError(String errMessage) {
        JOptionPane.showMessageDialog(this, errMessage);
    }

    void addMultiplyListener(ActionListener mal) {
        m_multiplyBtn.addActionListener(mal);
    }

    void addClearListener(ActionListener cal) {
        m_clearBtn.addActionListener(cal);
    }
}

Here is the Controller class:

import java.awt.event.*;

public class CalcController {

    private CalcModel m_model;
    private CalcView  m_view;

    CalcController(CalcModel model, CalcView view) {
        m_model = model;
        m_view  = view;

        view.addMultiplyListener(new MultiplyListener());
        view.addClearListener(new ClearListener());
    }

    /*
     *  1. Get the user input number from the View.
     *  2. Call the model to mulitply by this number.
     *  3. Get the result from the Model.
     *  4. Tell the View to display the result.
     * If there was an error, tell the View to display it.
     */
    class MultiplyListener implements ActionListener {
        public void actionPerformed(ActionEvent e) {
            String userInput = "";
            try {
                userInput = m_view.getUserInput();
                m_model.multiplyBy(userInput);
                m_view.setTotal(m_model.getValue());

            } catch (NumberFormatException nfex) {
                m_view.showError("Bad input: '" + userInput + "'");
            }
        }
    }
    class ClearListener implements ActionListener {
        public void actionPerformed(ActionEvent e) {
            m_model.reset();
            m_view.reset();
        }
    }
}

and here is the Model class:

import java.math.BigInteger;

public class CalcModel {

    private static final String INITIAL_VALUE = "0";

    private BigInteger m_total;  // The total current value state.

    CalcModel() {
        reset();
    }

    public void reset() {
        m_total = new BigInteger(INITIAL_VALUE);
    }

    public void multiplyBy(String operand) {
        m_total = m_total.multiply(new BigInteger(operand));
    }

    public void setValue(String value) {
        m_total = new BigInteger(value);
    }

    public String getValue() {
        return m_total.toString();
    }
}

and here is the result:

have a nice day

All of you heard about “Cookies”. This is a way that web site remember some information about you in *.txt file located on your machine.

Here is how we create cookie in C#, this is code behibnd of aspx page.

using System;
using System.Data;
using System.Configuration;
using System.Web;
using System.Web.Security;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Web.UI.WebControls.WebParts;
using System.Web.UI.HtmlControls;

public partial class _Default : System.Web.UI.Page
{
    protected void Page_Load(object sender, EventArgs e)
    {
        // Create a new HttpCookie named "MyLastVisit".
        HttpCookie myHttpCookie = new HttpCookie("MyLastVisit", DateTime.Now.ToString());

        // By default, the HttpOnly property is set to false
        // unless specified otherwise in configuration.

        //rename Cookie
        myHttpCookie.Name = "MyHttpCookie";
        Response.AppendCookie(myHttpCookie);

        // Show the name of the cookie.
        Response.Write(myHttpCookie.Name);

        // Create an HttpOnly cookie.
        HttpCookie myHttpOnlyCookie = new HttpCookie("MyLastVisit", DateTime.Now.ToString());

        // Setting the HttpOnly value to true, makes
        // this cookie accessible only to ASP.NET.

        myHttpOnlyCookie.HttpOnly = true;
        //rename Cookie
        myHttpOnlyCookie.Name = "MyHttpOnlyCookie";
        Response.AppendCookie(myHttpOnlyCookie);

        // Show the name of the HttpOnly cookie.
        Response.Write(myHttpOnlyCookie.Name);
    }
}

and this is java script code which reads cookie:

<script>

    // This code returns the cookie name.
    alert("Getting HTTP Cookie");
    alert(getCookie("MyHttpCookie"));

    // Because the cookie is set to HttpOnly,
    // this returns null.
    alert("Getting HTTP Only Cookie");
    alert(getCookie("MyHttpOnlyCookie"));

</script>