Since these DataWindow objects have a master-detail relationship, you want the details for the row that is selected in dwCustList to display in dwCustomer.
To do that, first you code a client-side Clicked event in the form’s .aspx file and store the selected row number in a hidden HTML input field, then submit the form. For more information about client events, see Chapter 12, “Writing Scripts for the Web DataWindow Client Control.”
To code a client-side clicked event:
Open the Default.aspx Design page and drag an Input (Hidden) control from the HTML tab in the Toolbox onto the page.
This adds an INPUT tag to the page that will not display in the Browser.
In the Properties window for the Hidden control,
type rownum in the id and name
fields.
Right-click on dwCustList, select Properties, and make sure that both ClientEvents and ClientScriptable are set to true.
In the Properties window, click in the ClientEventClicked field and select Add New Event Handler from the drop-down list.
This generates a JavaScript function in the page’s .aspx file:
function objdwCustList_Clicked(sender, rowNumber, objectName) {
}
Now add code to the objdwCustList_Clicked function. The following code sets the value of the rownum INPUT tag to the number of the clicked row and submits the form:
document.Form1.rownum.value = rowNumber; document.Form1.submit();
The second DataWindow object, d_customer, has a WHERE clause that you set up in the SQL painter (see “Specify a WHERE clause”):
WHERE "customer"."id" = :cust_id
The id is the value assigned to the rownum hidden INPUT tag. The value is passed to the page in the Request property and then used as the argument in the SetRow method on the master DataWindow.
The Retrieve method can take a list of retrieval arguments as a parameter. In this case, you use the GetItemDouble method to return the value of the customer id column in dwCustList that has focus. That value is then passed to the Retrieve method for dwCustomer to be used within the WHERE clause.
The code is added to an Else clause in the page’s Load event handler.
To retrieve data into the detail DataWindow:
Open the code file for Default.aspx and locate the last line in the Load event handler.
Add code before the End If statement
in Visual Basic or before the closing brace of the event handler
in C#. The following code examples show the complete code
for the Load event handler with the new code in italics:
[Visual Basic]
If Not Me.IsPostBack Then
Try
InitializeComponent()
myTrans.Connect()
dwCustList.SetTransaction(myTrans)
dwCustList.Retrieve()
Catch Ex As Exception
errMsg.Text = ex.ToString()
errMsg.Visible = true
dwCustomer.Visible = false
End Try
’ Add the following code
Else
Dim selectedRow As Int32
selectedRow = _
System.Int32.Parse(Request.Params("rownum"))
dwCustList.SetRow(selectedRow)
Try
InitializeComponent()
myTrans.Connect()
dwCustomer.SetTransaction(myTrans)
dwCustomer.Retrieve(System.Convert.ToInt32 _
(dwCustList.GetItemDouble(selectedRow, _
"id")))
errMsg.Visible = False
dwCustomer.Visible = True
Catch ex As Exception
errMsg.Text = ex.ToString()
errMsg.Visible = True
dwCustomer.Visible = False
End Try
’End of new code
End If
[C#]
if (!this.IsPostBack)
{
try
{
InitializeComponent();
myTrans.Connect();
dwCustList.SetTransaction(myTrans);
dwCustList.Retrieve();
}
catch(System.Exception ex)
{
errMsg.Text = ex.ToString();
errMsg.Visible = true;
dwCustomer.Visible = false;
}
}
// Add the following code
else
{
Int32 selectedRow = System.Int32.Parse
(this.Request.Params["rownum"]);
dwCustList.SetRow(selectedRow);
try
{
InitializeComponent();
myTrans.Connect();
dwCustomer.SetTransaction(myTrans);
dwCustomer.Retrieve(System.Convert.ToInt32
(dwCustomers.GetItemDouble(selectedRow,
"id")));
}
catch(System.Exception ex)
{
errMsg.Text = ex.ToString();
errMsg.Visible = true;
dwCustomer.Visible = false;
}
}
// End of new code
Now you can test whether selecting a different row in the master DataWindow changes the detail DataWindow.
To test the interaction between the master and
detail DataWindows:
Select Debug>Start Debugging to run the program, and click a row in the master DataWindow.
The detail DataWindow displays the data for the selected row.
Select a different row in the master DataWindow.
The detail DataWindow displays the data for the new row.
Close the browser.
You have now completed the exercises in this brief tutorial.
For more complete sample applications in Visual Basic and C#, see the Sybase CodeXchange Web site and the Code Examples subdirectory in your DataWindow .NET 2.0 directory. For more information about programming with the Web DataWindow, see Chapter 9, “Using Web DataWindows.” For more information about deploying Web DataWindows, see “Deployment techniques for Web applications”.
