Posts

Showing posts from April, 2014

Search data in Gridview on Textbox Key press event using JQuery in Asp.Net- C#

Image
First of all add the following .js file, Link and the JavaScript to your <Head> tag ::

<head runat="server">
    <title></title>   
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
<script type="text/javascript" src="js/quicksearch.js"></script>
<script type="text/javascript">
    $(function () {
        $('.search_textbox').each(function (i) {
            $(this).quicksearch("[id*=gvDetails] tr:not(:has(th))", {
                'testQuery': function (query, txt, row) {
                    return $(row).children(":eq(" + i + ")").text().toLowerCase().indexOf(query[0].toLowerCase()) != -1;
                }
            });
        });
    });
</script>
</head>

// This Script dynamically searches the GridView cells and filters out the unwanted rows and di…

Selecting GridView Row by clicking anywhere on the Row in Asp.Net - C#

Image
In this blog I am going to how to show how to select GridView Row when mouse is clicked anywhere on the GridView Row in ASP.Net- C#

First of all add a page to your solution and add a gridview, a link button which will be used to render ASP.Net _doPostBack JavaScript as it requires for RowSelection. <head runat="server">
    <title></title>
<style type="text/css">
    body
    {
        font-family: Arial;
        font-size: 10pt;
    }
    td
    {
        cursor: pointer;
    }
    .hover_row
    {
        background-color: #A1DCF2;
    }
</style>
 <script type="text/javascript">
     $(function () {
         $("[id*=gvDetails] td").hover(function () {
             $("td", $(this).closest("tr")).addClass("hover_row");
         }, function () {
             $("td", $(this).closest("tr")).removeClass("hover_row");
         });
     });
</script>

Building Modal Popup using ASP.Net AJAX ModalPopupExtender Control

Image
In this blog I will explain with an example how to build a Modal Popup ASP.Net AJAX ModalPopupExtender control.

First of all register the AJAX Control Toolkit Library by putting the following line just below the @PageDirective ::

<%@ Register Assembly="AjaxControlToolkit" Namespace="AjaxControlToolkit" TagPrefix="asp" %>

Now add the following code inside the <body> tag ::

<form id="form1" runat="server">
    <asp:ScriptManager ID="ScriptManager1" runat="server">
    </asp:ScriptManager>
    <div>
        <asp:Button ID="BtnShow" runat="server" Text="Show Modal PopUp" BackColor="Yellow"
            BorderStyle="Groove" />
        <asp:ModalPopupExtender ID="ModalPopupExtender1" PopupControlID="Panel1" TargetControlID="BtnShow" CancelControlID="BtnClose" BackgroundCssClass="Back…

Bind image in gridview and Show image on Hover over specific column in GridView (Show image as ToolTip on Mouseover in GridView) in Asp.Net C#

Image
In this blog, I am going to show how to bind images in gridview and show this image on mouseover over any link/ image

        Here, i have have shown how a image can be used as a tooltip in gridview.

First of all, Write the below code in .aspx page and don't forgot to add "jquery.tooltip.min.js" and "jquery-1.8.2.js" to your solution. Just search it on google and you will get this .js file easily

<%@ Page Language="C#" AutoEventWireup="true" CodeFile="GridViewToolTipaspx.aspx.cs" Inherits="GridViewToolTipaspx" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title>
    <script src="http://code.jquery.com/jquery-1.8.2.js" type="text/javascript"></script>
<script…
go to top image