Select Row in one Grid, Get details in Another Grid

[Brett]

Hi All,
I have two grids.  In grid 1, I am returing results based on a search string.

In grid 2 I am binding the details based on the "SelectedValue" in Grid 1.  However I would like to change it up, as this does not work well when more teh 1 result is retunred to grid 1 based on Search String. 

Here is what I would like to happen:
Search Table, rows get returned to Grid1.
If only one row is return, thenselect it automatically and bind table 2 to the details.

If more then one row gets returned to grid1, then select nothing.
Allow Client Row Select
Once Row is selected, rebind grid1 to only show that row and not any of the other original returned results, and rebind grid 2 with details of the now selected row in gird 1.

If this could all happen in pretty AJAX, that would also be great!


I have added my current code for evaluation:

	<%@ Page Title="" Language="VB" MasterPageFile="~/MasterPage.master" AutoEventWireup="false"
	CodeFile="Copy of byAddress.aspx.vb" Inherits="test" %>
	<%@ Register Assembly="Telerik.Web.UI" Namespace="Telerik.Web.UI" TagPrefix="telerik" %>
	<%@ Register Assembly="AjaxControlToolkit" Namespace="AjaxControlToolkit" TagPrefix="ajaxtoolkit" %>
	<asp:Content ID="Content1" ContentPlaceHolderID="head" runat="Server">
	</asp:Content>
	<asp:Content ID="Content2" ContentPlaceHolderID="ContentPlaceHolder1" runat="Server">
	<div id="searchblock">
	<ajaxtoolkit:TextBoxWatermarkExtender ID="tbwm" runat="server"
	TargetControlID="txtSearch" WatermarkText="99 Washington"
	WatermarkCssClass="txtWatermark">
	</ajaxtoolkit:TextBoxWatermarkExtender>
	<asp:TextBox ID="txtSearch" runat="server"></asp:TextBox>
	<asp:Button ID="btnSearch" runat="server" Text="Search"/>
	<telerik:RadToolTip ID="RadToolTip1" runat="server" Animation="Fade"
	AutoCloseDelay="5000" ShowDelay="100" Skin="Hay" TargetControlID="txtSearch"
	Text="Please enter a street name without suffixes. (ex. Rd, Ave, St, Cr, Crs, Ln, etc.)"
	VisibleOnPageLoad="True">
	</telerik:RadToolTip>
	</div>
	<div class="tablehdr">
	<h3>
	Municipal Property Details</h3>
	<p>
	<asp:Label ID="lblError" runat="server" ForeColor="#FF3300"></asp:Label>
	</p>
	</div>
	<telerik:RadCodeBlock ID="RadCodeBlock1" runat="server" >
	<script type="text/javascript">
	<!--
	function log(message)
	{
	var log = document.getElementById("log");
	log.innerHTML += message + "<br/>";
	}
	function GridCreated(sender, eventArgs)
	{
	var grid = $find("<%=RadGrid1.ClientID %>");
	//you can also use the sender argument keyword to reference the client grid object
	log("ClientID of server-side grid object is: " + grid.get_element().id);
	}
	function RowClick(sender, eventArgs)
	{
	var text = "";
	text += "Row was clicked";
	text += ", Index: " + eventArgs.get_itemIndexHierarchical();
	document.getElementById("OutPut").innerHTML = text;
	RadGrid2.Rebind();
	}
	function RowDblClick(sender, eventArgs)
	{
	var text = "";
	text += "Row was double clicked";
	text += ", Index: " + eventArgs.get_itemIndexHierarchical();
	document.getElementById("OutPut").innerHTML = text;
	}
	function RowSelected(sender, eventArgs)
	{
	var text = "";
	text += "Row with index: " + eventArgs.get_itemIndexHierarchical() + " was selected";
	document.getElementById("OutPut").innerHTML = text;
	}
	function RowDeselected(sender, eventArgs)
	{
	var text = "";
	text += "Row with index: " + eventArgs.get_itemIndexHierarchical() + " was deselected";
	document.getElementById("OutPut").innerHTML = text;
	}
	-->
	</script>
	</telerik:RadCodeBlock>
	<telerik:RadScriptBlock ID="RadScriptBlock1" runat="server" >
	</telerik:RadScriptBlock>
	<telerik:RadGrid ID="RadGrid1" runat="server" DataSourceID="dsGrid" Skin="Telerik"
	GridLines="None">
	<MasterTableView AutoGenerateColumns="False" DataSourceID="dsGrid" DataKeyNames="ROLL_NO">
	<RowIndicatorColumn>
	<HeaderStyle Width="20px"></HeaderStyle>
	</RowIndicatorColumn>
	<ExpandCollapseColumn>
	<HeaderStyle Width="20px"></HeaderStyle>
	</ExpandCollapseColumn>
	<Columns>
	<telerik:GridBoundColumn DataField="ROLL_NO" HeaderText="Roll Number" SortExpression="ROLL_NO"
	UniqueName="ROLL_NO">
	</telerik:GridBoundColumn>
	<telerik:GridBoundColumn DataField="Address" HeaderText="Address" SortExpression="Address"
	UniqueName="Address" ReadOnly="True">
	</telerik:GridBoundColumn>
	<telerik:GridTemplateColumn HeaderText="Legal Description" UniqueName="TemplateColumn">
	<ItemTemplate>
	<asp:Label ID="Label58" runat="server" Text='<%# DataBinder.Eval(Container, "DataItem.LEGAL1") %>'>
	</asp:Label><br />
	<asp:Label ID="Label1" runat="server" Text='<%# DataBinder.Eval(Container, "DataItem.LEGAL2") %>'>
	</asp:Label><br />
	<asp:Label ID="Label2" runat="server" Text='<%# DataBinder.Eval(Container, "DataItem.LEGAL3") %>'>
	</asp:Label><br />
	<asp:Label ID="Label3" runat="server" Text='<%# DataBinder.Eval(Container, "DataItem.LEGAL4") %>'>
	</asp:Label><br />
	<asp:Label ID="Label4" runat="server" Text='<%# DataBinder.Eval(Container, "DataItem.LEGAL5") %>'>
	</asp:Label>
	</ItemTemplate>
	</telerik:GridTemplateColumn>
	<telerik:GridBoundColumn DataField="CLASS" HeaderText="Class" SortExpression="CLASS"
	UniqueName="CLASS">
	</telerik:GridBoundColumn>
	<telerik:GridBoundColumn DataField="ASSESSMENT" DataType="System.Decimal" HeaderText="Assesed Value"
	SortExpression="ASSESSMENT" UniqueName="ASSESSMENT" DataFormatString="{0:c}">
	</telerik:GridBoundColumn>
	<telerik:GridHyperLinkColumn HeaderText="More Details" NavigateUrl="details.aspx?txtSearch={0}"
	Text="View Details" UniqueName="column">
	<HeaderStyle HorizontalAlign="Center" />
	<ItemStyle HorizontalAlign="Center" />
	</telerik:GridHyperLinkColumn>
	</Columns>
	</MasterTableView>
	<ClientSettings>
	<Selecting AllowRowSelect="True" />
	</ClientSettings>
	<FilterMenu EnableTheming="True">
	<CollapseAnimation Type="OutQuint" Duration="200"></CollapseAnimation>
	</FilterMenu>
	</telerik:RadGrid>
	<asp:SqlDataSource ID="dsGrid" runat="server" ConnectionString="<%$ ConnectionStrings:csProperty %>"
	SelectCommand="SELECT DISTINCT txroll.ROLL_NO, CAST(txroll.STREET_NO AS varchar) + ' ' + txroll.STREET_NAME AS Address, txroll.LEGAL1, txroll.LEGAL2, txroll.LEGAL3, txroll.LEGAL4, txroll.LEGAL5, TX_ROLL_ASSESS.CLASS, TX_ROLL_ASSESS.ASSESSMENT, TX_ROLL_ASSESS.ASS_YEAR
	FROM TX_ROLL txroll LEFT OUTER JOIN TX_ROLL_ASSESS ON txroll.ROLL_NO = TX_ROLL_ASSESS.ROLL_NO
	WHERE CAST(txroll.STREET_NO AS varchar) + ' ' + txroll.STREET_NAME LIKE '%' + @ADDRESS + '%'
	ORDER BY TX_ROLL_ASSESS.ASS_YEAR DESC">
	<SelectParameters>
	<asp:ControlParameter Name="address" ControlID="txtSearch" Type="String" />
	<%--<asp:QueryStringParameter Name="ROLL_NO" QueryStringField="txtSearch" Type="String" />--%>
	</SelectParameters>
	</asp:SqlDataSource>
	<br />
	<asp:Panel ID="pnlStructure" runat="server">
	<div class="tablehdr">
	<h3>
	Sturcture Details</h3>
	</div>
	<telerik:RadGrid ID="RadGrid2" runat="server" DataSourceID="dsStructure" GridLines="None"
	Skin="Telerik">
	<MasterTableView AutoGenerateColumns="False" DataSourceID="dsStructure" DataKeyNames="ROLL_NO">
	<RowIndicatorColumn>
	<HeaderStyle Width="20px" />
	</RowIndicatorColumn>
	<ExpandCollapseColumn>
	<HeaderStyle Width="20px" />
	</ExpandCollapseColumn>
	<Columns>
	<telerik:GridTemplateColumn UniqueName="TemplateColumn1" HeaderText="Construction">
	<ItemTemplate>
	CHAR OF CONST:<asp:Label ID="Label58" runat="server" Text='<%# DataBinder.Eval(Container, "DataItem.CHAR_OF_CONST") %>'>
	</asp:Label><br />
	QUALITY:<asp:Label ID="Label1" runat="server" Text='<%# DataBinder.Eval(Container, "DataItem.QUALITY") %>'>
	</asp:Label><br />
	SHAPE:<asp:Label ID="Label2" runat="server" Text='<%# DataBinder.Eval(Container, "DataItem.SHAPE") %>'>
	</asp:Label><br />
	YEAR BUILT:<asp:Label ID="Label3" runat="server" Text='<%# DataBinder.Eval(Container, "DataItem.YEAR_BUILT") %>'>
	</asp:Label><br />
	YEAR BUILT CODE:<asp:Label ID="Label4" runat="server" Text='<%# DataBinder.Eval(Container, "DataItem.YEAR_BUILT_CODE") %>'>
	</asp:Label></ItemTemplate>
	</telerik:GridTemplateColumn>
	<telerik:GridTemplateColumn UniqueName="TemplateColumn2" HeaderText="Building">
	<ItemTemplate>
	CONDITION:<asp:Label ID="Label59" runat="server" Text='<%# DataBinder.Eval(Container, "DataItem.CONDITION") %>'>
	</asp:Label><br />
	FULL STORYS:<asp:Label ID="Label1" runat="server" Text='<%# DataBinder.Eval(Container, "DataItem.FULL_STOREYS") %>'>
	</asp:Label><br />
	PART STORYS:<asp:Label ID="Label2" runat="server" Text='<%# DataBinder.Eval(Container, "DataItem.PART_STOREYS") %>'>
	</asp:Label><br />
	HEIGHT EFF DATE:<asp:Label ID="Label3" runat="server" Text='<%# DataBinder.Eval(Container, "DataItem.HEIGHT_EFF_DATE_S") %>'>
	</asp:Label><br />
	SPLIT:<asp:Label ID="Label4" runat="server" Text='<%# DataBinder.Eval(Container, "DataItem.SPLIT") %>'>
	</asp:Label></ItemTemplate>
	</telerik:GridTemplateColumn>
	<telerik:GridTemplateColumn UniqueName="TemplateColumn3" HeaderText="Area">
	<ItemTemplate>
	GROSS AREA:<asp:Label ID="Label59" runat="server" Text='<%# DataBinder.Eval(Container, "DataItem.GROSS_AREA") %>'>
	</asp:Label><br />
	TOTAL BASEMENT:<asp:Label ID="Label1" runat="server" Text='<%# DataBinder.Eval(Container, "DataItem.TOTAL_BASEMENT") %>'>
	</asp:Label><br />
	FINISH BASEMENT:<asp:Label ID="Label2" runat="server" Text='<%# DataBinder.Eval(Container, "DataItem.FINISH_BASEMENT") %>'>
	</asp:Label><br />
	FINISH BASEMENT:<asp:Label ID="Label3" runat="server" Text='<%# DataBinder.Eval(Container, "DataItem.FINISH_BASEMENT_TY") %>'>
	</asp:Label><br />
	</asp:Label></ItemTemplate>
	</telerik:GridTemplateColumn>
	<telerik:GridTemplateColumn UniqueName="TemplateColumn4" HeaderText="Features">
	<ItemTemplate>
	FULL BATHS:<asp:Label ID="Label59" runat="server" Text='<%# DataBinder.Eval(Container, "DataItem.FULL_BATHS") %>'>
	</asp:Label><br />
	HALF BATHS:<asp:Label ID="Label1" runat="server" Text='<%# DataBinder.Eval(Container, "DataItem.HALF_BATHS") %>'>
	</asp:Label><br />
	# BEDROOMS:<asp:Label ID="Label2" runat="server" Text='<%# DataBinder.Eval(Container, "DataItem.NO_OF_BEDROOMS") %>'>
	</asp:Label><br />
	# FIREPLACES:<asp:Label ID="Label3" runat="server" Text='<%# DataBinder.Eval(Container, "DataItem.NO_OF_FIREPLACES") %>'>
	</asp:Label><br />
	HEATING TYPE:<asp:Label ID="Label5" runat="server" Text='<%# DataBinder.Eval(Container, "DataItem.HEATING_TYPE") %>'>
	</asp:Label><br />
	AIR CONDITIONING:<asp:Label ID="Label6" runat="server" Text='<%# DataBinder.Eval(Container, "DataItem.AIR_CONDITIONING") %>'>
	</asp:Label><br />
	</asp:Label></ItemTemplate>
	</telerik:GridTemplateColumn>
	<telerik:GridTemplateColumn UniqueName="TemplateColumn" HeaderText="Garage">
	<ItemTemplate>
	GARAGE TYPE:<asp:Label ID="Label59" runat="server" Text='<%# DataBinder.Eval(Container, "DataItem.GARAGE_TYPE") %>'>
	</asp:Label><br />
	GARAGE SPACES:<asp:Label ID="Label1" runat="server" Text='<%# DataBinder.Eval(Container, "DataItem.GARAGE_SPACES") %>'>
	</asp:Label><br />
	STRUCTURE CODE:<asp:Label ID="Label2" runat="server" Text='<%# DataBinder.Eval(Container, "DataItem.STRUCT_CODE") %>'>
	</asp:Label></ItemTemplate>
	</telerik:GridTemplateColumn>
	</Columns>
	</MasterTableView>
	<FilterMenu EnableTheming="True">
	<CollapseAnimation Duration="200" Type="OutQuint" />
	</FilterMenu>
	</telerik:RadGrid><ajaxtoolkit:CollapsiblePanelExtender ID="cpe" runat="Server" TargetControlID="pnlStructure"
	CollapsedSize="0" Collapsed="True" ExpandControlID="RadGrid1" CollapseControlID="RadGrid1"
	AutoCollapse="False" AutoExpand="False" ScrollContents="False" ImageControlID="imgLegal"
	ExpandedImage="~/lib/img/collapse.jpg" CollapsedImage="~/lib/img/expand.jpg"
	ExpandDirection="Vertical" SuppressPostBack="true" />
	</ajaxtoolkit:CollapsiblePanelExtender><asp:ImageButton ID="imgPrint" runat="server" ImageUrl="lib/img/printer.png"
	ImageAlign="Middle" AutoPostBack="False" CausesValidation="False" CssClass="imgPrint" /><asp:LinkButton
	ID="lnkPrint" runat="server" CssClass="lnkPrint">Print Now</asp:LinkButton>
	<asp:SqlDataSource ID="dsStructure" runat="server" ConnectionString="<%$ ConnectionStrings:csProperty %>"
	SelectCommand="SELECT [ROLL_NO], [CHAR_OF_CONST], [QUALITY], [SHAPE], [YEAR_BUILT], [YEAR_BUILT_CODE], [CONDITION], [FULL_STOREYS], [PART_STOREYS], [HEIGHT_EFF_DATE_S], [SPLIT], [GROSS_AREA], [TOTAL_BASEMENT], [FINISH_BASEMENT], [FINISH_BASEMENT_TY], [FULL_BATHS], [HALF_BATHS], [NO_OF_BEDROOMS], [NO_OF_FIREPLACES], [HEATING_TYPE], [AIR_CONDITIONING], [GARAGE_TYPE], [GARAGE_SPACES], [STRUCT_CODE] FROM [TX_STRUCT] WHERE ([ROLL_NO] = @ROLL_NO) ORDER BY [CHAR_OF_CONST] DESC">
	<SelectParameters>
	<asp:ControlParameter ControlID="RadGrid1" Name="ROLL_NO" PropertyName="SelectedValue"
	Type="string" />
	</SelectParameters>
	</asp:SqlDataSource>
	</asp:Panel>
	</asp:Content>

	Imports System
	Imports System.Web.UI.WebControls
	Imports Telerik.Web.UI
	Imports System.Data.SqlClient
	Partial Class test
	Inherits System.Web.UI.Page
	Protected Sub Page_Load(ByVal sender As Object, ByVal e As System.EventArgs) Handles Me.Load
	imgPrint.Attributes.Add("onclick", "javascript:window.print(); return false;")
	lnkPrint.Attributes.Add("onclick", "javascript:window.print(); return false;")
	End Sub
	Protected Sub RadGrid1_DataBound(ByVal sender As Object, ByVal e As System.EventArgs) Handles RadGrid1.DataBound
	If Page.IsPostBack Then
	Try
	RadGrid1.Items(0).Selected = True
	RadGrid2.MasterTableView.Rebind()
	Catch ex As IndexOutOfRangeException
	'MsgBox(ex.Message)
	lblError.Text = "Your Search: "
	lblError.Text += txtSearch.Text
	lblError.Text += " did not find any matches.  Please try again."
	Catch ex As Exception
	'MsgBox(ex.Message)
	'lblError.Text = "An error has occured/"
	'lblError.Text += ex.Message
	lblError.Text = "Your Search: "
	lblError.Text += txtSearch.Text
	lblError.Text += " did not find any matches.  Please try again."
	End Try
	End If
	End Sub
	End Class

Thanks for any help!

[Yavor]

Hi bslaght,

One possible implementation, which caters for your scenario, would be as shown in this code example. Additionally, as an add-on to the code in the sample, you can use the PreRender event handler for the 1st grid. From there, depending on the RadGrid1.MasterTableView.Items count, you can pre-select the first item. This will ensure that the data related to the 1st record is rendered in the other grid.
I hope this suggestion help.

Kind regards,
Yavor
the Telerik team

Check out Telerik Trainer, the state of the art learning tool for Telerik products.