Response.Flush in ASP.NET

Author posted by Jitendra on Posted on under category Categories ASP.NET and tagged as Tags with Leave a comment on Response.Flush in ASP.NET

Usage of Response.Flush method in ASP.NET, its disadvantage and advantage of buffering in IIS.

IIS5 enables buffering by default, therefore all the output from your ASP is actually sent to the browser only when the page completes its processing. In many cases this approach improves the overall processing speed, and indirectly makes for a more scalable site.

However, buffering has two minor defects:

  1. The end user might perceive a loss in speed, because she won’t see any output until the page is complete, and
  2. Buffered output has to be maintained on the server, therefore your ASP application is going to take more memory than it would do if buffering were disabled. On server machines with an inadequate amount of memory, large HTML pages can reduce the overall performance.

Continue reading “Response.Flush in ASP.NET”

Page loads multiple times in Rad Window

Author posted by Jitendra on Posted on under category Categories ASP.NET and tagged as Tags , with Leave a comment on Page loads multiple times in Rad Window

Solution of Multiple time page load problem of Telerik Rad Window.

In Previous article, i have discussed the multiple times firing of telerik Rad Window and its solution at code side. (C#)

In this article i will provide solution of same problem in Javascript style. 🙂

How to set the problem of loading popup three time…

  1. Any page must have only one RadWindowManager, if have more than one manager then usually it sets the setting of first manager…. Ambiguity
  2. ReloadOnShow must be false. Instead of this use below technique.

Create a random javascript number and send as a URl parameter while opening from client side, in this way, it will ensure to load page with reload option. And therefore no need of this flag.

Continue reading “Page loads multiple times in Rad Window”

Row expand collapse using jquery and Ajax

Author posted by Jitendra on Posted on under category Categories ASP.NET and tagged as Tags , , , , , with 3 Comments on Row expand collapse using jquery and Ajax

Using JQuery and Ajax to expand and collapse the row in ASP.NET

This article describes how to expand and collapse rows of a GridView or Table and showing data details using Jquery and Ajax

Introduction:

Now day’s , important issue with web applications is how quick a wed page is rendered  and how it is animated or  visualized

So for quick reply from server Ajax is the solutions and for some visualizations with server side response we mostly use jquery or javascript.
I this article, for exp

anding , collapsing and  adding details to gridview row we are going to use AJAX to make call to server and we will visualized it using jquery.

Aim

1. Getting details of product  by extracting details at the next to current row and before second    one.

2. Visualizing  the expanding of rows.

3. No server side postback.

4. Using GridView Control to bind data and simple data binding to table using scriptlet.

Using  Jquery Code

Expanding Row :

For expanding any row, we need to create an new row  with the serverside details  and then we will add it to the next of current row

Ajax JQuery Row Expand Collapse

var trindex=0;	//trindex hold row index created by jquery
$("tr").click(function() {
if ($(this).find("td:first").length > 0) { //check whether it is header or content row
//row index increment to assign new row id everytime
trindex++;
//create a row with td colspan 3 to show product description
var row= '><td class="currRow" colspan="3" ><
div id="did"><img id="imagepath" src=""
style="height: 81px; width: 104px" />  Description :<
span id="des">sd</span><p>Cost :<
span id="cost">sd</span></p></div></td></tr>';

//adding animation to row
var newRow = $("<tr id=tr"+ trindex + row).animate({
height: "140px",
opacity: 0.25,
}, 500);
//adding row to existing table
$(this).after(newRow);
Collapsing  Row :

At the same moment we expand any row, we collapse previous created row, so we need to remember the previous created rowIndex or it’s id.

Ajax JQuery Row Expand Collapse

$("#"+rowName).find('td').removeClass('currRow').addClass('hideRow');
$("#"+rowName).animate({
    height: "0px",
    opacity: 0.25,
    }, 1000, function() {
$("#"+rowName).remove();</pre>
<h5>Ajax Call to the server :</h5>
For getting the full details about our shortly highlighted product, we need to make a asynchronous call to
server using AJAX. We are passing some key values to server(product Id) to extract the resultset.
<pre>$.ajax({
       type: "POST",
       url: "WebService.asmx/GetDetails",   //webserviceName/methodName
       data: "{'name': '" + $(this).find("td span").text() + "'}",  //passing values to webservice(productid)
       contentType: "application/json; charset=utf-8",
       dataType: "json",
       success: function(msg) {
       //extrating response data to newly created row
       $("#tr"+trindex ).find("td #did p #cost").text(msg.d.id );
       $("#tr"+trindex ).find("td #did  #des").text(msg.d.order);
       $("#tr"+trindex ).find("td #did #imagepath").attr('src', msg.d.order);
//$("#myImage").attr("src", "path/to/newImage.jpg");
       },
       error: FailedMessage     //showing error message if failure
       });
Using The WebService.cs

Programmable application logic accessible via standard Web protocols.We are using webservice to extract data from database using jquery Ajax call.  CollectData class to hold extracted details from db.

public class CollectData
{
        public string cost { get; set; }
        public string imagePath { get; set; }
        public string description { get; set; }
}

Simple queries to the database via WebMethod

[WebMethod()]
    public CollectData GetDetails(string name)
    {
        SqlConnection con = new SqlConnection(ConfigurationManager.ConnectionStrings["ConnectionString"].
        ConnectionString);
        SqlCommand cmd = new SqlCommand("Select cost, imagePath, description from Products where ProductId='" +
        name + "'",con);
        SqlDataReader data;
        CollectData c = new CollectData();
        try
        {
            con.Open();
            data=cmd.ExecuteReader();
            if (data.Read())
            {
                c.cost= data[0].ToString();
                c.imagePath = data[1].ToString();
                c.description = data[2].ToString();
                return c;
            }
            else
            {
                c.cost = "N/A";
                c.imagePath = "N/A";
                c.description = "N/A";
                return c;
            }
        }
        catch (Exception ex)
        {
            c.cost = "N/A";
            c.imagePath = "N/A";
            c.description = "N/A";
            return c;
        }

    }

Conclusion :

We have mixed up Jquery, Ajax, server Control(Gridview ) to get quick and visualized output. Result can be little bit change as per the browsers.

Uploaded on Codeproject

Download Demo Article

Telerik RadWindow Pop up Problem in Chrome and safari

Author posted by Jitendra on Posted on under category Categories ASP.NET and tagged as Tags , with 1 Comment on Telerik RadWindow Pop up Problem in Chrome and safari

Telerik Popup Window Height is not set in Safari and Chrome (Apple Webkit Browsers)

Recently i have faced one issue with display of Telerik Rad Window on Apple Webkit browsers (Chrome and safari).

The problem was, the window appeared cropped in Chrome and safari. the height attribute of body tag wasn’t working properly.

After lots of trial and googling I found one work around to solve this issue.

Set the contentFrame after show of Telerik pop up from Client side to 100%, and it will save your time. 🙂

 var oWindow = $find("<%=radAddCD.ClientID%>;");
 if(oWindow)
 {
 oWindow.show();
 var contentFrame = oWindow.get_contentFrame();
 contentFrame.style.height = "100%";
 return false;
 }

Clear ASP page cache – Page_Load() firing multiple time in RadWindow Popup

How to prevent the multiple Page load event in case Telerik Rad Window Popup is used and Clear ASP page cache.

Setting ReloadOnShow property of RadWindow for Popup to true causes its Page_load to be executed multiple times hence redundant multiple database calls causing to some extent of performance hit.

ReloadOnShow needs to be  set to true since page_load/refresh of Popup wasn’t firing on subsequent opens.

Solution

We can set ReloadOnShow to false and use alternative code in page_load as following in C#:

below code will clear the cache of ASPX page and thus reloaded every time in browser.

Note : you should run these statement before sending any HTML to the user. If in doubt, use Respose.Buffer = True to buffer all html

Response.Cache.SetCacheability(HttpCacheability.NoCache);
Response.Cache.SetNoServerCaching();
Response.Cache.SetNoStore();
Response.AppendHeader("Pragma", "no-cache");
Response.Expires = -1;
Response.CacheControl = "no-cache";

Find all possible solution at this URL

Difference between $find and $get Methods

Author posted by Jitendra on Posted on under category Categories ASP.NET and tagged as Tags , , with Leave a comment on Difference between $find and $get Methods

What is Difference between $find() and $get() Methods in ASP.NET

$get is used to get a reference to a DOM element. It is an alias for Sys.UI.DomElement.getElementById:

var myLabel = $get(‘myLabel’);

$find is an alias for Sys.Application.findComponent() and it’s used to get a reference to a particular component, given its id.

How to get DOM element using $find

var lnkAddNew = $find("CntrlID");
if(lnkAddNew)
{
    lnkAddNew.get_element().style.display = '';
}

Rad Tooltip overlaps the target control – solution

Author posted by Jitendra on Posted on under category Categories ASP.NET and tagged as Tags with Leave a comment on Rad Tooltip overlaps the target control – solution

Telerik Tooltip Problem – overlaps the target control in case of scrolling

Hi Readers,
This time i am here for the Telerik Users. The most common problem faced by the Telerik Toltip User is that The telerik tooltip overlaps the target control. you can find the problem in below image.

Telerik Tooltip, Rad Control Tooltip problem

To solve this problem we need to add the client side script in Telerik Tooltip for OnClientBeforeShow event.

like this:

<telerik:RadToolTip OnClientBeforeShow="OnClientBeforeShow" Width="200" TargetControlID="lblTooltip"
 ID="RadToolTip1" runat="server">
        Lorem ipsum dolor sit amet, vitae ut vitae accumsan dis mauris malesuada, ultricies risus,
        Lorem ipsum dolor sit amet, vitae ut vitae accumsan dis mauris malesuada, ultricies risus,
        </telerik:RadToolTip>

Add below javascript in your ASPX page.

 <script type="text/javascript">
    function OnClientBeforeShow(sender, args)
        {
           sender._popupBehavior.set_keepInScreenBounds(false);
        }
    </script>

And, thats its. The problem is solved.  pretty cool hmm 🙂

Telerik Tooltip, Rad Tooltip solution

Selecting and Sorting in DataTable – ASP.net C#

Author posted by Jitendra on Posted on under category Categories ASP.NET and tagged as Tags with Leave a comment on Selecting and Sorting in DataTable – ASP.net C#

Demonstrates that how to select and sort the Datatable in ASP.Net , C#

DataTable in C# have very reach features to store the data in Tabular forms and also to display sorted or selected data on predefined category. Below i have provided the source code which demonstrates that how to select and sort the Datatable in ASP.Net.

Sorting and Selecting DataTable in ASP

below is the snap of C# File:

 public partial class _Default : System.Web.UI.Page
    {
        protected void Page_Load(object sender, EventArgs e)
        {
            DataTable dt = prepareTable();
            GridView1.DataSource = dt;
            GridView1.DataBind();

            dt.DefaultView.Sort = "DOB ASC";
            GridView2.DataSource = dt;
            GridView2.DataBind();

            dt.DefaultView.Sort = "Age DESC";
            GridView3.DataSource = dt;
            GridView3.DataBind();

            dt.DefaultView.Sort = "Id DESC, Age ASC";
            GridView4.DataSource = dt;
            GridView4.DataBind();

            DataRow[] dtRows = dt.Select("Age > 20", "Age ASC");
            DataTable dt1 = new DataTable();
            dt1.Columns.Add("Id", typeof(int));
            dt1.Columns.Add("Name", typeof(string));
            dt1.Columns.Add("Age", typeof(int));
            dt1.Columns.Add("DOB", typeof(DateTime));

            foreach (DataRow dr in dtRows)
            {
                dt1.Rows.Add(dr[0], dr[1], dr[2],dr[3]);
            }

            GridView5.DataSource = dt1;
            GridView5.DataBind();
        }

        /// <summary>
        /// Prepares the table for Data.
        /// </summary>
        /// <returns></returns>
        private DataTable prepareTable()
        {
            DataTable rs = new DataTable();
            rs.Columns.Add("Id", typeof(int));
            rs.Columns.Add("Name", typeof(string));
            rs.Columns.Add("Age", typeof(int));
            rs.Columns.Add("DOB", typeof(DateTime));

            AddItems(rs,1,"Tuiya",24,DateTime.Now.AddYears(-20));
            AddItems(rs, 2, "Sonu", 20, DateTime.Now.AddYears(-21));
            AddItems(rs, 4, "Rohan", 19, DateTime.Now.AddYears(-22));
            AddItems(rs, 4, "Manoranjan", 27, DateTime.Now.AddYears(-23));
            AddItems(rs, 1, "Santosh", 24, DateTime.Now.AddYears(-20));

            return rs;
        }

        /// <summary>
        /// Adds the items.
        /// </summary>
        /// <param name="rs">The DataTable.</param>
        /// <param name="id">The id.</param>
        /// <param name="name">The name.</param>
        /// <param name="age">The age.</param>
        /// <param name="dob">The dob.</param>
        private static void AddItems(DataTable rs,int id,string name,int age,DateTime dob)
        {
            DataRow dtRow = rs.NewRow();
            dtRow[0] = id;
            dtRow[1] = name;
            dtRow[2] = age;
            dtRow[3] = dob;
            rs.Rows.Add(dtRow);
        }
    }

Working Demo of DataTable

Telerik RadSchedular Tips and Tricks

Author posted by Jitendra on Posted on under category Categories ASP.NET and tagged as Tags with Leave a comment on Telerik RadSchedular Tips and Tricks

Change the style of the Today Cell in Month View and Bind Extra Column / Add Argument in RadSchedular

Change the style of the Today Cell in Month View

Lots of time, we are in need in telerik control that todays date should be highlighted. There is no need in case of Day View and in Week View.  But in month view, most of the times we confused between any event and todays date. So below is few CSS hacks which can be used in Telerik Controls.

div.RadScheduler_#skinName# .rsMonthView
.rsTodayCell
{
background-color: #CCFF00;
color: #000;
border: 1px solid #000;
}

Example:

div.RadScheduler_Office2007 .rsMonthView .rsTodayCell
{
background-color: #FFEFB8;
color: #000;
border: 2px solid #EE9311;
}

Bind Extra Column / Add Argument in RadSchedular

Add Custom Column as follow on page load event

RadSchedulerEvent.CustomAttributeNames = new string[] { "OwnerId" };

Note: OwnerId column name must be available in DataTable

Get Value of custom Column on AppointmentCreated Event

String ownerId = e.Appointment.Attributes["OwnerId"];

Opening RadWindow from another RadWindow – Telerik Control

Author posted by Jitendra on Posted on under category Categories ASP.NET and tagged as Tags with Leave a comment on Opening RadWindow from another RadWindow – Telerik Control

Opening RadWindow from another RadWindow:

Telerik Control in ASP.NET
Telerik Control in ASP.NET

Sometime it may require opening the radwindow from another radwindow. But believe me; it will not be easy.Problems I faced were:

  • New window opened behind the parent radwindow.
  • New window open in area of parent window only. So we cannot resize the window as per required.
    To overcome all these properties:

Create a java script function which will open the RadWindow in parent page. We will call this function from Radwindow to open new Radwindow so that new window should have complete screen as a width and height.

function OpenParentWnd()
{
var oWnd = $find("<%=Parent.ClientID %>");//Parent is radwindow ID name
oWnd.show();
}

In current RadWindow, call the above function like this:

function CreateWindowInParent()
{
//One way to open a window from parent page
var oBrowserWnd = GetRadWindow().BrowserWindow;
oBrowserWnd.OpenParentWnd();
}