ASP.NET

private void FillGrid( string sortExpression, SortDirection sortDir )
{
   string sort = sortExpression + " " + (sortDir == SortDirection.Descending ? "desc" : "" );

   DataTable dt = GetDataTableFromSomewhere();
   DataView dv = new DataView(dt, "", sort, DataViewRowState.CurrentRows );
   GridView1.DataSource = dv;
   GridView1.DataBind();
}

protected void GridView1_Sorting(object sender, GridViewSortEventArgs e)
{
   FillGrid(e.SortExpression, e.SortDirection);
}

 <br />
dim ds as new dataset<br />
ds = DBUsers.Pages_Select(DDLTypes.SelectedValue)<br />
        Dim tblPages As DataTable = New DataTable<br />
        tblPages = ds.Tables(2)<br />
        DGPages.DataSource = tblPages<br />
        DGPages.DataBind()

Mark Nischalke wrote:

I'm so hurt by the low votes

Regards,

Satips.

Don't walk in front of me, I may not follow;
Don't walk behind me, I may not lead;
Walk beside me, and just be my friend. - Albert Camus

Javascript Code "ION.js"<br />
-------------------------<br />
// This date is used throughout to determine today's date.<br />
<br />
    var IONDateNow = new Date(Date.parse(new Date().toDateString()));<br />
<br />
<br />
    //      var IONBaseYear = 2000;<br />
<br />
    var IONBaseYear        = IONDateNow.getFullYear()-75;<br />
<br />
    // How many years do want to be valid and to show in the drop-down list?<br />
<br />
    var IONDropDownYears   = 80;<br />
<br />
    // All language dependent changes can be made here...<br />
<br />
    var IONToday               = 'Today:',<br />
        IONInvalidDateMsg      = 'The entered date is invalid.\n',<br />
        IONOutOfRangeMsg       = 'The entered date is out of range.',<br />
        IONDoesNotExistMsg     = 'The entered date does not exist.',<br />
        IONInvalidAlert        = ['Invalid date (',') ignored.'],<br />
        IONDateDisablingError  = ['Error ',' is not a Date object.'],<br />
        IONRangeDisablingError = ['Error ',' should consist of two elements.'],<br />
        IONArrMonthNames       = ['01','02','03','04','05','06',<br />
                                  '07','08','09','10','11','12'],<br />
        IONArrWeekInits        = ['S','M','T','W','T','F','S'];<br />
<br />
    // Note:  Always start the IONArrWeekInits array with your string for<br />
    //        Sunday whatever IONWeekStart (below) is set to.<br />
<br />
    // IONWeekStart determines the start of the week in the display<br />
    // Set it to: 0 (Zero) for Sunday, 1 (One) for Monday etc..<br />
<br />
    var IONWeekStart       =    0;<br />
<br />
    // Set the allowed date delimiters here...<br />
    // E.g. To set the rising slash, hyphen, full-stop (aka stop or point)<br />
    //      and comma as delimiters use<br />
    //              var IONArrDelimiters   = ['/','-','.',','];<br />
<br />
    var IONArrDelimiters   = ['/','-','.',','];<br />
<br />
    // IONZindex controls how the pop-up calendar interacts with the rest<br />
    // of the page.  It is usually adequate to leave it as 1 (One) but I<br />
    // have made it available here to help anyone who needs to alter the<br />
    // level in order to ensure that the calendar displays correctly in<br />
    // relation to all other elements on the page.<br />
<br />
    var IONZindex          = 1;<br />
<br />
    // Personally I like the fact that entering 31-Sep-2005 displays<br />
    // 1-Oct-2005, however you may want that to be an error.  If so,<br />
    // set IONBlnStrict = true.  That will cause an error message to<br />
    // display and the selected month is displayed without a selected<br />
    // day. Thanks to Brad Allan for his feedback prompting this feature.<br />
<br />
    var IONBlnStrict       = false;<br />
<br />
    // If you wish to disable any displayed day, e.g. Every Monday<br />
    // you can do it by setting the following array.  The array elements<br />
    // match the displayed cells.<br />
    //<br />
    // You could put something like the following in your calling page<br />
    // to disable all weekend days;<br />
    //<br />
    //  for (var i=0;i<IONEnabledDay.length;i++)<br />
    //      {if (i%7==0 || i%7==6)  // Disable all weekend days<br />
    //          {IONEnabledDay[i] = false;}<br />
    //      }<br />
<br />
    var IONEnabledDay      = [true, true, true, true, true, true, true,<br />
                              true, true, true, true, true, true, true,<br />
                              true, true, true, true, true, true, true,<br />
                              true, true, true, true, true, true, true,<br />
                              true, true, true, true, true, true, true,<br />
                              true, true, true, true, true, true, true];<br />
<br />
    // You can disable any specific date by creating an element of the<br />
    // array IONDisabledDates as a date object with the value you want<br />
    // to disable.  Date ranges can be disabled by placing an array<br />
    // of two values (Start and End) into an element of this array.<br />
<br />
    var IONDisabledDates   = new Array();<br />
<br />
    // e.g. To disable 10-Dec-2005:<br />
    //          IONDisabledDates[0] = new Date(2005,11,10);<br />
    //<br />
    //      or a range from 2004-Dec-25 to 2005-Jan-01:<br />
    //          IONDisabledDates[1] = [new Date(2004,11,25),new Date(2005,0,1)];<br />
    //<br />
    // Remember that Javascript months are Zero-based.<br />
<br />
    // The disabling by date and date range does prevent the current day<br />
    // from being selected.  Disabling days of the week does not so you can set<br />
    // the IONActiveToday value to false to prevent selection.<br />
<br />
    var IONActiveToday = true;<br />
<br />
    // Closing the calendar by clicking on it (rather than elsewhere on the<br />
    // main page) can be inconvenient.  The IONClickToHide boolean value<br />
    // controls this feature.<br />
<br />
    var IONClickToHide = false;<br />
<br />
    // Blend the colours into your page here...<br />
<br />
    var IONBackground           = '#959595';    // Calendar background<br />
    var IONHeadText             = 'White';    // Colour of week headings<br />
<br />
    // If you want to "turn off" any of the highlighting then just<br />
    // set the highlight colours to the same as the un-higlighted colours.<br />
<br />
    // Today string<br />
    var IONTodayText            = 'White',<br />
        IONTodayHighlight       = 'Blue';<br />
<br />
    // Active Cell<br />
    var IONHighlightText        = 'red',<br />
        IONHighlightBackground  = 'lavender';<br />
<br />
    // Weekend Days<br />
    var IONWeekendText          = '#CC6666',<br />
        IONWeekendBackground    = 'White';<br />
<br />
    // Days out of current month<br />
    var IONExMonthText          = '#999999',<br />
        IONExMonthBackground    = '#CCCCCC';<br />
<br />
    // Current month's weekdays<br />
    var IONCellText             = 'highlight',<br />
        IONCellBackground       = 'white';<br />
<br />
    // Input date<br />
    var IONInDateText           = 'white',<br />
        IONInDateBackground     = 'Highlight';<br />
<br />
    // Disabled days<br />
    var IONDisabledDayText       = '#993333',<br />
        IONDisabledDayBackground = '#999999';<br />
<br />
<br />
    // I have made every effort to isolate the pop-up script from any<br />
    // CSS defined on the main page but if you have anything set that<br />
    // affects the pop-up (or you may want to change the way it looks)<br />
    // then you can address it here.<br />
    //<br />
    // The classes are;<br />
    //      ION         Overall<br />
    //      IONHead     The Selection buttons/drop-downs<br />
    //      IONWeek     The Day Initials (Column Headings)<br />
    //      IONCells    The Individual days<br />
    //      IONFoot     The "Today" selector<br />
<br />
    document.writeln("<style>");<br />
    document.writeln(   '.ION       {padding:0px;vertical-align:middle;}');<br />
    document.writeln(   'iframe.ION {position:absolute;z-index:' + IONZindex    +<br />
                                    ';top:0px;left:0px;visibility:hidden;'      +<br />
                                    'width:1px;height:1px;}');<br />
    document.writeln(   'table.ION  {padding:0px;visibility:hidden;'            +<br />
                                    'position:absolute;width:200px;'            +<br />
                                    'top:0px;left:0px;z-index:' + (IONZindex+1) +<br />
                                    ';text-align:center;'                       +<br />
                                    'padding:0px;vertical-align:middle;'        +<br />
                                    'background-color:' + IONBackground         +<br />
                                    ';border:ridge 2px DarkGray;font-size:7pt;'         +<br />
                                    'font-family:Verdana,Arial,Helvetica,Sans-Serif;'   +<br />
                                    'font-weight:bold;}');<br />
    document.writeln(   'td.IONHead     {padding:0px 0px;text-align:center;}');<br />
    document.writeln(   'select.IONHead {margin:0px 0px;}');<br />
    document.writeln(   'input.IONHead  {height:21px;width:20px;'               +<br />
                                        'vertical-align:middle;'                +<br />
                                        'text-align:center;margin:0px 0px;'     +<br />
                                        'font-size:7pt;borderwidth:0;font-family:fixedSys;'  +<br />
                                        'font-weight:normal;}');<br />
    document.writeln(   'tr.IONWeek     {text-align:center;font-weight:bold;'   +<br />
                                        'color:' + IONHeadText + ';}');<br />
    document.writeln(   'td.IONWeek     {padding:0px;}');<br />
    document.writeln(   'table.IONCells {text-align:right;font-size:7pt;'       +<br />
                                        'width:96%;font-family:'                +<br />
                                        'Arial,Helvetica,Sans-Serif;}');<br />
    document.writeln(   'td.IONCells {padding:0px;vertical-align:middle;'       +<br />
                                     'width:16px;height:16px;font-weight:bold;' +<br />
                                     'color:' + IONCellText                     +<br />
                                     ';background-color:' + IONCellBackground   +<br />
                                     '}');<br />
    document.writeln(   'td.IONFoot  {padding:0px;text-align:center;'           +<br />
                                     'font-weight:normal;color:'                +<br />
                                      IONTodayText + ';}');<br />
    document.writeln("</style>");<br />
<br />
    // You can modify the input, display and output date formats in the<br />
    // following three functions;<br />
<br />
    function IONInputFormat(IONArrInput,IONEleValue)<br />
        {var IONArrSeed = new Array();<br />
<br />
         IONBlnFullInputDate = false;<br />
<br />
         switch (IONArrInput.length)<br />
            {case 1:<br />
                {// Year only entry<br />
                 IONArrSeed[0] = parseInt(IONArrInput[0],10);   // Year<br />
                 IONArrSeed[1] = '6';                           // Month<br />
                 IONArrSeed[2] = 1;                             // Day<br />
                 break;<br />
                }<br />
             case 2:<br />
                {// Year and Month entry<br />
                 IONArrSeed[0] = parseInt(IONArrInput[1],10);   // Year<br />
                 IONArrSeed[1] = IONArrInput[0];                // Month<br />
                 IONArrSeed[2] = 1;                             // Day<br />
                 break;<br />
                }<br />
             case 3:<br />
                {// Day Month and Year entry<br />
                 IONArrSeed[0] = parseInt(IONArrInput[2],10);   // Year<br />
                 IONArrSeed[1] = IONArrInput[1];                // Month<br />
                 IONArrSeed[2] = parseInt(IONArrInput[0],10);   // Day<br />
<br />
                 // for Month, Day and Year entry use...<br />
                 //   IONArrSeed[0] = parseInt(IONArrInput[2],10);  // Year<br />
                 //   IONArrSeed[1] = IONArrInput[0];               // Month<br />
                 //   IONArrSeed[2] = parseInt(IONArrInput[1],10);  // Day<br />
<br />
                 IONBlnFullInputDate = true;<br />
                 break;<br />
                }<br />
             default:<br />
                {// A stuff-up has led to more than three elements in the date.<br />
                 IONArrSeed[0] = 0;     // Year<br />
                 IONArrSeed[1] = 0;     // Month<br />
                 IONArrSeed[2] = 0;     // Day<br />
                }<br />
            }<br />
<br />
         // Apply validation and report failures<br />
<br />
         if (IONExpValYear.exec(IONArrSeed[0])  == null ||<br />
             IONExpValMonth.exec(IONArrSeed[1]) == null ||<br />
             IONExpValDay.exec(IONArrSeed[2])   == null)<br />
             {//alert(IONInvalidDateMsg  +<br />
                    //IONInvalidAlert[0] + IONEleValue + IONInvalidAlert[1]);<br />
              IONBlnFullInputDate = false;<br />
              IONArrSeed[0] = IONBaseYear + Math.floor(IONDropDownYears/2); // Year<br />
              IONArrSeed[1] = '6';     // Month<br />
              IONArrSeed[2] = 1;       // Day<br />
             }<br />
<br />
         // Return the  Year    in IONArrSeed[0]<br />
         //             Month   in IONArrSeed[1]<br />
         //             Day     in IONArrSeed[2]<br />
<br />
         return IONArrSeed;<br />
        }<br />
<br />
    function IONDisplayFormat(IONDisplayDate)<br />
        {// The format of the display of today's date at the foot of the<br />
         // calendar...<br />
         // Day Month and Year display<br />
/*<br />
         document.write(IONDisplayDate.getDate()                  + " / " +<br />
                     IONArrMonthNames[IONDisplayDate.getMonth()]  + " / " +<br />
                     IONDisplayDate.getFullYear());<br />
*/<br />
         // for Month, Day and Year output use...<br />
         document.write(IONArrMonthNames[IONDisplayDate.getMonth()] + "/" +<br />
                     IONDisplayDate.getDate()                       + "/" +<br />
                     IONDisplayDate.getFullYear());<br />
        }<br />
<br />
    function IONSetOutput(IONOutputDate)<br />
        {// Numeric months are held internally as 0 to 11 in this script so<br />
         // the correct numeric month output should be in the form<br />
         //                         (IONOutputDate.getMonth()+1)<br />
         // e.g.<br />
             IONTargetEle.value = ((IONOutputDate.getDate()<10)?'0':'')  +<br />
                                  IONOutputDate.getDate()             + '-' +<br />
                                  ((IONOutputDate.getMonth()<9)?'0':'')  +<br />
                                  (IONOutputDate.getMonth()+1)        + '-' +<br />
                                  IONOutputDate.getFullYear();<br />
<br />
         // Day Month and Year output<br />
         /*<br />
         IONTargetEle.value =   ((IONOutputDate.getDate()<10)?'0':'')  +<br />
                                  IONOutputDate.getDate()                + '/' +<br />
                                  IONArrMonthNames[IONOutputDate.getMonth()] + '/' +<br />
                                  IONOutputDate.getFullYear();<br />
			*/<br />
         // for Month, Day and Year output use...<br />
//         IONTargetEle.value =   IONArrMonthNames[IONOutputDate.getMonth()] + '/' +<br />
//                              ((IONOutputDate.getDate()<10)?'0':'')  +<br />
//                                IONOutputDate.getDate()                + '/' +<br />
//                                IONOutputDate.getFullYear();<br />
<br />
         IONHide();<br />
        }<br />
<br />
//------------------------------------------------------------------------------<br />
// End of customisation section<br />
//------------------------------------------------------------------------------<br />
<br />
    // I try to avoid browser sniffing but the IE SELECT/z-index "feature" means<br />
    // that I have had to place an IFRAME behind the pop-up.  This currently<br />
    // renders incorrectly in Opera (the IFRAME renders in front of the<br />
    // calendar) but as I write (2005-Nov-01) the rendering is fixed in Opera 9<br />
    // which is in Beta.<br />
<br />
    var IONIsOpera  = (navigator.userAgent.toLowerCase().indexOf("opera")!=-1);<br />
<br />
    // Browsers handle positioning differently Mozilla (Firefox & Flock) needs<br />
    // to exclude DIVs while IE/Opera must include them so unfortunately I have<br />
    // to sniff this too.<br />
<br />
    var IONIsFirefox= (navigator.userAgent.toLowerCase().indexOf("firefox")!=-1);<br />
<br />
    var IONTargetEle,<br />
        IONSaveText,<br />
        IONSaveBackground,<br />
        IONMonthSum         = 0,<br />
        IONBlnFullInputDate = false,<br />
        IONStartDate        = new Date(),<br />
        IONSeedDate         = new Date(),<br />
        IONWeekStart        = IONWeekStart%7;<br />
<br />
    // "Escape" all the user defined date delimiters -<br />
    // several delimiters will need it and it does no harm for the others.<br />
<br />
    var IONExpDelimiters    = new RegExp('[\\'+IONArrDelimiters.join('\\')+']','g');<br />
<br />
    // These regular expression validate the input date format to the<br />
    // following rules;<br />
    //<br />
    // Format:              Day   1-31 (optional zero on single digits)<br />
    //                      Month 1-12 (optional zero on single digits)<br />
    //                            or case insensitive name<br />
    //                      Year  Two or four digits<br />
<br />
    // Months names and Delimiters are as defined above<br />
<br />
    var IONExpValDay    = /^(0?[1-9]|[1-2]\d|3[0-1])$/,<br />
        IONExpValMonth  = new RegExp("^(0?[1-9]|1[0-2]|"        +<br />
                                     IONArrMonthNames.join("|") +<br />
                                     ")$","i"),<br />
        IONExpValYear   = /^(\d{2}|\d{4})$/;<br />
<br />
    function IONshowCal(IONEle,IONSourceEle)    {IONShow(IONEle,IONSourceEle);}<br />
    function IONShow(IONEle,IONSourceEle)<br />
        {//*********************************************************************<br />
         //   If no value is preset then the seed date is<br />
         //      Today (when today is in range) OR<br />
         //      The middle of the date range.<br />
<br />
         IONSeedDate = IONDateNow;<br />
<br />
         // Strip space characters from start and end of date input<br />
         IONEle.value = IONEle.value.replace(/^\s+/,'').replace(/\s+$/,'');<br />
<br />
         if (IONEle.value.length==0)<br />
            {// If no value is entered and today is within the range,<br />
             // use today's date, otherwise use the middle of the valid range.<br />
<br />
             IONBlnFullInputDate=false;<br />
<br />
             if ((new Date(IONBaseYear+IONDropDownYears-1,11,31))<IONSeedDate ||<br />
                 (new Date(IONBaseYear,0,1))                     >IONSeedDate<br />
                )<br />
                {IONSeedDate = new Date(IONBaseYear +<br />
                                        Math.floor(IONDropDownYears / 2), 5, 1);<br />
                }<br />
            }<br />
         else<br />
            {// Parse the string into an array using the allowed delimiters<br />
             IONArrSeedDate =<br />
                 IONInputFormat(IONEle.value.split(IONExpDelimiters),<br />
                                IONEle.value);<br />
<br />
             // So now we have the Year, Month and Day in an array.<br />
<br />
             //   If the year is two digits then the routine assumes a year<br />
             //   belongs in the 21st Century unless it is less than 50 in which<br />
             //   case it assumes the 20th Century is intended.<br />
<br />
             if (IONArrSeedDate[0]<100)<br />
                {IONArrSeedDate[0]= IONArrSeedDate[0] +<br />
                                    parseInt((IONArrSeedDate[0]>50)?1900:2000,<br />
                                             10);<br />
                }<br />
<br />
             // Check whether the month is in digits or an abbreviation<br />
<br />
             if (IONArrSeedDate[1].search(/\d+/)!=0)<br />
                {month = IONArrMonthNames.join('|').toUpperCase().<br />
                            search(IONArrSeedDate[1].substr(0,3).toUpperCase());<br />
                 IONArrSeedDate[1] = Math.floor(month/4)+1;<br />
                }<br />
<br />
             IONSeedDate = new Date(IONArrSeedDate[0],<br />
                                    IONArrSeedDate[1]-1,<br />
                                    IONArrSeedDate[2]);<br />
            }<br />
<br />
         // Test that we have arrived at a valid date<br />
<br />
         if (isNaN(IONSeedDate))<br />
            {//alert( IONInvalidDateMsg +<br />
                   // IONInvalidAlert[0] + IONEle.value +<br />
                  //  IONInvalidAlert[1]);<br />
             IONSeedDate = new Date(IONBaseYear +<br />
                    Math.floor(IONDropDownYears/2),5,1);<br />
             IONBlnFullInputDate=false;<br />
            }<br />
         else<br />
            {// Test that the date is within range,<br />
             // if not then set date to a sensible date in range.<br />
<br />
             if ((new Date(IONBaseYear,0,1)) > IONSeedDate)<br />
                {if (IONBlnStrict) //alert(IONOutOfRangeMsg);<br />
                 IONSeedDate = new Date(IONBaseYear,0,1);<br />
                 IONBlnFullInputDate=false;<br />
                }<br />
             else<br />
                {if ((new Date(IONBaseYear+IONDropDownYears-1,11,31))<<br />
                      IONSeedDate)<br />
                    {if (IONBlnStrict) //alert(IONOutOfRangeMsg);<br />
                     IONSeedDate = new Date(IONBaseYear +<br />
                                            Math.floor(IONDropDownYears)-1,<br />
                                                       11,1);<br />
                     IONBlnFullInputDate=false;<br />
                    }<br />
                 else<br />
                    {if (IONBlnStrict && IONBlnFullInputDate &&<br />
                          (IONSeedDate.getDate()      != IONArrSeedDate[2] ||<br />
                           (IONSeedDate.getMonth()+1) != IONArrSeedDate[1] ||<br />
                           IONSeedDate.getFullYear()  != IONArrSeedDate[0]<br />
                          )<br />
                        )<br />
                        {//alert(IONDoesNotExistMsg);<br />
                         IONSeedDate = new Date(IONSeedDate.getFullYear(),<br />
                                                IONSeedDate.getMonth()-1,1);<br />
                         IONBlnFullInputDate=false;<br />
                        }<br />
                    }<br />
                }<br />
            }<br />
<br />
         // Test the disabled dates for validity<br />
         // Give error message if not valid.<br />
<br />
         for (var i=0;i<IONDisabledDates.length;i++)<br />
            {if (!((typeof IONDisabledDates[i]      == 'object') &&<br />
                   (IONDisabledDates[i].constructor == Date)))<br />
                {if ((typeof IONDisabledDates[i]      == 'object') &&<br />
                     (IONDisabledDates[i].constructor == Array))<br />
                    {var IONPass = true;<br />
<br />
                     if (IONDisabledDates[i].length !=2)<br />
                        {//alert(IONRangeDisablingError[0] + IONDisabledDates[i] +<br />
                           //    IONRangeDisablingError[1]);<br />
                         IONPass = false;<br />
                        }<br />
                     else<br />
                        {for (var j=0;j<IONDisabledDates[i].length;j++)<br />
                            {if (!((typeof IONDisabledDates[i][j]      == 'object') &&<br />
                                   (IONDisabledDates[i][j].constructor == Date)))<br />
                                {//alert(IONDateDisablingError[0] + IONDisabledDates[i][j] +<br />
                                      // IONDateDisablingError[1]);<br />
                                 IONPass = false;<br />
                                }<br />
                            }<br />
                        }<br />
<br />
                     if (IONPass && (IONDisabledDates[i][0] > IONDisabledDates[i][1]))<br />
                        {IONDisabledDates[i].reverse();}<br />
                    }<br />
                 else<br />
                    {//alert(IONDateDisablingError[0] + IONDisabledDates[i] +<br />
                           //IONDateDisablingError[1]);<br />
                           }<br />
                }<br />
            }<br />
<br />
         // Calculate the number of months that the entered (or<br />
         // defaulted) month is after the start of the allowed<br />
         // date range.<br />
<br />
         IONMonthSum =  12*(IONSeedDate.getFullYear()-IONBaseYear)+<br />
                            IONSeedDate.getMonth();<br />
<br />
         // Set the drop down boxes.<br />
 <br />
 <br />
   <br />
   //Select the current year<br />
   <br />
	     document.getElementById('IONYears').options.selectedIndex =75<br />
            //Math.floor(IONMonthSum/12);<br />
            <br />
            var IONShowDate  = new Date(Date.parse(new Date().toDateString()));<br />
           <br />
         document.getElementById('IONMonths').options.selectedIndex=IONShowDate.getMonth();     <br />
            //(IONMonthSum%12);<br />
<br />
         // Position the calendar box<br />
<br />
         var offsetTop =parseInt(IONEle.offsetTop,10)+<br />
                        parseInt(IONEle.offsetHeight,10),<br />
             offsetLeft=parseInt(IONEle.offsetLeft,10);<br />
<br />
         IONTargetEle=IONEle;<br />
<br />
         do {IONEle=IONEle.parentNode;<br />
             if (IONEle.tagName!='FORM'  &&<br />
                 IONEle.tagName!='TBODY' &&<br />
                 IONEle.tagName!='TR'    &&<br />
                 ((IONIsFirefox && IONEle.tagName!='DIV') || !IONIsFirefox) &&<br />
                 IONEle.nodeType==1)<br />
                {offsetTop +=parseInt(IONEle.offsetTop,10);<br />
                 offsetLeft+=parseInt(IONEle.offsetLeft,10);<br />
                 <br />
                 if(IONEle.tagName=='DIV')<br />
                {<br />
					offsetTop-=IONEle.scrollTop;<br />
                }<br />
                 <br />
                }<br />
            }<br />
         while (IONEle.tagName!='BODY');<br />
<br />
         document.getElementById('ION').style.top =offsetTop +'px';<br />
         document.getElementById('ION').style.left=offsetLeft+'px';<br />
<br />
         if (!IONIsOpera)<br />
            {document.getElementById('IONIframe').style.top =offsetTop +'px';<br />
             document.getElementById('IONIframe').style.left=offsetLeft+'px';<br />
             document.getElementById('IONIframe').style.width  =<br />
                (document.getElementById('ION').offsetWidth-2)+'px';<br />
             document.getElementById('IONIframe').style.height =<br />
                (document.getElementById('ION').offsetHeight-2)+'px';<br />
             document.getElementById('IONIframe').style.visibility='visible';<br />
            }<br />
<br />
         // Display the month<br />
<br />
         IONShowMonth(0);<br />
<br />
         // Show it on the page<br />
<br />
         document.getElementById('ION').style.visibility='visible';<br />
<br />
         IONCancelPropagation(IONSourceEle);<br />
        }<br />
<br />
    function IONCellOutput(IONEvt)<br />
        {var IONEle = IONeventTrigger(IONEvt),<br />
             IONOutputDate = new Date(IONStartDate);<br />
<br />
         IONOutputDate.setDate(IONStartDate.getDate() +<br />
                                 parseInt(IONEle.id.substr(8),10));<br />
<br />
         IONSetOutput(IONOutputDate);<br />
        }<br />
<br />
    function IONFootOutput()<br />
        {IONSetOutput(IONDateNow);}<br />
<br />
    function IONCancelPropagation(IONSourceEle)<br />
        {if (typeof event=='undefined')         //Firefox<br />
                {IONSourceEle.parentNode.<br />
                    addEventListener("click",IONStopPropagation,false);<br />
                }<br />
         else   {event.cancelBubble = true;}    //IE, Opera<br />
        }<br />
<br />
    function IONStopPropagation(IONEvt)<br />
        {if (typeof event=='undefined')<br />
              IONEvt.stopPropagation();         //Firefox<br />
         else IONEvt.cancelBubble = true;    //IE, Opera<br />
        }<br />
<br />
    function IONHighlight(e)<br />
        {var IONEle = IONeventTrigger(e);<br />
<br />
         IONSaveText        =IONEle.style.color;<br />
         IONSaveBackground  =IONEle.style.backgroundColor;<br />
<br />
         IONEle.style.color             =IONHighlightText;<br />
         IONEle.style.backgroundColor   =IONHighlightBackground;<br />
<br />
         return true;<br />
        }<br />
<br />
    function IONUnhighlight(e)<br />
        {var IONEle = IONeventTrigger(e);<br />
<br />
         IONEle.style.backgroundColor   =IONSaveBackground;<br />
         IONEle.style.color             =IONSaveText;<br />
<br />
         return true;<br />
        }<br />
<br />
    function IONeventTrigger(e)<br />
        {if (!e) e = event;<br />
         return e.target||e.srcElement;<br />
        }<br />
<br />
    function IONCancel(e)<br />
        {if (IONClickToHide) IONHide();<br />
         IONStopPropagation(e);}<br />
<br />
    function IONHide()<br />
        {document.getElementById('ION').style.visibility='hidden';<br />
         if (!IONIsOpera)<br />
            {document.getElementById('IONIframe').style.visibility='hidden';}<br />
        }<br />
<br />
    function IONFootOver()<br />
        {document.getElementById('IONFoot').style.color=IONTodayHighlight;<br />
         document.getElementById('IONFoot').style.fontWeight='bold';<br />
        }<br />
<br />
    function IONFootOut()<br />
        {document.getElementById('IONFoot').style.color=IONTodayText;<br />
         document.getElementById('IONFoot').style.fontWeight='normal';<br />
        }<br />
<br />
    function IONShowMonth(IONBias)<br />
        {// Set the selectable Month and Year<br />
         // May be called: from the left and right arrows<br />
         //                  (shift month -1 and +1 respectively)<br />
         //                from the month selection list<br />
         //                from the year selection list<br />
         //                from the IONshowCal routine<br />
         //                  (which initiates the display).<br />
<br />
         var IONShowDate  = new Date(Date.parse(new Date().toDateString()));<br />
<br />
         IONSelYears  = document.getElementById('IONYears');<br />
         IONSelMonths = document.getElementById('IONMonths');<br />
<br />
         if (IONSelYears.options.selectedIndex>-1)<br />
            {IONMonthSum=12*(IONSelYears.options.selectedIndex)+IONBias;<br />
			 if (IONSelMonths.options.selectedIndex>-1)<br />
                {IONMonthSum+=IONSelMonths.options.selectedIndex;}<br />
            }<br />
         else<br />
            {if (IONSelMonths.options.selectedIndex>-1)<br />
                {IONMonthSum+=IONSelMonths.options.selectedIndex;}<br />
            }<br />
<br />
         IONShowDate.setFullYear(IONBaseYear + Math.floor(IONMonthSum/12),<br />
                                 (IONMonthSum%12),<br />
                                 1);<br />
<br />
		 if ((12*parseInt((IONShowDate.getFullYear()-IONBaseYear),10)) +<br />
             parseInt(IONShowDate.getMonth(),10) < (12*IONDropDownYears)    &&<br />
             (12*parseInt((IONShowDate.getFullYear()-IONBaseYear),10)) +<br />
             parseInt(IONShowDate.getMonth(),10) > -1)<br />
            {IONSelYears.options.selectedIndex=Math.floor(IONMonthSum/12);<br />
             IONSelMonths.options.selectedIndex=(IONMonthSum%12);<br />
<br />
             IONCurMonth = IONShowDate.getMonth();<br />
<br />
             IONShowDate.setDate(-(IONShowDate.getDay()-IONWeekStart)%7+1);<br />
<br />
             IONStartDate = new Date(IONShowDate);<br />
<br />
             var IONFoot = document.getElementById('IONFoot');<br />
<br />
             if (IONDisabledDates.length==0)<br />
                {if (IONActiveToday)<br />
                    {IONFoot.onclick=IONFootOutput;<br />
                     IONFoot.onmouseover=IONFootOver;<br />
                     IONFoot.onmouseout =IONFootOut;<br />
                    }<br />
                 else<br />
                    {if (document.addEventListener)<br />
                            {IONFoot.addEventListener('click',IONStopPropagation, false);}<br />
                     else   {IONFoot.attachEvent('onclick',IONStopPropagation);}<br />
                     IONFoot.onmouseover=null;<br />
                     IONFoot.onmouseout=null;<br />
                    }<br />
                }<br />
             else<br />
                {for (var k=0;k<IONDisabledDates.length;k++)<br />
                    {if (!IONActiveToday ||<br />
                         ((typeof IONDisabledDates[k]      == 'object')                 &&<br />
                             (((IONDisabledDates[k].constructor == Date)                &&<br />
                               IONDateNow.valueOf() == IONDisabledDates[k].valueOf()<br />
                              ) ||<br />
                              ((IONDisabledDates[k].constructor == Array)               &&<br />
                               IONDateNow.valueOf() >= IONDisabledDates[k][0].valueOf() &&<br />
                               IONDateNow.valueOf() <= IONDisabledDates[k][1].valueOf()<br />
                              )<br />
                             )<br />
                         )<br />
                        )<br />
                        {if (document.addEventListener)<br />
                                {IONFoot.addEventListener('click',IONStopPropagation, false);}<br />
                         else   {IONFoot.attachEvent('onclick',IONStopPropagation);}<br />
                         IONFoot.onmouseover=null;<br />
                         IONFoot.onmouseout=null;<br />
                         break;<br />
                        }<br />
                     else<br />
                        {IONFoot.onclick=IONFootOutput;<br />
                         IONFoot.onmouseover=IONFootOver;<br />
                         IONFoot.onmouseout =IONFootOut;<br />
                        }<br />
                    }<br />
                }<br />
<br />
             // Treewalk to display the dates.<br />
             // I tried to use getElementsByName but IE refused to cooperate<br />
             // so I resorted to this method which works for all tested<br />
             // browsers.<br />
<br />
             var IONCells = document.getElementById('IONCells');<br />
<br />
             for (i=0;i<IONCells.childNodes.length;i++)<br />
                {var IONRows = IONCells.childNodes[i];<br />
                 if (IONRows.nodeType==1 && IONRows.tagName=='TR')<br />
                    {for (j=0;j<IONRows.childNodes.length;j++)<br />
                        {var IONCols = IONRows.childNodes[j];<br />
                         if (IONCols.nodeType==1 && IONCols.tagName=='TD')<br />
                            {IONRows.childNodes[j].innerHTML=<br />
                                    IONShowDate.getDate();<br />
<br />
                             var IONCellStyle=IONRows.childNodes[j].style,<br />
                                 IONDisabled = false;<br />
<br />
                             for (var k=0;k<IONDisabledDates.length;k++)<br />
                                {if ((typeof IONDisabledDates[k]      == 'object')  &&<br />
                                     (IONDisabledDates[k].constructor == Date)      &&<br />
                                     IONShowDate.valueOf() == IONDisabledDates[k].valueOf())<br />
                                    {IONDisabled = true;}<br />
                                 else<br />
                                    {if ((typeof IONDisabledDates[k]      == 'object') &&<br />
                                         (IONDisabledDates[k].constructor == Array)    &&<br />
                                         IONShowDate.valueOf() >= IONDisabledDates[k][0].valueOf() &&<br />
                                         IONShowDate.valueOf() <= IONDisabledDates[k][1].valueOf())<br />
                                        {IONDisabled = true;}<br />
                                    }<br />
                                }<br />
<br />
                             if (IONDisabled || !IONEnabledDay[j+(7*((i*IONCells.childNodes.length)/6))])<br />
                                {IONRows.childNodes[j].onclick=null;<br />
                                 IONRows.childNodes[j].onmouseover=null;<br />
                                 IONRows.childNodes[j].onmouseout=null;<br />
                                 IONCellStyle.color=IONDisabledDayText;<br />
                                 IONCellStyle.backgroundColor=<br />
                                     IONDisabledDayBackground;<br />
                                }<br />
                             else<br />
                                {IONRows.childNodes[j].onclick      =IONCellOutput;<br />
                                 IONRows.childNodes[j].onmouseover  =IONHighlight;<br />
                                 IONRows.childNodes[j].onmouseout   =IONUnhighlight;<br />
<br />
                                 if (IONShowDate.getMonth()!=IONCurMonth)<br />
                                    {IONCellStyle.color=IONExMonthText;<br />
                                     IONCellStyle.backgroundColor=<br />
                                         IONExMonthBackground;<br />
                                    }<br />
                                 else if (IONBlnFullInputDate &&<br />
                                          IONShowDate.toDateString()==<br />
                                          IONSeedDate.toDateString())<br />
                                    {IONCellStyle.color=IONInDateText;<br />
                                     IONCellStyle.backgroundColor=<br />
                                         IONInDateBackground;<br />
                                    }<br />
                                 else if (IONShowDate.getDay()%6==0)<br />
                                    {IONCellStyle.color=IONWeekendText;<br />
                                     IONCellStyle.backgroundColor=<br />
                                         IONWeekendBackground;<br />
                                    }<br />
                                 else<br />
                                    {IONCellStyle.color=IONCellText;<br />
                                     IONCellStyle.backgroundColor=<br />
                                         IONCellBackground;<br />
                                    }<br />
                                }<br />
<br />
                             IONShowDate.setDate(IONShowDate.getDate()+1);<br />
                            }<br />
                        }<br />
                    }<br />
                }<br />
            }<br />
        }<br />
<br />
    if (!IONIsOpera)<br />
        {document.write("<iframe class='ION' " +<br />
                                "id='IONIframe' name='IONIframe' "   +<br />
                                "frameborder='0'>"                   +<br />
                        "</iframe>");<br />
        }<br />
<br />
<br />
    document.write(<br />
     "<table id='ION' class='ION'>" +<br />
       "<tr class='ION'>" +<br />
         "<td class='ION'>" +<br />
           "<table class='IONHead' id='IONHead' " +<br />
                    "cellspacing='0' cellpadding='0' width='100%'>" +<br />
            "<tr class='IONHead'>" +<br />
                "<td class='IONHead'>" +<br />
                    "<input class='IONHead' type='button' value='<' " +<br />
                            "onclick='IONShowMonth(-1);'  /></td>" +<br />
                 "<td class='IONHead'>" +<br />
                    "<select id='IONMonths' class='IONHead' " +<br />
                            "onChange='IONShowMonth(0);'>");<br />
<br />
    for (i=0;i<IONArrMonthNames.length;i++)<br />
        document.write(   "<option>" + IONArrMonthNames[i] + "</option>");<br />
<br />
    document.write("   </select>" +<br />
                 "</td>" +<br />
                 "<td class='IONHead'>" +<br />
                    "<select id='IONYears' class='IONHead' " +<br />
                            "onChange='IONShowMonth(0);'>");<br />
<br />
    for (i=0;i<IONDropDownYears;i++)<br />
        document.write(   "<option>" + (IONBaseYear+i) + "</option>");<br />
<br />
    document.write(   "</select>" +<br />
                 "</td>" +<br />
                 "<td class='IONHead'>" +<br />
                    "<input class='IONHead' type='button' value='>' " +<br />
                            "onclick='IONShowMonth(1);' /></td>" +<br />
                "</tr>" +<br />
              "</table>" +<br />
            "</td>" +<br />
          "</tr>" +<br />
          "<tr class='ION'>" +<br />
            "<td class='ION'>" +<br />
              "<table class='IONCells' align='center'>" +<br />
                "<thead class='IONWeek'>" +<br />
                  "<tr  class='IONWeek'>");<br />
<br />
    for (i=0;i<IONArrWeekInits.length;i++)<br />
        document.write( "<td class='IONWeek'>" +<br />
                          IONArrWeekInits[(i+IONWeekStart)%IONArrWeekInits.length] +<br />
                        "</td>");<br />
<br />
    document.write("</tr>" +<br />
                "</thead>" +<br />
                "<tbody class='IONCells' id='IONCells'>");<br />
<br />
    for (i=0;i<6;i++)<br />
        {document.write(<br />
                    "<tr class='IONCells'>");<br />
         for (j=0;j<7;j++)<br />
            {document.write(<br />
                        "<td class='IONCells' id='IONCell_" + (j+(i*7)) +<br />
                        "'></td>");<br />
            }<br />
<br />
         document.write(<br />
                    "</tr>");<br />
        }<br />
<br />
    document.write(<br />
                "</tbody>");<br />
<br />
    if ((new Date(IONBaseYear + IONDropDownYears, 11, 32)) > IONDateNow &&<br />
        (new Date(IONBaseYear, 0, 0))                      < IONDateNow)<br />
        {document.write(<br />
                  "<tfoot class='IONFoot'>" +<br />
                    "<tr class='IONFoot'>" +<br />
                      "<td class='IONFoot' id='IONFoot' colspan='7'>" + IONToday + " ");<br />
<br />
         IONDisplayFormat(IONDateNow);<br />
<br />
         document.write(<br />
                        "</td>" +<br />
                     "</tr>" +<br />
                   "</tfoot>");<br />
        }<br />
<br />
    document.write(<br />
              "</table>" +<br />
            "</td>" +<br />
          "</tr>" +<br />
        "</table>");<br />
<br />
    if (document.addEventListener)<br />
        {document.addEventListener('click',IONHide, false);<br />
         document.getElementById('ION').addEventListener('click',IONCancel,false);<br />
         document.getElementById('IONHead').addEventListener('click',IONStopPropagation,false);<br />
         document.getElementById('IONCells').addEventListener('click',IONStopPropagation,false);<br />
        }<br />
    else<br />
        {document.attachEvent('onclick',IONHide);<br />
         document.getElementById('ION').attachEvent('onclick',IONCancel);<br />
         document.getElementById('IONHead').attachEvent('onclick',IONStopPropagation);<br />
         document.getElementById('IONCells').attachEvent('onclick',IONStopPropagation);<br />
        }<br />
<br />
// End of Calendar<br />
<br />
	<br />
	<br />
	//function for numeric field validation using custom validator asp.net<br />
	<br />
	function IONIONnumericRequired(sender,arguments)<br />
		{<br />
		var checkOK = "0123456789."; 	<br />
		var checkStr =arguments.Value; <br />
		var i,j;<br />
		var flag = true;	<br />
		var cntChk=checkStr.length;<br />
		var cntOK=checkOK.length;<br />
		<br />
	<br />
		for (i = 0; i < cntChk; i++)<br />
			 {<br />
				ch = checkStr.charAt(i);<br />
				for (j = 0; j < cntOK ; j++)<br />
				{<br />
					if (ch == checkOK.charAt(j)) <br />
					break;<br />
					if (j ==cntOK -1)<br />
					 {<br />
						flag = false;<br />
						break; <br />
					} <br />
				}<br />
			<br />
			if(flag==true)<br />
			{<br />
			arguments.IsValid=true;<br />
			}<br />
			else<br />
			{<br />
			arguments.IsValid=false;<br />
			}<br />
		}<br />
	}<br />
	<br />
	//function for numeric field validation using javascript <br />
	<br />
	function IONnumericReq(obj)<br />
		{<br />
		<br />
			var checkOK = "0123456789"; <br />
			//var checkStr = objName; <br />
			var flag = true;<br />
<br />
			for (i = 0; i < obj.value.length; i++)<br />
			 {<br />
				ch = obj.value.charAt(i);<br />
				for (j = 0; j < checkOK.length; j++)<br />
				{<br />
					if (ch == checkOK.charAt(j)) <br />
					break;<br />
					if (j == checkOK.length-1)<br />
					 {<br />
						flag = false;<br />
						break; <br />
					} <br />
				}<br />
			}<br />
			<br />
			if(flag==true)<br />
			alert("data is numeric");<br />
			else<br />
			{<br />
			alert("enter nuneric data");<br />
			}<br />
	} <br />
	<br />
		function IONshowDate(id)<br />
		{<br />
			IONShow(id,this);<br />
		}<br />
<br />

<br />
<br />
artial Class Controls_calendar_DateSelector<br />
    Inherits System.Web.UI.UserControl<br />
 <br />
<br />
<br />
#Region " Web Form Designer Generated Code "<br />
<br />
    'This call is required by the Web Form Designer.<br />
    <System.Diagnostics.DebuggerStepThrough()> Private Sub InitializeComponent()<br />
<br />
    End Sub<br />
    'Protected WithEvents lbl_Date As System.Web.UI.WebControls.Label<br />
    'Protected WithEvents txt_Date As System.Web.UI.WebControls.TextBox<br />
    'Protected WithEvents imgCalendar As System.Web.UI.WebControls.Image<br />
    'Protected WithEvents PnlCalender As System.Web.UI.WebControls.Panel<br />
<br />
    'NOTE: The following placeholder declaration is required by the Web Form Designer.<br />
    'Do not delete or move it.<br />
    Private designerPlaceholderDeclaration As System.Object<br />
<br />
    Private Sub Page_Init(ByVal sender As System.Object, ByVal e As System.EventArgs) Handles MyBase.Init<br />
        'CODEGEN: This method call is required by the Web Form Designer<br />
        'Do not modify it using the code editor.<br />
        InitializeComponent()<br />
    End Sub<br />
<br />
#End Region<br />
<br />
    Private intLeftPos As Integer<br />
    Private intTopPos As Integer<br />
    Private UntWidth As System.Web.UI.WebControls.Unit<br />
<br />
<br />
    Private Sub Page_Load(ByVal sender As System.Object, ByVal e As System.EventArgs) Handles MyBase.Load<br />
        'Put user code to initialize the page here<br />
        Dim strUserpos As String<br />
        strUserpos = intLeftPos.ToString & " , " & intTopPos.ToString<br />
<br />
        Dim scriptStr As String = _<br />
                "javascript:return IONshowDate(" & getClientID() & ")"<br />
<br />
        imgCalendar.Attributes.Add("onclick", scriptStr)<br />
<br />
    End Sub<br />
<br />
    ' Get the id of the control rendered on client side<br />
    ' Very essential for Javascript Calendar scripts to locate the textbox<br />
    Public Function getClientID() As String<br />
        Return txt_Date.ClientID()<br />
    End Function<br />
    'This property will set the CSS for textbox  if it is in Fast Entry<br />
    Public WriteOnly Property FastEntry() As Boolean<br />
        Set(ByVal Value As Boolean)<br />
            If Value = True Then<br />
                txt_Date.CssClass = "txtNoFocusFE"<br />
            Else<br />
                txt_Date.CssClass = "txtNoFocus"<br />
            End If<br />
        End Set<br />
    End Property<br />
<br />
<br />
    ' This propery sets/gets the calendar date<br />
    Public Property CalendarDate() As String<br />
        Get<br />
            Return txt_Date.Text<br />
        End Get<br />
        Set(ByVal Value As String)<br />
            txt_Date.Text = Value<br />
        End Set<br />
    End Property<br />
<br />
    Public Property readOnlyDate() As Boolean<br />
        Get<br />
            Return imgCalendar.Visible<br />
        End Get<br />
        Set(ByVal Value As Boolean)<br />
            imgCalendar.Visible = Value<br />
        End Set<br />
    End Property<br />
<br />
    Public Property Editable() As Boolean<br />
        Get<br />
            Return txt_Date.ReadOnly<br />
        End Get<br />
        Set(ByVal Value As Boolean)<br />
            txt_Date.ReadOnly = Not Value<br />
        End Set<br />
    End Property<br />
<br />
    Public Property Width() As System.Web.UI.WebControls.Unit<br />
        Get<br />
            Return UntWidth<br />
        End Get<br />
        Set(ByVal Value As System.Web.UI.WebControls.Unit)<br />
            Dim Unttmp As New Unit<br />
            Dim UntTmpWidth As New Unit<br />
            Dim cnvtUnt As New UnitConverter<br />
            'UntTmpWidth = Value<br />
            UntWidth = Value<br />
            UntTmpWidth = Value<br />
<br />
            Select Case Value.Type 'Value.Type<br />
                Case UnitType.Pixel<br />
                    'If Value.Value < 86 Then<br />
                    '    UntTmpWidth = Unit.Point(86)<br />
                    'End If<br />
                    Unttmp = Unit.Pixel(UntTmpWidth.Value - imgCalendar.Width.Value)<br />
                Case UnitType.Percentage<br />
                    Unttmp = Unit.Percentage(Value.Value - 15)<br />
                Case UnitType.Point<br />
                    'If Value.Value < 65 Then<br />
                    '    UntTmpWidth = Unit.Point(65)<br />
                    'End If<br />
                    imgCalendar.Width = Unit.Point((imgCalendar.Width.Value * 0.75))<br />
                    UntTmpWidth = Unit.Pixel(Value.Value * 1.33)<br />
                    Unttmp = Unit.Pixel(UntTmpWidth.Value - imgCalendar.Width.Value)<br />
            End Select<br />
            PnlCalender.Width = UntTmpWidth<br />
            txt_Date.Width = Unttmp<br />
        End Set<br />
    End Property<br />
<br />
    Public Property LeftPos() As Integer<br />
        Get<br />
            Return intLeftPos<br />
        End Get<br />
        Set(ByVal Value As Integer)<br />
            intLeftPos = Value<br />
        End Set<br />
    End Property<br />
    Public Property TopPos() As Integer<br />
        Get<br />
            Return intTopPos<br />
        End Get<br />
        Set(ByVal Value As Integer)<br />
            intTopPos = Value<br />
        End Set<br />
    End Property<br />
<br />
End Class<br />
<br />