• Status: Solved
  • Priority: Medium
  • Security: Public
  • Views: 521
  • Last Modified:

DataGrid on the web is a blur

I like this grid, but some of the hoops you must jump through to make it do the slightly more complex and the support documentation, seems spotty at best.

It would be nice if when the datagrid has a row put into edit mode, if the cursor would appear in a column of that row.  Since the datagrid,  behind the scene is using textboxes for each column, do I set focus on the cell or the textbox or are they the same or what?
0
Howard Bash
Asked:
Howard Bash
  • 5
  • 3
  • 2
1 Solution
 
SicosCommented:
You can make some custom code to set the focus on the textbox you want.

You need to set the focus on the textbox.

Make a javascript client sided that set the focus..

function SetFocus(component)
{
  component.setfocus
}
0
 
Howard BashSenior Software EngineerAuthor Commented:
When and where would you do this?  The app is a mix of C#, ASP.NET, and JavaScript?  The DataGrid1_EditCommand,  the DataGrid1_ItemCommand know about the row being switched to edit mode.
0
 
Howard BashSenior Software EngineerAuthor Commented:
In C# file, I have tried

In the DataGrid1_EditCommand I added the following :

Response.Write ("<script>javascript:SetFocus(" + DataGrid1.Items[m_RowSelected].Cells[2].ClientID + ")</script>");
to get to the second "textbox" of the data grid row being edited, but this fails also.

with the error:

"
Microsoft JScript runtime error: 'DataGrid1__ctl5__ctl11' is undefined
"

Where SetFocus is a javascript func that calls the passed in control's SetFocus method.

I'd love a clue here folks.

thanks.


0
Concerto Cloud for Software Providers & ISVs

Can Concerto Cloud Services help you focus on evolving your application offerings, while delivering the best cloud experience to your customers? From DevOps to revenue models and customer support, the answer is yes!

Learn how Concerto can help you.

 
SicosCommented:
Do it in the onload event of the page..
0
 
SicosCommented:
I think the best way is to make a template column for the column you want to edit.
This way you can put in an edit box and give it the name you want. The most likely
reason why your code doesn't work is because only the name of the edit box has been
set and not the ID. With the default column you can add your own id to a textbox.


Greetings,
Sicos
0
 
Howard BashSenior Software EngineerAuthor Commented:
Still the problem is about the focus:

Since you make an ItemTemple and and EditItemTemplate,  to set focus to the cell when the grid is placed in edit mode,  can I set focus to a cell ala e.Item.FindControl("EditID").setfocus or some variation on that using something like

Response.write ("<script>javascript:SetFocus(" + e.Item.FindControl("EditID") + ")</script>")

Where SetFocus is a javascript Function

function SetFocus(kontrol)
{
  kontrol.focus();
}

Lots of roads to Rome it appears.

I appreciate and thoughts on this.

Thanks,
Howard
0
 
CS_LewisCommented:
Try this inside the DataGrid1_EditCommand event

string script = "<script language='javascript'> document.getElementById('" + e.Item.FindControl("EditID").ClientID + "').focus(); </script>";

this.RegisterStartupScript("setFocus", script);
0
 
Howard BashSenior Software EngineerAuthor Commented:

I get the following error:

It errors on the line (below) with string declare and assignment about not finding the control and so no object for .ClientID


Here is the template for the cell i want to have focus when we go into edit mode on a row:
<asp:TemplateColumn HeaderText="CreateDate">
      <ItemTemplate>
            <asp:Label runat="server" ID="CreateDateLabelID" Text='<%# DataBinder.Eval(Container, "DataItem.CreateDate") %>'>
            </asp:Label>
      </ItemTemplate>
      <EditItemTemplate>
            <asp:TextBox runat="server" ID="CreateDateTextBoxID" Text='<%# DataBinder.Eval(Container, "DataItem.CreateDate") %>'>
            </asp:TextBox>
      </EditItemTemplate>
</asp:TemplateColumn>

In my DataGrid1_EditCommand my code is :
      string script = "<script language='javascript'> document.getElementById('" + e.Item.FindControl("CreateDateTextBoxID").ClientID + "').focus(); </script>";

      this.RegisterStartupScript("setFocus", script);


0
 
CS_LewisCommented:
Okay, I think I see what's going on.  The Date Text Box does not get created until the page is reloaded.

Try putting this code in the ItemDataBound function.

If e.Item.ItemType == ListItemType.EditItem
{
     string script = "<script language='javascript'> document.getElementById('" + e.Item.FindControl("CreateDateTextBoxID").ClientID + "').focus(); </script>";
     this.RegisterStartupScript("setFocus", script);
}

I think at this point the TextBox should exist, and you will be able to get a handle on the ClientID.
0
 
Howard BashSenior Software EngineerAuthor Commented:
I'll try this as soon as I can break in the routine.  For some reason the grid event properties don't show the routines that are for those events and the datagrid seems bound, although i don't see an sql connection, ds, etc, in development mode in the IDE.  I think this is a bug and that some information in the IDE is not being correctly maintained about the project itself.

By the way,  I added the handler back by selecting it in the event properties dropdown for that event.  And it still did not break there.



0

Featured Post

Independent Software Vendors: We Want Your Opinion

We value your feedback.

Take our survey and automatically be enter to win anyone of the following:
Yeti Cooler, Amazon eGift Card, and Movie eGift Card!

  • 5
  • 3
  • 2
Tackle projects and never again get stuck behind a technical roadblock.
Join Now