ဒီေန႔ ရံုးမွာ program ေရးေနရင္းနဲ႔ entry form မွာ သံုးမယ့္ textbox တခ်ိဳဳ႕မွာ ကိုယ္လိုခ်င္တဲ႔ charactor ကိုပဲ ေရြးၿပီး ရိုက္ခြင့္ျပဳခ်င္တယ္။ ခြင့္မျပဳတဲ႔ charactor ေတြကို ရိုက္ရင္ ဘာမွ မေပၚေစခ်င္ဘူး။ အဲ့ဒီလို လုပ္ဖို႔ လိုလာတယ္။ ဥပမာဗ်ာ…. textbox ထဲမွာ ‘#’, ‘?’, ‘*’ only ပဲ ရိုက္ခြင့္ျပဳခ်င္တယ္ေပါ့။ အရင္တုန္းက project အေဟာင္းမွာေတာ့ numeric only ပဲရိုက္လို႔ရတဲ႔ textbox မ်ိဳးလုပ္ထားတာ ရွိတယ္။ အဲ့ဒီမွာ လုပ္တုန္းက htc file ကို သံုးၿပီးလုပ္ထားတာ။ htc က Firefox မွာ support မလုပ္ဘူး။ ဒါေၾကာင့္ အခုတစ္ေခါက္ေတာ့ ရို္းရိုး javascript နဲ႔ပဲ ထိန္းဖို႔ လုပ္လိုက္တယ္။ ဒါနဲ႔ Google အားကိုးလို႔ Internet ထဲမွာ ရွာေဖြဖတ္ရႈၿပီး ေရးလုိက္ပါတယ္။ browser အားလံုး support လုပ္ေအာင္ ေရးရတာလည္း နည္းနည္းေတာ့ လုပ္ေပါက္ကပ္သား။

javascript code

aspx code

Javascript မွာ key code number ေတြကို အေသးစိတ္သိခ်င္ရင္ ဒီ(http://unixpapa.com/js/key.html) မွာ ၾကည့္လို႔ရပါတယ္။

Javascript event object အေၾကာင္းကိုေတာ့ ဒီ(http://www.exforsys.com/tutorials/javascript/javascript-event-object.html) ကေနၾကည့္လို႔ ရပါတယ္။

Dataset Creation Process

၁ – solution explorer ထဲက project name ကို right click လုပ္ၿပီး ‘Add new items’ ကိုႏွိပ္လိုက္ပါ။  ေပၚလာတဲ႔ window ထဲမွာ DataSet ကိုေရြးၿပီး Add လုပ္လိုက္ပါ။ ( App_Code ထဲကို ထည့္မလား ေမးရင္ ထည့္မယ္လို႔သာ ေျပာလိုက္ပါ။ )

၂ – Dataset ရၿပီးရင္ ToolBox ထဲကေန TableAdapter ေဆာက္ပါ။ TableAdapter ေဆာက္ရင္ ပထမဆံုး Database နဲ႔ connection ယူရပါတယ္။ ( ပထမဆံုး တစ္ႀကိမ္မွာ new connection ယူၿပီး save ထားလိုက္ရင္ ေနာက္အႀကိမ္ေတြမွာ new connection ယူစရာ မလိုေတာ့ပါဘူး၊ Auto ေရြးေပးပါလိမ့္မယ္။)

၃ – connection ရၿပီဆိုရင္ SQL Statement ကိုေရြးၿပီး ေနာက္တစ္ဆင့္မွာ ကြၽန္ေတာ္လိုခ်င္တဲ႔ Table ကိုေရြးၿပီး select query ေရးေပးရပါမယ္။ (ဒီေနရာမွာ တစ္ခုသတိထားဖို႔လိုတာက TableAdapter ေဆာက္တဲ႔ အခ်ိန္မွာ ေရးတဲ႔ ပထမဆံုး select query မွာ (1) All Column(*) ကိုပဲေရြးပါ။ (2) Table မ join ပါနဲ႔။) ဘာလို႔လဲ ဆိုေတာ့ Table join လုိက္ရင္ Insert, Update, Delete Query ေတြကို compiler က auto မေဆာက္ေပးေတာ့ပါဘူး။ Search Page ေတြ၊ List Page ေတြအတြက္ Table Join ဖို႔လိုအပ္ရင္ ေနာက္မွ New Query ယူၿပီး Select လုပ္ပါ။ ပထမဆံုး Query မွာေတာ့ Table မ Join ပါနဲ႔။ အေရးႀကီးတာ တစ္ခု ေျပာဖို႔ က်န္ေသးတယ္။ ကြၽန္ေတာ္တို႔ Database ထဲမွာ table ေတြ ေဆာက္တုန္းက Primary Key ေပးဖို႔လည္း မေမ႔ခဲ႔ပါနဲ႔ဦး။ အကယ္လို႔ primary key မေပးထားခဲ႔ဘူးဆိုရင္ TableAdapter ေဆာက္တဲ႔ အခ်ိန္မွာ Insert Query ပဲ ေရးေပးသြားပါလိမ့္မယ္။ Update နဲ႔ Delete ေတာ့ ေဆာက္ေပးမွာ မဟုတ္ပါဘူး။

၄ – ကြၽန္ေတာ္တို႔ေရးလိုက္တဲ႔ select query အတြက္ function name ေပးရတဲ႔ ေနရာမွာ ကိုယ္ႀကိဳက္တဲ႔ name ေပးလိုက္လို႔ ရပါတယ္။ default အေနနဲ႔ Fill နဲ႔ GetData ဆိုၿပီး function ၂ ခု ေဆာက္ေပးပါလိမ့္မယ္။ ကြၽန္ေတာ္တို႔ မသံုးခ်င္တဲ႔ function ကို ျဖဳတ္ထားလို႔လဲ ရပါတယ္။ Fill function နဲ႔ GetData function ဘာကြာလဲဆိုရင္ ေအာက္မွာ ျပထားတဲ႔ နမူနာ usage ေလးကို ၾကည့္လိုက္ရင္ ရွင္းသြားမွာပါ။

Fill Function Usage

DataSetName ds = new DataSetName(); // data သိမ္းမယ့္ dataset ကို object ေဆာက္ပါတယ္။

TableAdapterName adp = new TableAdapterName(); // function(query) ရွိတဲ႔ Table adapter ကို object ေဆာက္ပါတယ္။

adp.Fill (ds.DataTableName); // Fill function က data သိမ္းမယ့္ dataset ကို parameter အေနနဲ႔ ထည့္ေပးရတယ္။

GetData Function Usage

DataSetName ds = new DataSetName();

TableAdapterName adp = new TableAdapterName();

ds.DataTableName.Merge( adp.GetData() ); // GetData Function ကေတာ့ datatable return ျပန္ၿပီး အဲ့ဒါကို ကိုယ္သိမ္းမယ့္ datasetထဲက table ထဲကို ေပါင္းထည့္ေပးရပါတယ္။

မွတ္ခ်က္။ ။ Database ထဲက table ေတြအတြက္ dataset ေဆာက္တဲ႔ အခါမွာ DataSet ကို တစ္ခုထဲေဆာက္ၿပီး အဲ့ဒီထဲမွာ table တစ္ခုစီအတြက္ TableAdapter တစ္ခုႏႈန္းနဲ႔ TableAdapter ေတြ အမ်ားႀကီးေဆာက္လို႔လည္း ရပါတယ္။ (ဒါမွမဟုတ္) table တစ္ခုအတြက္ DataSet တစ္ခုႏႈန္းနဲ႔ DataSet ေတြ အမ်ားႀကီး ေဆာက္ၿပီးေတာ့ သံုးလည္းရပါတယ္။

pic1

ဒါေလးက ကြၽန္ေတာ္စက္မွာ ေဆာက္ၿပီးသြားတဲ႔ Dataset နဲ႔ TableAdapter ေတြပဲ ျဖစ္ပါတယ္။

ကြၽန္ေတာ့္ကို Cbox ထဲမွာ ကိုေဇာ္လင္းခိုင္က “Book Store တစ္ခုအတြက္ Database Table ေတြ ဘယ္လိုေဆာက္ရမလဲ” ဆိုျပီး ေမးထားတဲ႔ ေမးခြန္းတစ္ခု ရွိပါတယ္။ ဒီလိုပဲ ကိုနိုင္ေအာင္ ကလည္း Comment တစ္ခုမွာ “ASP.NET ကေန Database ကို ခ်ိတ္ဆတ္ပံုေလး ေျပာျပေပးပါ” လို႔ ေမးထားပါတယ္။ ဒီေမးခြန္း ၂ ခုကိုလည္း ေျဖရင္းနဲ႔ ကြၽန္ေတာ္ Simple Book Store Program ေလးတစ္ခု တည္ေဆာက္ျပခ်င္ ပါတယ္။ ဒီ Program ေလးမွာ အဓိက အပိုင္း ၂ ပိုင္း ပါ၀င္ပါတယ္။ Book List နဲ႔ Book Entry ေပါ့။

Database Normalization

Normalization လုပ္လို႔ ေကာင္းတဲ႔ အခ်က္ေတြကိုေတာ့ SQL Server Book Online ထဲမွာ ဒီလို ေျပာထားပါတယ္။

read more…

ေက်းဇူးတင္ပါတယ္ ခင္ဗ်ာ။

sevenlamp

ကြၽန္ေတာ္ အလြယ္ဆံုးလို႔ ထင္တဲ႔ project ထဲကို About Page ထည့္တဲ႔ အပိုင္းေလးကို အရင္ဆံုး စလုပ္လိုက္ပါတယ္။ project ထဲကို AboutMe.aspx page ေလး ထည့္လိုက္ျပီး။ About မွာ ျပမယ့္ message ေတြအတြက္ entry အပိုင္း က မလုပ္ရေသးေတာ့။ စာသားေတြကို ဒီတိုင္းပဲ Page ထဲကို ထည့္ျပလိုက္ပါတယ္။ comment ေပးတဲ႔ အပိုင္းေလးေရးဖို႔အတြက္၊ Database ထဲမွာ Comments Table သြားေဆာက္လုိက္ပါတယ္။

ကြၽန္ေတာ္က DataBase နဲ႔ ခ်ိတ္တဲ႔ ေနရာမွာ objectdatasource ကိုပဲ သံုးမွာ မို႔လို႔ DataSet လည္းေဆာက္ေပးဖို႔လိုပါေသးတယ္။ ျပီးရင္ comment entry အတြက္ textbox ေလးေတြထည့္တယ္။ Validation အတြက္ requirefield validator နဲ႔ email format အတြက္ Regularexpression validator controls ေတြကို ထည့္ထားပါတယ္။ send button ႏွိပ္ရင္ server သြားတဲ႔ အလုပ္ကို updatepanel ထဲမွာ ပဲ ထည့္ေပးလိုက္ပါတယ္။
Comment list ျပန္ျပဖို႔အတြက္ေတာ့ gridview control ကိုပဲ သံုးျပီး object datasource နဲ႔ ခ်ိတ္ျပလိုက္ပါတယ္။ ဒီ page ေလးက ရွင္းပါတယ္။ ကုဒ္လည္း သိပ္မရႈပ္ဘူး။

public partial class AboutMe : System.Web.UI.Page
{
    protected void Page_Load(object sender, EventArgs e)
    {
        this.Title = "About Page : sevenlamp.co.cc";
        ShowCommentCount();
    }

    private void ShowCommentCount()
    {
        DataSet_CommentTableAdapters.CommentsTableAdapter adp = new DataSet_CommentTableAdapters.CommentsTableAdapter();
        int commentCount = (int)adp.GetCommentCountByPostID(0);
        if (commentCount == 0)
            lblTotalComment.Text = "No Comment";
        else if (commentCount == 1)
            lblTotalComment.Text = commentCount.ToString() + " Comment";
        else
            lblTotalComment.Text = commentCount.ToString() + " Comments";
    }
    protected void SendButton_Click(object sender, EventArgs e)
    {
        ObjectDataSource2.Insert();
    }
    protected void ObjectDataSource1_Inserting(object sender, ObjectDataSourceMethodEventArgs e)
    {
        e.InputParameters["CommentTime"] = DateTime.Now;
    }
    protected void GridView1_RowDataBound(object sender, GridViewRowEventArgs e)
    {
        if (e.Row.RowType == DataControlRowType.DataRow)
        {
            ((Label)e.Row.FindControl("lblCommentNo")).Text = "#" + (e.Row.RowIndex+1).ToString();
        }
    }
    protected void ObjectDataSource2_Inserted(object sender, ObjectDataSourceStatusEventArgs e)
    {
        ShowCommentCount();
        GridView1.DataBind();
    }
}

Dec 30, 2009
- chatbox မွာ validation အပိုင္းထည့္တယ္
- postback ျပန္ေနတာကို ျပင္တယ္။
Dec 28, 2009
- project ျပီးသေလာက္ကို publish လုပ္တယ္။
Dec 27, 2009
- chatbox အပိုင္းေရးတယ္။
Dec 26, 2009
- template လက္စသတ္တယ္။
- database ေဆာက္တယ္။
Dec 23, 2009
- template ျပင္ျပီးသေလာက္ကို publish လုပ္တယ္။
Dec 14, 2009
- template sample ရွာျပီး ေဒါင္းတယ္။
- ပံုေတြျဖတ္တယ္။ templateျပင္တယ္။

****************************************

ကြၽန္ေတာ္ မေန႔ညတုန္းက ChatBox ေလးမွာ က်န္ေနတဲ႔ အပိုင္းေလးေတြ ဆက္ျပင္ပါတယ္။ Send button ေလး click ရင္ server side ကို postback ျပန္ေနေတာ့ နည္းနည္းၾကာေနတယ္။ အဲ့ဒါေၾကာင့္ button ေလးကို update panel ထဲကို ထည့္ေပးလိုက္ပါတယ္။ ေနာက္ျပီး textbox ေတြထဲမွာ data မထည့္ပဲ send ႏွိပ္ရင္ alert ျပဖို႔အတြက္လည္း CustomValidator Control ေလးထည္ျပီးစစ္လိုက္ပါတယ္။ CustomValidator အတြက္ client script ေလးက ဒီလိုပါ။

function CheckMessage(source, arguments)
{
      if(document.getElementById("ctl00_ContentPlaceHolder1_SenderNameTextBox").value=="")
      {
           alert("Enter Your Name First!");
           document.getElementById("ctl00_ContentPlaceHolder1_SenderNameTextBox").focus();
           arguments.IsValid = false;
      }
      else if(document.getElementById("ctl00_ContentPlaceHolder1_SenderLocationTextBox").value=="")
      {
           alert("Enter Your Location First!");
           document.getElementById("ctl00_ContentPlaceHolder1_SenderLocationTextBox").focus();
           arguments.IsValid = false;
      }
      else if(document.getElementById("ctl00_ContentPlaceHolder1_ChatLogTextBox").value=="")
      {
           alert("Enter Message First!");
           document.getElementById("ctl00_ContentPlaceHolder1_ChatLogTextBox").focus();
           arguments.IsValid = false;
      }
      else
      {
           arguments.IsValid = true;
      }
}

ဒီေန႔ ၃၀ ဒီဇင္ဘာ အထိ Latest program ကို ဒီကေန ေဒါင္းလို႔ ရပါျပီ။ http://www.sendspace.com/file/kpywr0