Problem with Postback

[Scooby Dog]

I have a page with a nested gridview and within the nested gridview I have a
TemplateField and an Imagebutton. What I am trying to accomplish is allow
the user to expand the child grid and then click on the Imagebutton to
display a panel below. The problem I am having is that when I click on the
ImageButton a page postback occurs which gives the appearnce of the child
grid collapsing. I have tried adding a javascript function to the
ImageButtons OnClientClick event to return zero ( which does prevent the
postback ) but then the Child Grid's SelectedIndexChanged event stops
fireing. The SelectedIndexChanges is where I load my details panel via the
code below. Would anyone have any ideas how I can have the ImageButton
clicked and fire The Nested Grids SelectedIndexChaged without have the Grids
redisplay via post back.




Thanks in advance




Dave





Protected Sub gvItems_SelectedIndexChanged(ByVal sender As Object, ByVal e
As System.EventArgs)
Dim gvItems As GridView = CType(sender, GridView)
If gvItems.SelectedIndex >= 0 Then
Dim ItemId As Integer =
CInt(gvItems.DataKeys(gvItems.SelectedRow.RowIndex).Value)
Dim inq As InquiryItem = InqData.GetInquirysByItemID(ItemId)
End If
End Sub




Here is the source for my gridview:




function switchViews(obj,row)
{
var div = document.getElementById(obj);
var img = document.getElementById('img' + obj);

if (div.style.display=="none")
{
div.style.display = "inline";
if (row=='alt')
{
img.src =
"App_Themes/images/Expand_Button_white_Down.jpg";
mce_src =
"App_Themes/images/Expand_Button_white_Down.jpg";

}
else
{
img.src =
"App_Themes/images/Expand_Button_white_Down.jpg";
mce_src =
"App_Themes/images/Expand_Button_white_Down.jpg";
}
img.alt = "Close to view other customers";
}
else
{
div.style.display = "none";
if (row=='alt')
{
img.src =
"App_Themes/images/Expand_button_white.jpg";
mce_src =
"App_Themes/images/Expand_button_white.jpg";
}
else
{
img.src =
"App_Themes/images/Expand_button_white.jpg";
mce_src =
"App_Themes/images/Expand_button_white.jpg";
}
img.alt = "Expand to show orders";
}
}

function noPostback() {
return false;
}


</script>

</asp:Content>
<asp:Content ID="Content2" ContentPlaceHolderID="maincontent"
runat="Server">
<div id="adminedit">
<div>
Wausau Steel Customer Inquiry
</div>
<br />
<!-- I remved id="projectadministration" from this div -->
<div id="MainGrid">
<a name="content_start" id="content_start"></a>
<fieldset>
<!-- add H2 here and hide it with css since you can not put
h2 inside a legend tag -->
<h2>
Inquiry Status</h2>
<legend>Active Inquirys:</legend>
<asp:UpdatePanel ID="updMainGrid" runat="server"
UpdateMode="Conditional">
<ContentTemplate>
<asp:GridView ID="gvInqStatus"
AutoGenerateColumns="False" DataKeyNames="inqID" AllowSorting="True"
BorderWidth="0" runat="server"
BorderStyle="None" Width="99%" CellPadding="2"
AllowPaging="true" PageSize="10"
BorderColor="White">
<Columns>

<asp:TemplateField>
<ItemTemplate>
<a
href="javascript:switchViews('div<%# Eval("inqID") %>', 'one');">
<img id="imgdiv<%# Eval("inqID")
%>" alt="Click to show/hide orders" border="0"
src="App_Themes/images/expand_button_white.jpg"
/>
</a>
</ItemTemplate>
<AlternatingItemTemplate>
<a
href="javascript:switchViews('div<%# Eval("inqID") %>', 'alt');">
<img id="imgdiv<%# Eval("inqID")
%>" alt="Click to show/hide orders" border="0"
src="App_Themes/images/expand_button_white.jpg"
/>
</a>
</AlternatingItemTemplate>
</asp:TemplateField>

<asp:BoundField DataField="inqID"
HeaderText="Inquiry Number" SortExpression="InqID"
Visible="true"><ItemStyle
HorizontalAlign="Center"></ItemStyle></asp:BoundField>
<asp:BoundField DataField="CustNum"
HeaderText="Customer Number" SortExpression="CustNum">
<ItemStyle
HorizontalAlign="Center"></ItemStyle></asp:BoundField>
<asp:BoundField DataField="CustName"
HeaderText="Customer Name" SortExpression="CustName">
<ItemStyle
HorizontalAlign="Center"></ItemStyle></asp:BoundField>
<asp:BoundField DataField="DistrictCode"
HeaderText="District" SortExpression="DistrictCode">
<ItemStyle
HorizontalAlign="Center"></ItemStyle></asp:BoundField>
<asp:BoundField DataField="SalesNum"
HeaderText="Sales Number" SortExpression="SalesNum">
<ItemStyle
HorizontalAlign="Center"></ItemStyle></asp:BoundField>
<asp:BoundField DataField="QuoteDate"
HeaderText="Quote Date" DataFormatString="{0:d}"
SortExpression="QuoteDate">
<ItemStyle
HorizontalAlign="Center"></ItemStyle></asp:BoundField>
<asp:BoundField DataField="Status"
HeaderText="Quote Status" SortExpression="Status">
<ItemStyle
HorizontalAlign="Center"></ItemStyle></asp:BoundField>


<asp:TemplateField>
<ItemTemplate>
</td></tr>
<tr>
<td colspan="100%">
<div id="div<%#
Eval("InqID") %>" style="display: none; position: relative;
left: 25px;">
<asp:GridView
ID="gvItems" runat="server" Width="80%" AutoGenerateColumns="false"
DataKeyNames="ItemID"
EmptyDataText="No items for this customer." HeaderStyle-BackColor="#D6DDE9"
AllowSorting="false"
OnSelectedIndexChanged="gvItems_SelectedIndexChanged">
<Columns>
<asp:BoundField
DataField="Quantity" HeaderText="Quantity">
<ItemStyle
HorizontalAlign="Center"></ItemStyle></asp:BoundField>
<asp:BoundField
DataField="Description" HeaderText="Description"/>
<asp:BoundField
DataField="Grade" HeaderText="Grade">
<ItemStyle
HorizontalAlign="Center"></ItemStyle></asp:BoundField>
<asp:BoundField
DataField="Feet" HeaderText="Feet">
<ItemStyle
HorizontalAlign="Center"></ItemStyle></asp:BoundField>
<asp:BoundField
DataField="Inches" HeaderText="Inches">
<ItemStyle
HorizontalAlign="Center"></ItemStyle></asp:BoundField>

<asp:TemplateField
ShowHeader="false">
<ItemStyle
HorizontalAlign="Center" />
<ItemTemplate>
<asp:ImageButton
ID="btnView" runat="server" CausesValidation="False" CommandName="Select"
ImageUrl="App_Themes/images/grid-view.gif"
ToolTip="View"
OnClientClick="JavaScript:
return noPostback();" />
</ItemTemplate>
</asp:TemplateField>
</Columns>
<RowStyle
HorizontalAlign="Left" CssClass="row1" />
<HeaderStyle
HorizontalAlign="Left" />
</asp:GridView>
</div>
</td>
</tr>
</ItemTemplate>
</asp:TemplateField>

</Columns>
<RowStyle HorizontalAlign="Left" CssClass="row1"
/>
<HeaderStyle HorizontalAlign="Left" />
<EmptyDataTemplate>
<asp:Label ID="Label10" runat="server"
Text="Label">There are no Purchase Inquirys Entered</asp:Label>
</EmptyDataTemplate>
</asp:GridView>
</ContentTemplate>
</asp:UpdatePanel>
</fieldset>
</div>
</div>
</asp:Content>

 

[Scooby Dog]

I don't think the problem is from the page reloading the data in the grids,
I am using the following

If Not Page.IsPostBack then
LoadData() ' This loads my data grids
End If

I think the problem is that the page posts back and redraws the gridviews
which gives the illusion of the nested inner grid collapsing.

Here is are actual links to my html and code behind

Html: http://pastebin.org/159543

CodeBehind: http://pastebin.org/159546