GridView Custom Pager Template

This is a Custom GridView Pager Template with DropDownList for pagination , Next-Previous, First-Last navigation and TextBox with save button to control the Page Size.
I had searched many site for this functionality. Finally after referring a few good examples I came up with the following according to my need.


****************************HTML*****************************

<PagerTemplate>
<div id="pager" >
<asp:DropDownList ID="ddlPageSelector" runat="server" AutoPostBack="true">
</asp:DropDownList>
View
<asp:TextBox ID="txtPageSize"
runat="server" Width="25px" EnableViewState="true"></asp:TextBox>

results per page <asp:LinkButton ID="lnkSavePageSize" runat="server"
OnClick="lnkSavePageSize_click"><strong>Save</strong></asp:LinkButton>
|
<asp:Label ID="lblNumber" runat="server"></asp:Label> |

<asp:LinkButton Text="First" CommandName="Page" CommandArgument="First" runat="server" ID="btnFirst" />

<asp:LinkButton Text="Previous" CommandName="Page" CommandArgument="Prev" runat="server" ID="btnPrevious" /> -

<asp:LinkButton Text="Next" CommandName="Page" CommandArgument="Next" runat="server" ID="btnNext" />

<asp:LinkButton Text="Last" CommandName="Page" CommandArgument="Last" runat="server" ID="btnLast" />

</div>
</PagerTemplate>



******************************CODE BEHIND************************
//need to bind the following event with your gridview control

protected void myGridView_RowCreated(object sender, GridViewRowEventArgs e)
{
if (e.Row.RowType == DataControlRowType.Pager)
{

SetPagerButtonStates(myGridView, e.Row, this);

}
}

//This is a custom function
public void SetPagerButtonStates(GridView gridView, GridViewRow gvPagerRow, Page page)
{


int pageIndex = gridView.PageIndex;
int pageCount = gridView.PageCount;

LinkButton btnFirst = (LinkButton)gvPagerRow.FindControl("btnFirst");
LinkButton btnPrevious = (LinkButton)gvPagerRow.FindControl("btnPrevious");
LinkButton btnNext = (LinkButton)gvPagerRow.FindControl("btnNext");
LinkButton btnLast = (LinkButton)gvPagerRow.FindControl("btnLast");
Label lblNumber = (Label)gvPagerRow.FindControl("lblNumber");
TextBox txtPageSize = (TextBox)gvPagerRow.FindControl("txtPageSize");
lblNumber.Text = "Pages " + Convert.ToString(pageIndex+1) + " of " + pageCount.ToString();

btnFirst.Enabled = btnPrevious.Enabled = (pageIndex != 0);
btnNext.Enabled = btnLast.Enabled = (pageIndex < (pageCount - 1));

if (btnNext.Enabled == false)
{
btnNext.Attributes.Remove("CssClass");
}
DropDownList ddlPageSelector =
(DropDownList)gvPagerRow.FindControl("ddlPageSelector");
ddlPageSelector.Items.Clear();

for (int i = 1; i <= gridView.PageCount; i++)
{

ddlPageSelector.Items.Add(i.ToString());

}

ddlPageSelector.SelectedIndex = pageIndex;
txtPageSize.Text = gridView.PageSize.ToString();

//Used delegates over here
ddlPageSelector.SelectedIndexChanged += delegate
{

gridView.PageIndex = ddlPageSelector.SelectedIndex;

gridView.DataBind();

};
}

protected void lnkSavePageSize_click(object sender, EventArgs e)
{
GridViewRow pagerRow = myGridView.BottomPagerRow;
TextBox temp1= (TextBox)pagerRow.FindControl("txtPageSize");
if(temp1.Text!="")
{
myGridView.PageSize = Convert.ToInt32(temp1.Text);
}


}

Link for Reference:Click Here

Javascript RegExp Function

JavaScript provides a very useful function for client side user input validation. This function uses regular expressions for validation against the input.
If you are a PHP developer then you must have knowledge of this feature, whereas for ASP.NET 2.0 we already have the regular expression validator control which also uses similar regular expressions.
A simple example of the RegExp is as follows:

<script type="text/javascript" langusge="javascript">

function validate_phone(obj)
{

//for US phone number format: (xxx) xxx-xxxx

var RegExp=/\(\d{3}\)\ \d{3}-\d{4}/;

if(RegExp.test(obj.value))
{

return true;
}
else
{

obj.select();
obj.focus();
return false;
}
}

</script>

Note: Passing a correct regular expression is very important. You can find various regular expressions according to your need by Googling around. Also note that the regular expression must be inside the / / i.e var RegExp=/ /;

Regular Expression for File Upload Validation

This is a Regular Expression for validating the file upload HTML/ASP.NET control on the client side using JavaScript!

" ^.+\.(([jJ][pP][eE]?[gG]) | ([gG][iI][fF]) | ([bB][mM][pP­]) | ([pP][nN][gG]) |([wW][mM][fF]))$ "

As you can see you can specify any file format between the | | fields which stand for OR.
You can use this function in ASP.NET 2.0 with the Regular Expression Validator or can use the JavaScript RegExp function for PHP.

Note: Its always a good idea to validate the user input on the server side!!

Using Session variables in Javascript

One of the common problems Web Developers face is interaction between client side and server side scripts. With the advent of AJAX it has become very simple.
But there are situations were we need to change the JavaScript variables dynamically without changing the rest of the script. For example some flash elements require JavaScript variables for their functionality like keeping track of the tabs.
This can be achieved very easily through the use of session variable as follows:

<script type="text/javascript" language="javascript">

function myFunction()
{
var var1=21;
var var2=<%=Convert.ToString(Session["myVariable"])%>
------
------
------

}

</script>

All you need to do is assign the session variable with the value you want on the page load in code behind.

I was quiet curious and also tried the vice verse i.e assigning a Session Variable in JavaScript. But it doesn't work !!!! Have to use alternate methods. If any one knows a way of doing so..Please Comment

Working with HTML Div element

When i started my Web development career all i knew about HTML was table,td,tr,css and a few other tags. Most of the times i used ASP.NET components, without much tweaking. But soon i came across Web 2.0 techniques and realized the advantages of using Div elements + advance CSS handling. And so i began (again!) .......

To my initial horror i just couldn't get any thing in write place. Div' s overlapping each other, validation alerts flying all over the place, page changing structure after postback,.....just to name a few problems. But i had to focus, do my homework and start correctly. After reading some useful articles on the NET (You can find many!) and taking some expert tips from our lead designer, i finally started getting things write.

Now i was writing less HTML code as most things were configured through CSS. Just required to apply proper classes to the DIV's or give id's to them. You can follow any of the methods classes/id's but using same id's on same page is not W3C complaint. Also the most important thing that i realized about div's is that it's more cross browser compliant hence saves a lot of time configuring your web page for different browsers. Web pages look more cleaner than before.
So now i think that i have started off with WEB 2.0 (WEB 3.0 buzz already round the corner!!).
The learning path just got longer......................................................