Client-side coding

  • Thread starter Thread starter Sue
  • Start date Start date
S

Sue

ASP.NET web application, data grid with several fields (Labels), table
below the datagrid with several textboxes and dropdown lookup tables. When
a user clicks on the "Select" button in datagrid, server side code grabs
values from the selected datagrid's cells and sets the
textboxes/dropdownlists below to the corresponding datagrid values. Works
fine except for being dirt slow, Since all the data needed is already at
the client, is there a way to code the grab and paste routine using
client-side code and avoid a roundtrip to the server? The users are at
remote sites with a less than speedy connection.

tia,
Sue
 
Hi Sue,

I'm not a client-side expert, but I think I've come up with a solution for
you. I added a column with a button that does not post back to the server.
Instead, it updates some fields outside of the datagrid. This is close to
what you said you wanted. One thing I skipped is that I put my client code
directly into the HTML when I should have used RegisterClientScriptBlock.
Here is my code which is based on the Pubs sample database.

This method will fail if the data contains single or double quote marks.

First the HTML
Notice that I added an HTML button with id=b1 and runat=server.

<HTML>
<HEAD>
<title>ClientSelect</title>
<meta name="GENERATOR" content="Microsoft Visual Studio .NET 7.1">
<meta name="CODE_LANGUAGE" content="Visual Basic .NET 7.1">
<meta name="vs_defaultClientScript" content="JavaScript">
<meta name="vs_targetSchema"
content="http://schemas.microsoft.com/intellisense/ie5">
<script language="javascript">
<!--
function SetValues(id, fname, lname) {
document.all("TextBox1").value = id;
document.all("TextBox2").value = fname;
document.all("TextBox3").value = lname;
}
//-->
</script>
</HEAD>
<body>
<form id="Form1" method="post" runat="server">
<asp:TextBox id="TextBox1" runat="server"></asp:TextBox>
<asp:TextBox id="TextBox2" runat="server"></asp:TextBox>
<asp:TextBox id="TextBox3" runat="server"></asp:TextBox><BR>
<BR>
<asp:DataGrid id="DataGrid1" runat="server">
<Columns>
<asp:TemplateColumn>
<ItemTemplate>
<INPUT id="b1" runat="server" type="button"
value="Button">
</ItemTemplate>
</asp:TemplateColumn>
</Columns>
</asp:DataGrid>
</form>
</body>
</HTML>


Next the Code-Behind

Private Sub Page_Load(ByVal sender As System.Object, ByVal e As
System.EventArgs) Handles MyBase.Load
If Not IsPostBack Then
Bind()
End If
End Sub

Private Sub Bind()
Dim Qry1 As System.Data.SqlClient.SqlDataReader
Dim connectionString As String = "server='localhost';
trusted_connection=true; Database='pubs'"
Dim sqlConnection As System.Data.SqlClient.SqlConnection = New
System.Data.SqlClient.SqlConnection(connectionString)
Dim queryString As String = "SELECT au_id, au_lname, au_fname FROM
authors"
Dim sqlCommand As System.Data.SqlClient.SqlCommand = New
System.Data.SqlClient.SqlCommand(queryString, sqlConnection)
sqlConnection.Open()
Qry1 =
sqlCommand.ExecuteReader(System.Data.CommandBehavior.CloseConnection)
DataGrid1.DataSource = Qry1
DataGrid1.DataBind()
Qry1.Close()
sqlCommand.Dispose()
sqlConnection.Close()
sqlConnection.Dispose()
End Sub

Private Sub DataGrid1_ItemDataBound(ByVal sender As Object, ByVal e As
System.Web.UI.WebControls.DataGridItemEventArgs) Handles
DataGrid1.ItemDataBound
If e.Item.ItemType = ListItemType.Item Or e.Item.ItemType =
ListItemType.AlternatingItem Then
Dim b As HtmlControls.HtmlInputButton
b = CType(e.Item.Cells(0).Controls(1), HtmlControls.HtmlInputButton)
b.Attributes.Add("onclick", "SetValues('" &
e.Item.DataItem("au_id") & "','" & e.Item.DataItem("au_fname") & "','" &
e.Item.DataItem("au_lname") & "');")
End If
End Sub


Does this answer your question?

Thank you, Mike
Microsoft, ASP.NET Support Professional

Microsoft highly recommends to all of our customers that they visit the
http://www.microsoft.com/protect site and perform the three straightforward
steps listed to improve your computer's security.

This posting is provided "AS IS", with no warranties, and confers no rights.


--------------------
 
Perfect - the attributes.add("onclick", "SetValues....." was new to me -
the missing link as it were. All makes sense now. Thanks!

Sue
 
Dim b As HtmlControls.HtmlInputButton
b = CType(e.Item.Cells(0).Controls(1),
Click to expand...
HtmlControls.HtmlInputButton)

Mike, I'm working through this code (it does exactly what
I need done byw!) and am getting right royally stuck here.
When I try the second 'b = Ctype...." line, I get stuck
with a "Specified argument was out of the range of valid
values. Parameter name: index" message. I've tried various
ways to pin the problem down, but haven't made much
progress. The first column (0) should have it an
HTMLControls.HTMLButton in it, which it does. So why can't
it be seen? grabbed?

frustrated!
Sue
 
Hi Sue,

Since you said that it works, I'm assuming that the sample I wrote is
working, but your own project is not. The question is what is different?

Here are some things I can think of:

* on your form, the button is controls(0) instead of (1)
* you are adding the button via code rather than in the HTML
* The button lacks an ID or runat="server"

I hope this helps.

Thank you, Mike
Microsoft, ASP.NET Support Professional

Microsoft highly recommends to all of our customers that they visit the
http://www.microsoft.com/protect site and perform the three straightforward
steps listed to improve your computer’s security.

This posting is provided "AS IS", with no warranties, and confers no rights.


--------------------
 
Back
Top