asked on

asp.net, C# Image1 make visible when user clicks on gridveiw 'select' linkbutton

Hello,

I have a web content form where users can perform a database search. The search returns a gridview control matched to a detailsview control. In the detailsview control, there is a panel that displays a photo (rendered by Image1).

At present, the 'Image1' displays before users begin their search (please see attached screenshots) . the 'Image1' control is i nested inside a panel (pnl_wsdetail_imageview). I can hide this panel on Page_Load, but it does not become visible when users click on the 'select' linkbutton from the main gridview control.

I am attempting to find a way to make this 'Image1' or 'pnl_wsdetail_imageview' control become visible only when users click the 'select' linkbutton.

My *.aspx code follows:
------------------------------------
<tr>
<td style="text-align: right; vertical-align: top;" class="style14">
<div class="warrantsearchcontenttext" style="text-align: right;">
<asp:Panel ID="pnl_warrants_search" runat="server" BackColor="#FFFFFF" Width="550">
<table cellpadding="0" cellspacing="0" border="0" style="height: 162px; width: 100%;
text-align: right;">
<tr>
<td rowspan="6" valign="top" align="left">
 <img src="images/spacer.gif" width="195px;" height="1" alt="" />
</td>
<td width="49%" valign="top" align="right">
<asp:Label ID="lbl_warrants_FirstName" runat="server" AssociatedControlID="FirstNameTextBox"
ForeColor="Black" Text="First Name "></asp:Label>
</td>
<td width="1%" valign="top" align="left">
 : 
</td>
<td width="50%" valign="top" align="left">
<asp:TextBox ID="FirstNameTextBox" runat="server" Width="150" OnTextChanged="FirstNameTextBox_TextChanged" />
</td>
</tr>
<tr>
<td width="49%" valign="top" align="right">
<asp:Label ID="lbl_warrants_LastName" runat="server" AssociatedControlID="LastNameTextBox"
ForeColor="Black" Text="Last Name"></asp:Label>
   
</td>
<td width="1%" valign="top" align="left">
 : 
</td>
<td width="50%" valign="top" align="left">
<asp:TextBox ID="LastNameTextBox" runat="server" Width="150" OnTextChanged="LastNameTextBox_TextChanged" />
</td>
</tr>
<tr>
<td width="49%" valign="top" align="right">
<asp:Label ID="lbl_warrants_SPNNo" runat="server" AssociatedControlID="SpnTextBox"
ForeColor="Black" Text="SPN #"></asp:Label>
</td>
<td width="1%" valign="top" align="left">
 : 
</td>
<td width="50%" valign="top" align="left">
<asp:TextBox ID="SpnTextBox" runat="server" Width="150" OnTextChanged="SpnTextBox_TextChanged" />
</td>
</tr>
<tr>
<td width="49%" valign="top" align="left">
 
</td>
<td width="1%" valign="top" align="left">
 
</td>
<td width="50%" valign="top" align="left">
 
</td>
</tr>
<tr>
<td width="49%" valign="top" align="right">
<asp:Button ID="btn_warrants_cancel" runat="server" Text="Cancel" OnClick="btn_warrants_cancel_Click" />
</td>
<td width="1%" valign="top" align="left">
 
</td>
<td width="50%" valign="top" align="left">
<asp:Button ID="Button1" runat="server" Text="Find" OnClick="Button1_Click" Width="168" />
</td>
</tr>
<tr>
<td colspan="3" width="100%" valign="top" align="left" style="padding-left: 8px;">
 
</td>
</tr>
</table>
</asp:Panel>
</div>


<div class="warrantsearchcontenttext">
<table style="width: 100%;" cellpadding="0" cellspacing="0" border="0">
<tr>
<td style="vertical-align: top; text-align: left; width: 75%;">
<div class="warrantsearchcontenttext">
<asp:Panel ID="pnl_gvSearchResults_Detailsview" runat="server" Visible="true">
<asp:DetailsView ID="dv_searchresults" runat="server" Height="50px" Width="390px"
AutoGenerateRows="False" CellPadding="4" DataSourceID="ds_warrantsearchdetails"
Font-Names="Arial" Font-Size="X-Small" ForeColor="#333333" GridLines="None" FieldHeaderStyle-Width="100px">
<FooterStyle BackColor="#5D7B9D" Font-Bold="True" ForeColor="White" />
<CommandRowStyle BackColor="#E2DED6" Font-Bold="True" />
<RowStyle BackColor="#F7F6F3" ForeColor="#333333" />
<FieldHeaderStyle BackColor="#E9ECF1" Font-Bold="True" />
<PagerStyle BackColor="#284775" ForeColor="White" HorizontalAlign="Center" />
<Fields>
<asp:BoundField DataField="Spn" HeaderText="Spn" SortExpression="Spn" />
<asp:BoundField DataField="Firstname" HeaderText="First Name" SortExpression="Firstname" />
<asp:BoundField DataField="Lastname" HeaderText="Last Name" SortExpression="Lastname" />
<asp:BoundField DataField="Race" HeaderText="Race" SortExpression="Race" />
<asp:BoundField DataField="Sex" HeaderText="Sex" SortExpression="Sex" />
<asp:TemplateField HeaderText="Date of Birth" SortExpression="Dob">
<ItemTemplate>
<asp:Label ID="lbl_dob" runat="server" Text='<%# Bind("Dob", "{0:MM/dd/yyyy}") %>'></asp:Label>
</ItemTemplate>
</asp:TemplateField>
<%--<asp:BoundField DataField="Case_Number" HeaderText="Case Number" SortExpression="Case_Number" />--%>
<%--<asp:BoundField DataField="Offence_Desc" HeaderText="Offence Description" SortExpression="Offence_Desc" ItemStyle-Wrap="true" />--%>
<%--<asp:BoundField DataField="Bond" HeaderText="Bond" SortExpression="Bond" DataFormatString="{0:d}" HtmlEncode="False" /> --%>
<%--<asp:TemplateField HeaderText="Filling Date" SortExpression="filingdate">
<ItemTemplate>
<asp:Label ID="lbl_filingdate" runat="server" Text='<%# Bind("FillingDate", "{0:MM/dd/yyyy}") %>'></asp:Label>
</ItemTemplate>
</asp:TemplateField> --%>
<%--<asp:BoundField DataField="SONumber" HeaderText="SO Number"
SortExpression="SONumber" />--%>
</Fields>
<HeaderStyle BackColor="#5D7B9D" Font-Bold="True" ForeColor="White" />
<EditRowStyle BackColor="#999999" />
<AlternatingRowStyle BackColor="White" ForeColor="#284775" />
</asp:DetailsView>
<asp:SqlDataSource ID="ds_warrantsearchdetails" runat="server" ConnectionString="<%$ ConnectionStrings:Jailinfo_JAUConnectionString1 %>"
SelectCommand="SELECT [Lastname], [Firstname], [Race], [Sex], [Dob], [Case_Number], [Offence_Desc], [Bond], [Spn], [FillingDate], [SONumber] FROM [Jims_Mis_Warrants] WHERE ([Spn] = @Spn) ORDER BY [Firstname], [Lastname], [Spn]">
<SelectParameters>
<asp:ControlParameter ControlID="gv_warrantsearchresults" Name="Spn" PropertyName="SelectedValue"
Type="String" />
</SelectParameters>
</asp:SqlDataSource>
</asp:Panel>
</div>
</td>
<td style="vertical-align: top; text-align: left; width: 25%; background-color:#FFFFFF;">
<asp:Panel ID="pnl_wsdetail_imageview" runat="server">
<asp:Image ID="Image1" runat="server" Width="150" Height="150px" />
<br />
<asp:TextBox ID="txt_caption" runat="server" Visible="false" OnTextChanged="txt_caption_TextChanged"></asp:TextBox>
</asp:Panel>
</td>
</tr>
<tr>
<td colspan="2" style="vertical-align: top; text-align: left; width: 100%;">
 
</td>
</tr>

<tr>
<td colspan="2" style="vertical-align: top; text-align: left; width: 100%;">
<div class="warrantsearchcontenttext">
<asp:GridView ID="GridView1" runat="server" AutoGenerateColumns="False" CellPadding="4"
DataSourceID="SqlDataSource11" ForeColor="#333333" GridLines="None" OnSelectedIndexChanged="GridView1_SelectedIndexChanged"
Width="549px">
<RowStyle BackColor="#F7F6F3" ForeColor="#333333" />
<Columns>
<asp:BoundField DataField="Offence_Desc" HeaderText="Offence Description" SortExpression="Offence_Desc"
ItemStyle-Wrap="true">
<ItemStyle Wrap="True"></ItemStyle>
</asp:BoundField>
<asp:BoundField DataField="Case_Number" HeaderText="Case Number" SortExpression="Case_Number" />
<asp:BoundField DataField="Bond" HeaderText="Bond" SortExpression="Bond" DataFormatString="{0:d}"
HtmlEncode="False" />
</Columns>
<FooterStyle BackColor="#5D7B9D" Font-Bold="True" ForeColor="White" />
<PagerStyle BackColor="#284775" ForeColor="White" HorizontalAlign="Center" />
<SelectedRowStyle BackColor="#E2DED6" Font-Bold="True" ForeColor="#333333" />
<HeaderStyle BackColor="#5D7B9D" Font-Bold="True" ForeColor="White" />
<EditRowStyle BackColor="#999999" />
<AlternatingRowStyle BackColor="White" ForeColor="#284775" />
</asp:GridView>
<asp:SqlDataSource ID="SqlDataSource11" runat="server" ConnectionString="<%$ ConnectionStrings:Jailinfo_JAUConnectionString1 %>"
SelectCommand="SELECT DISTINCT [Case_Number],[Offence_Desc], [Bond] FROM [Jims_Mis_Warrants] WHERE ([Spn] = @Spn)">
<SelectParameters>
<asp:ControlParameter ControlID="gv_warrantsearchresults" Name="Spn" PropertyName="SelectedValue"
Type="String" />
</SelectParameters>
</asp:SqlDataSource>
</div>
</td>
</tr>
</table>
</div>
</td>
<td class="style15">
 
</td>
<td class="style16">
<div class="warrantsearchcontenttext">

<div style="overflow-y: scroll; height: 450px; width: 580px;">
<asp:Panel ID="pnl_gvWarrantSearchResults" runat="server" Visible="false">

<asp:SqlDataSource ID="ds_warrantsearchresults" runat="server" ConnectionString="<%$ ConnectionStrings:Jailinfo_JAUConnectionString1 %>"
SelectCommand="sp_getAllWarrantsbyName" SelectCommandType="StoredProcedure">
<SelectParameters>
<asp:ControlParameter ControlID="FirstNameTextBox" Name="Firstname" PropertyName="Text"
Type="String" Size="50" ConvertEmptyStringToNull="false" />
<asp:ControlParameter ControlID="LastNameTextBox" Name="Lastname" PropertyName="Text"
Type="String" ConvertEmptyStringToNull="false" />
<asp:ControlParameter ControlID="SpnTextBox" Name="Spn" PropertyName="Text" Type="String"
ConvertEmptyStringToNull="false" />
</SelectParameters>
</asp:SqlDataSource>
<asp:DropDownList ID="ddl_warrantsearchresults" runat="server" OnSelectedIndexChanged="ddl_warrantsearchresults_changed"
AutoPostBack="true">
<asp:ListItem Text="25" Value="25" />
<asp:ListItem Text="50" Value="50" />
<asp:ListItem Text="100" Value="100" />
<asp:ListItem Text="view all" Value="all" />
</asp:DropDownList>
<asp:GridView ID="gv_warrantsearchresults" runat="server" DataKeyNames="Spn" AllowSorting="True"
DataSourceID="ds_warrantsearchresults" CellPadding="4" Font-Names="Arial" Font-Size="Small"
ForeColor="#0033CC" GridLines="None" Width="580px" EmptyDataText="NO Matching Data Found"
OnSelectedIndexChanged="gv_warrantsearchresults_SelectedIndexChanged" PageSize="15"
ShowFooter="True" AllowPaging="true">
<%-- <HeaderStyle CssClass="GridHeader" /> --%>
<RowStyle BackColor="#EFF3FB" />
<EmptyDataRowStyle Font-Names="Arial" Font-Size="Small" ForeColor="Red" />
<Columns>
<asp:CommandField ShowSelectButton="True" />
</Columns>
<FooterStyle BackColor="#507CD1" Font-Bold="True" ForeColor="White" Font-Names="Arial"
Font-Size="X-Small" />
<PagerSettings Mode="NumericFirstLast" />
<PagerStyle BackColor="#507CD1" ForeColor="White" HorizontalAlign="center" />
<SelectedRowStyle BackColor="#D1DDF1" Font-Bold="True" ForeColor="#333333" />
<HeaderStyle BackColor="#507CD1" Font-Bold="True" ForeColor="White" HorizontalAlign="Left" />
<EditRowStyle BackColor="#2461BF" />
<AlternatingRowStyle BackColor="White" HorizontalAlign="Left" VerticalAlign="Top" />
</asp:GridView>


<img src="images/spacer.gif" width="600px" height="1px" alt="" /></asp:Panel>
</div>
</div>
</td>
</tr>
<tr>
<td valign="top" align="left">
 
</td>
<td class="style12">
 
</td>
<td valign="top" align="left" class="style11">
<div class="warrantsearchcontenttext">
</div>

</td>
</tr>
--------------------------

My codebehind follows:
--------------------------

Page_Load
--------------
protected void Page_Load(object sender, EventArgs e)
{
//pnl_warrants_search.Visible = true;
FirstNameTextBox.Focus();

if (!IsPostBack)
{
FirstNameTextBox.Attributes.Add("onKeyPress",
"doClick('" + Button1.ClientID + "',event)");
LastNameTextBox.Attributes.Add("onKeyPress",
"doClick('" + Button1.ClientID + "',event)");
SpnTextBox.Attributes.Add("onKeyPress",
"doClick('" + Button1.ClientID + "',event)");
}

//pnl_agreetoterms.Visible = false;

//pnl_gvWarrantSearchResults.Visible = false;
//pnl_gvSearchResults_Detailsview.Visible = false;

//Image1.ImageUrl = "http://hcsows04/intranet/jailview/image.aspx?so=1633991";

//pnl_wsdetail_imageview.Visible = false;
//Image1.ImageUrl = "http://hcsows04/intranet/jailview/image.aspx?so=0647316";

// pnl_wsdetail_imageview.Visible = false;
}
----------

The code that calls the image follows:
---------
protected void gv_warrantsearchresults_SelectedIndexChanged(object sender, EventArgs e)
{
//gv_warrantsearchresults.SelectedRow.Cells[4].Visible = false;
sotemp = gv_warrantsearchresults.SelectedRow.Cells[4].Text;

txt_caption.Text = sotemp;
Image1.ImageUrl = "web address here" + txt_caption.Text + "";

}
--------

The 'Image1' call can be a label that can have a white background or something that blends into the page's background (white) or something that does not display the 'Image1' placeholder.

ANY help would be greatly appreciat ed
screenshot-01.jpg
screenshot-02.jpg
screenshot-03.jpg

ASKER CERTIFIED SOLUTION

TonyReba

membership

This solution is only available to members.

To access this solution, you must be a member of Experts Exchange.

Start Free Trial

Codeaddict7423

ASKER

TonyReba,
Thank you for the quick reply.
I am trying to understand your code suggestions and I 'm a little confused. Let me explain my naming convention:

Main gridview that first displays the initial search:
----------------
gv_warrantsearchresults
---------------
this is the gridview that has the 'select' button (<asp:CommandField ShowSelectButton="True" />)

The DetailsView control that receives information from the main gridview (gv_warrantsearchresults) is called dv_searchresults. Next to the dv_searchresults control is the panel pnl_wsdetail_imageview which holds 'Image1'

--------------

Last,
------------
the 'GridView1' control displays more information from the detailsview control (dv_searchresults).

-----------

If you could provide a sample call from the main search gridview control
(gv_warrantsearchresults) such that when a user clicks on the 'select' button, the detailsview control (dv_searchresults) and the panel which holds Image1 (pnl_wsdetail_imageview) becomes visible, this would help me make this page look and function better...