populate all textboxes in Gridview via javascript

[PushCode]

I have textbox that displays a date in each row of my gridview. I'm hoping to put a link or button that, when clicked, automatically populates all textboxes except for the first one, with the value entered in the first one. So, I want the user to be able to enter a date in the textbox on the first row of the datagrid, then click and automatically populate the rest of the rows with the date they entered in the first row. Make sense? I'm not sure where to start with this.

 

[KDavie]

You could do something such as this...

1. In the OnRowDataBound event of the gridview add an attribute to each row named index and store the RowIndex value there.
2. Use that attribute in your js to determine what row not to update. Loop trough rows and update value.

You can post a thread in the js forum if you need help with the syntax.

Hope this helps.

 

[PushCode]

Thanks KDavie...In terms of the code behind, I'm trying something like this to add an 'index' attribute to each textbox, but it's not working:

protected void gvCheckout_RowCreated(Object sender, GridViewRowEventArgs e)
        {
            if (e.Row.RowType == DataControlRowType.DataRow);
             
            TextBox textbox = (TextBox)e.Row.FindControl("txtRequestDate");
            e.Row.Attributes.Add("Index", e.Row.RowIndex); 
        }

Errors are: The best overloaded method match for...has some invalid arguments.

and

Argument '2': cannot convert from 'int' to 'string'

Any ideas on the proper c# code to add this attribute to each textbox?

Thanks!

 

[jbenson001]

e.Row.RowIndex.[red]ToString[/red]

 

[PushCode]

Okay, using this:

protected void gvCheckout_RowCreated(Object sender, GridViewRowEventArgs e)
        {
            if (e.Row.RowType == DataControlRowType.DataRow);
             
            TextBox textbox = (TextBox)e.Row.FindControl("txtRequestDate");
            text.Row.Attributes.Add("Index", e.Row.RowIndex.ToString()); 
        }

It appears to be adding an index attribute to each table row tag, not each row's textbox tag. Can someone help me change this code so it adds the index attribute to the row's textbox? Thanks!

 

[jbenson001]

textbox.addtributs.add (.....

 

[PushCode]

Okay, I'm now successfully adding an index attribute to each textbox...thank you all for the help.

Now I need to complete the task of populating the textboxes with the user's entry in the first row's text box.

I'm calling a javascript function and passing in the gridview id and the id of the first row's textbox with this:

<asp:HyperLink ID="hlFill" NavigateUrl='<%# "javascript:fillAll(&#39;gvCheckout&#39;, &#39;" +((GridViewRow)Container).FindControl("txtRequestDate").ClientID + "&#39;)"%>' Text="Copy to All" Visible="false" runat="server" />[\code]

And here's my javascript.  i'm trying to loop through the rows of the gridview (theGrid), and where their index is not zero, populate them with the value from textbox in the first row.[code]<script>
function fillAll(theGrid, frstTxtBox)
    {
        var tbl = document.getElementById(theGrid);
        
        for(var i = 1; i< tbl.rows.length;i++)
        {
            if (document.getElementById('index').value != 0 )
            var inptfld = document.getElementByName('<%= txtRequestDate.ClientID %>')
            {
                inptfld.value = document.getElementById(frstTxtBox).value;
            }
        }
    } 
</script>

I'm getting an error that txtRequestDate does not exist in the current context.

Can anyone help me here? Thanks!

 

[PushCode]

I was finally able to figure this out. Here's the working code for the future reference of all.

The JS:

function fillAll(frstTxtBox)
    {
        // get the value of the first date input field
        var frstBoxVal = document.getElementById(frstTxtBox).value;
        // get all of the input elements
        var inputElements = document.getElementsByTagName("input");
        
        for (i = 0; i < inputElements.length; i++) 
        {
            // if it's a text box and has an 'index' attribute witht a value greater than zero...
            if (inputElements[i].type == "text" && inputElements[i].index > 0) 
            {
                inputElements[i].value = frstBoxVal;
            }
        }
    }

The ASP.NET:

<asp:TextBox ID="txtRequestDate" Text='' Width="75" runat="server"></asp:TextBox>
<asp:HyperLink ID="hlFill" NavigateUrl='<%# "javascript:fillAll(&#39;" +((GridViewRow)Container).FindControl("txtRequestDate").ClientID + "&#39;)"%>' Text="Copy to All" Visible="false" runat="server" />

The C# code-behind:

protected void gvCheckout_RowCreated(Object sender, GridViewRowEventArgs e)
        {

            if (e.Row.RowType == DataControlRowType.DataRow)
            {
                for (int i = 1; i < e.Row.Cells.Count - 1; i++)
                {
                    ((TextBox)e.Row.FindControl("txtRequestDate")).Attributes.Add("index", e.Row.RowIndex.ToString());
                    if (e.Row.RowIndex == 0)
                    {
                        e.Row.FindControl("hlFill").Visible = true;
                    }
                }
                
            }
            
        }

 

[jbenson001]

Glad you got it working, but keep in mind, by the looks of your js, that you will fill in any textbox on the page, not just the grid. So, if later you add any textboxes to the page, they will get filled with the value as well.

 

[PushCode]

Actually, there are other textboxes on the page both within the datagrid and outside of it. But only the txtRequestDate fields get filled in. I believe this is b/c of this line of code in the JS:
&& inputElements.index > 0

I'm no JS expert, but my hope was that this line would look for only those textboxes with the 'index' attribute that I added. Then fill in all but the first one.

 

[jbenson001]

Ahh ok, sorry, I guess I thought it was something else. Yes that attribute will do what you think, thanks to Jason's suggestion.

 

[jbenson001]

Actually thanks to KDavie's suggestion.

 

[PushCode]

Thanks to both KDavie and jbenson001 for the help!