textbox in gridview control using javascript

Question

0.00/5 (No votes)

See more:

Hi,

I am inserting a data in gridview row. I have 2 textbox's, 1 label and 1 textbox respectively. Here, I want to do calculations on data which is in first two textboxes and result should be displayed in label and the text in label to be multiplied with 40 and that should be displayed in last textbox.

This operation to be done in onblur() event of second textbox. To do this I need to find the controls in gridview in onblur() event of the textbox.

I tried to do this in .cs file but this operation is to be done before inserting in to database on that particular row of gridview.

I searched on the net but i couldn't find the solution. I couldn't know how to find textbox of a gridview using javascript

Please help me.....

Posted 26-Oct-10 21:16pm

sri4dotnet

Add a Solution

Comments

Sunasara Imdadhusen 27-Oct-10 3:20am

I will help, please send snippet of your code

3 solutions

Solution 3

<big>Client side code</big>

XML

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title>Untitled Page</title>
    <script type="text/javascript">
    function DoCalculation(Txt1,Txt2,Txt3,Lbl1)
    {
      Txt1=document.getElementById(Txt1);
      Txt2=document.getElementById(Txt2);
      Txt3=document.getElementById(Txt3);
      Lbl1=document.getElementById(Lbl1);
      Lbl1.innerHTML=parseFloat(Txt1.value)+parseFloat(Txt2.value);
      Txt3.value=parseFloat(Lbl1.innerHTML)/40;
    }
    </script>
</head>
<body>
    <form id="form1" runat="server">
        <div>
            <asp:GridView ID="GridView1" runat="server" AutoGenerateColumns="False" OnRowCommand="GridView1_RowCommand" OnRowDataBound="GridView1_RowDataBound">
                <Columns>
                    <asp:TemplateField>
                        <ItemTemplate>
                            <asp:TextBox ID="TextBox1" runat="server" Text='<%# Eval("C1") %>'></asp:TextBox>
                        </ItemTemplate>
                    </asp:TemplateField>
                    <asp:TemplateField>
                        <ItemTemplate>
                            <asp:TextBox ID="TextBox2" runat="server" Text='<%# Eval("C2") %>'></asp:TextBox>
                        </ItemTemplate>
                    </asp:TemplateField>
                    <asp:TemplateField>
                        <ItemTemplate>
                            <asp:Label ID="Label1" runat="server" Text='<%# Eval("C3") %>'></asp:Label>
                        </ItemTemplate>
                    </asp:TemplateField>
                    <asp:TemplateField>
                        <ItemTemplate>
                            <asp:TextBox ID="TextBox3" runat="server" Text='<%# Eval("C4") %>'></asp:TextBox>
                        </ItemTemplate>
                    </asp:TemplateField>
                    <asp:ButtonField CommandName="Update" Text="Update" />
                </Columns>
            </asp:GridView>
        </div>
    </form>
</body>
</html>

<big>Server Side Code</big>

protected void Page_Load(object sender, EventArgs e)
    {
        if (!IsPostBack)
            DoBindDB();
    }

    public void DoBindDB()
    {
        DataSet _Ds = new DataSet();
        _Ds.Tables.Add();
        _Ds.Tables[0].Columns.Add("C1");
        _Ds.Tables[0].Columns.Add("C2");
        _Ds.Tables[0].Columns.Add("C3");
        _Ds.Tables[0].Columns.Add("C4");

        for (int i = 0; i < 10; i++)
        {
            DataRow Dr = _Ds.Tables[0].NewRow();
            Dr["C1"] = 0;
            Dr["C2"] = 0;
            Dr["C3"] = 0;
            Dr["C4"] = 0;
            _Ds.Tables[0].Rows.Add(Dr);
        }

        GridView1.DataSource = _Ds;
        GridView1.DataBind();
    }
    protected void GridView1_RowCommand(object sender, GridViewCommandEventArgs e)
    {
        //if (e.CommandName = "Update")
        //{
        //}
    }
    protected void GridView1_RowDataBound(object sender, GridViewRowEventArgs e)
    {
        if (e.Row.RowType == DataControlRowType.DataRow)
        {
            TextBox Txt1 = (TextBox)e.Row.Cells[0].Controls[1];
            TextBox Txt2 = (TextBox)e.Row.Cells[1].Controls[1];
            Label Lbl1 = (Label)e.Row.Cells[2].Controls[1];
            TextBox Txt3 = (TextBox)e.Row.Cells[3].Controls[1];
            Txt1.Attributes["onkeyup"] = "DoCalculation('" + Txt1.ClientID + "','" + Txt2.ClientID + "','" + Txt3.ClientID + "','" + Lbl1.ClientID + "');";
            Txt2.Attributes["onkeyup"] = "DoCalculation('" + Txt1.ClientID + "','" + Txt2.ClientID + "','" + Txt3.ClientID + "','" + Lbl1.ClientID + "');";
        }
    }

Posted 27-Oct-10 22:52pm

Vindhyachal_Kumar

Comments

roygan 3-Jun-13 5:09am

this is a great solution

Rupali rajput 2-Sep-13 1:43am

Really, Great solution..

Solution 1

if you're looking to access the fields using client-side script, which I think is the case, you can view the source of the webpage in the browser. look for the textboxes in the source and find the id attribute of each textbox. you can then reference the textbox in client-side script using the value contained in the id attribute:

var textbox = document.getElementById("ID OF TEXTBOX GOES HERE");

//other code..

while this is perfectly valid and will work in just about any browser, I'd always favour using a javascript framework such as jquery when I'm looking to interact with the HTML of a web page. provided you have jquery referenced in the page you would then write something like this:

var textbox = $("#ID OF TEXTBOX GOES HERE");

//other code..

Bear in mind that with jquery, prefixing the id with a "#" is crucial, or it won't find that element by it's id.

Posted 26-Oct-10 22:03pm

jim lahey

Add a Solution

Add your solution here

Treat my content as plain text, not as HTML

Preview 0

…

Existing Members

Sign in to your account

...or Join us

Download, Vote, Comment, Publish.

Your Email
Password
Forgot your password?

Your Email
This email is in use. Do you need your password?
Optional Password

I have read and agree to the Terms of Service and Privacy Policy
Please subscribe me to the CodeProject newsletters

When answering a question please:

Read the question carefully.
Understand that English isn't everyone's first language so be lenient of bad spelling and grammar.
If a question is poorly phrased then either ask for clarification, ignore it, or edit the question and fix the problem. Insults are not welcome.
Don't tell someone to read the manual. Chances are they have and don't get it. Provide an answer or move on to the next question.

Let's work to help developers, not make them feel stupid.

This content, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)

ShashankSinghThakur · Accepted Answer · 2010-10-26T22:23:00

Solution 2

you can get solution here

http://forums.asp.net/t/1194696.aspx[^]

Posted 26-Oct-10 22:23pm

ShashankSinghThakur