Buy Questpond's video subscriptions on huge discount.
DotNetFunda.com
Online: 2790
Home > Forums > ASP.NET >

How to fill TextBoxes with Gridview row data on GridView mouseover [Resolved]

Posted by Apysan under ASP.NET on 12/5/2013 | Points: 10 | Views : 32282 | Status : [Member] | Replies : 7
Write New Post | Search Forums | AnsweredResolved Posts | Un Answered Posts | Forums Home 
Hello Experts,

I DO NOT WAANT TO SELECT NOR DO I WANT TO CLICK - SIMPLE MOUSEOVER


I have been learning asp.net from last four month in the process i come across a problum and try to find a solution over the net but unable to find one, which exactly suit my requiremnt.

I have a GridView on My page in div1.

I have few TextBoxes in in div2.

I have used javascript to highlight the Gridview on mouseover.

Now what i want is whenever i mouseover a particular row its cell Data will be displayed

in the TextBoxes.

For example say I have colums like Name,city,State,pin etc

Whenever i mouseover the row it will be

TextBox1.Text=Name,
TextBox2.Text=city and so on.

It is a very simple requirement but perhaps i dont know the details.


Please,i dont want to click on the row, hence don't want to use Select Button or Link.

I WANT TO ACHEIVE THE ABOVE THOUGH MOUSEOVER EFFECT ONLY.


Please Help.


Thanks & Regards

LATER

Reply | Reply with Attachment
Alert Moderator 

Responses

Posted by: Allemahesh on: 12/10/2013 [Member] [MVP] Silver | Points: 50

Up
0
Down

Resolved
Dear LATER,

Have you try my above solution?
Also if this solve your problem, click on "Mark As Answer" link.

Apysan, if this helps please login to Mark As Answer. | Alert Moderator
Posted by: vishalneeraj-24503 on: 12/5/2013 [Member] [MVP] Platinum | Points: 25

Up
0
Down
Hi please refer below links:-

http://www.aspsnippets.com/Articles/Display-GridView-Row-details-on-Cell-MouseOver-using-jQuery-ToolTip-Plugin-in-ASPNet.aspx
http://forums.asp.net/t/1498437.aspx

Apysan, if this helps please login to Mark As Answer. | Alert Moderator
Posted by: vishalneeraj-24503 on: 12/5/2013 [Member] [MVP] Platinum | Points: 25

Up
0
Down
Also visit:-

http://www.aspforums.net/Threads/449944/Display-Row-data-of-ASPNet-GridView-on-MouseOver-using-JavaScript/

http://www.aspdotnet-suresh.com/2013/05/jquery-show-gridview-row-details-in.html

http://www.dotnetfox.com/articles/show-gridview-row-details-in-tooltip-on-mouseover-using-jquery-in-Asp-Net-1062.aspx

http://www.aspsnippets.comwww.aspsnippets.com/Purple/Articles/ASPNet-AJAX-ConfirmButtonExtender-with-ModalPopupExtender-Example.aspx

http://go4answers.webhost4life.com/Example/display-gridview-column-heading-139318.aspx

This will help you.

Apysan, if this helps please login to Mark As Answer. | Alert Moderator
Posted by: vishalneeraj-24503 on: 12/6/2013 [Member] [MVP] Platinum | Points: 25

Up
0
Down
Hi Apysan,
Did you find solution?

Apysan, if this helps please login to Mark As Answer. | Alert Moderator
Posted by: Apysan on: 12/6/2013 [Member] Starter | Points: 25

Up
0
Down
No, yet to find a solution.


LATER

Apysan, if this helps please login to Mark As Answer. | Alert Moderator
Posted by: Bandi on: 12/8/2013 [Member] [MVP] Platinum | Points: 25

Up
0
Down
Refer
http://www.codeproject.com/Questions/382739/how-to-fill-text-box-by-selecting-gridview-row
http://forums.asp.net/t/1672148.aspx?Fill+fields+with+selected+gridview+row+data+

Mark This Response as Answer
--
Chandu
http://www.dotnetfunda.com/images/dnfmvp.gif

Apysan, if this helps please login to Mark As Answer. | Alert Moderator
Posted by: Allemahesh on: 12/10/2013 [Member] [MVP] Silver | Points: 25

Up
0
Down
Dear LATER,

Below code will solve your requirement. I have developed for you. Just run the below code and you will your output.

Also if this solve your problem, click on "Mark As Answer" link.

.aspx Code:- 

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title>

    <script type="text/javascript" language="javascript">
        function displayID(val) {
            document.getElementById("<%= txtID.ClientID %>").value = val;
        }
        function displayName(val) {
            document.getElementById("<%= txtName.ClientID %>").value = val;
        }
        function displayAddress(val) {
            document.getElementById("<%= txtAddress.ClientID %>").value = val;
        }
        function displayContactNumber(val) {
            document.getElementById("<%= txtContactNumber.ClientID %>").value = val;
        }
    
    </script>

</head>
<body>
    <form id="form1" runat="server">
    <div>
        <asp:GridView ID="GridView1" runat="server" AutoGenerateColumns="false" OnRowDataBound="GridView1_RowDataBound">
            <Columns>
                <asp:TemplateField HeaderText="ID">
                    <ItemTemplate>
                        <%# Eval("ID")%>
                    </ItemTemplate>
                </asp:TemplateField>
                <asp:TemplateField HeaderText="Name">
                    <ItemTemplate>
                        <%# Eval("Name")%>
                    </ItemTemplate>
                </asp:TemplateField>
                <asp:TemplateField HeaderText="Address">
                    <ItemTemplate>
                        <%# Eval("Address")%>
                    </ItemTemplate>
                </asp:TemplateField>
                <asp:TemplateField HeaderText="ContactNumber">
                    <ItemTemplate>
                        <%# Eval("ContactNumber")%>
                    </ItemTemplate>
                </asp:TemplateField>
            </Columns>
        </asp:GridView>
    </div>
    <dir>
        ID :
        <asp:TextBox ID="txtID" runat="server"></asp:TextBox><br />
        Name :
        <asp:TextBox ID="txtName" runat="server"></asp:TextBox><br />
        Address :
        <asp:TextBox ID="txtAddress" runat="server"></asp:TextBox><br />
        Contact Number :
        <asp:TextBox ID="txtContactNumber" runat="server"></asp:TextBox>
    </dir>
    </form>
</body>
</html>


C# Code:- 

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

    public DataTable GetTable()
    {
        DataTable table = new DataTable();
        DataColumn dcColumn = new DataColumn("ID", typeof(int));
        table.Columns.Add(dcColumn);
        table.Columns.Add("Name", typeof(string));
        table.Columns.Add("Address", typeof(string));
        table.Columns.Add("ContactNumber", typeof(int));

        table.Rows.Add(1, "Name 1", "Address 1", 123);
        table.Rows.Add(2, "Name 2", "Address 2", 456);
        table.Rows.Add(3, "Name 3", "Address 3", 789);
        table.Rows.Add(4, "Name 4", "Address 4", 147);
        table.Rows.Add(5, "Name 5", "Address 5", 258);
        table.Rows.Add(6, "Name 6", "Address 6", 369);

        return table;
    }

    protected void GridView1_RowDataBound(object sender, GridViewRowEventArgs e)
    {
        if (e.Row.RowType == DataControlRowType.DataRow)
        {
            e.Row.Cells[0].Attributes.Add("onmouseover", "displayID('" + Convert.ToString(DataBinder.Eval(e.Row.DataItem, "ID")) + "');");
            e.Row.Cells[1].Attributes.Add("onmouseover", "displayName('" + Convert.ToString(DataBinder.Eval(e.Row.DataItem, "Name")) + "');");
            e.Row.Cells[2].Attributes.Add("onmouseover", "displayAddress('" + Convert.ToString(DataBinder.Eval(e.Row.DataItem, "Address")) + "');");
            e.Row.Cells[3].Attributes.Add("onmouseover", "displayContactNumber('" + Convert.ToString(DataBinder.Eval(e.Row.DataItem, "ContactNumber")) + "');");
        }
    }
}



If this helps you towards the solution, click on MARK IT AS ANSWER

Happy Coding.

Apysan, if this helps please login to Mark As Answer. | Alert Moderator

Login to post response

Latest Posts