大家好啊!我现在在做一个小网站,页面左侧一个gridview控件,绑定的是项目名称和项目编号,右侧是是一个UpdatePanel,绑定的是一个datalis控件,该控件绑定项目所对应的内容编号和图片集。
我现在的问题是,我用ajax技术想实现左侧点击gridview控件的项目名称,右侧相应的局部更新内容和图片集,前端代码和后台代码我应该怎么实现呢??主要是代码不太会写,不懂怎么实现能够点击gridview控件的项目名称?大家给贴一贴代码或者举个例子吧!!谢谢各位前辈了!!
页面左侧的UpdatePanel :
<asp:GridView ID="GridViewlist" runat="server"
AutoGenerateColumns="false"
Width="207px" BackColor="White"
BorderColor="#CCCCCC" BorderStyle="None" BorderWidth="1px" CellPadding="3"
onselectedindexchanged="GridViewlist_SelectedIndexChanged">
<RowStyle ForeColor="#000066" />
<Columns>
<asp:BoundField DataField="ProjectID" HeaderText="项目编号" />
<asp:BoundField DataField="ProjectName" HeaderText="项目名称" />
</Columns>
<FooterStyle BackColor="White" ForeColor="#000066" />
<PagerStyle BackColor="White" ForeColor="#000066" HorizontalAlign="Left" />
<SelectedRowStyle BackColor="#669999" Font-Bold="True" ForeColor="White" />
<HeaderStyle BackColor="#006699" Font-Bold="True" ForeColor="White" />
</asp:GridView>右侧的:
<asp:UpdatePanel ID="UpdatePanelRight" runat="server" UpdateMode= "Conditional" >
<ContentTemplate>
<table cellpadding="5" width="100%" style="font: 10pt verdana">
<tr>
<td style="width: 635px; height:623px;">
<asp:DataList ID="DataListImages" runat="server" RepeatColumns="6"
RepeatDirection="Horizontal" AutoGenerateColumns="true"
Width="633px" BackColor="White" BorderColor="#CCCCCC" BorderStyle="None"
BorderWidth="1px" CellPadding="3" Height="621px"> <%--DataSourceID="SqlDataSource1" --%>
<HeaderTemplate>
</HeaderTemplate>
<ItemTemplate>
<tr>
<td>
<table cellpadding="0" cellspacing="0" border="0" width="100%" style="float:left">
<tr>
<td colspan="6">
<asp:Label ID="LabelControlID" runat="server" ForeColor="#000066" Text='<%# Eval("ControlID")%>'></asp:Label>
<asp:Label ID="LabelControlName" runat="server" ForeColor="#000066" Text='<%# Eval("ControlName")%>' ></asp:Label>
<asp:Label ID="LabelRepresentions" runat="server" ForeColor="#000066" Text='<%# Eval("Representions")%>'></asp:Label>
</td>
</tr>
<tr>
<asp:Literal ID="images" runat="server" Text='<%# getPP(Eval("images").ToString())%>'></asp:Literal> </tr>
</table>
</td>
</tr>
</ItemTemplate>
</asp:DataList>
</td>
</tr>
</table>
</ContentTemplate>
<Triggers>
<asp:AsyncPostBackTrigger ControlID="GridViewlist" EventName="SelectedIndexChanged" />
</Triggers>
</asp:UpdatePanel>
我现在的问题是,我用ajax技术想实现左侧点击gridview控件的项目名称,右侧相应的局部更新内容和图片集,前端代码和后台代码我应该怎么实现呢??主要是代码不太会写,不懂怎么实现能够点击gridview控件的项目名称?大家给贴一贴代码或者举个例子吧!!谢谢各位前辈了!!
页面左侧的UpdatePanel :
<asp:GridView ID="GridViewlist" runat="server"
AutoGenerateColumns="false"
Width="207px" BackColor="White"
BorderColor="#CCCCCC" BorderStyle="None" BorderWidth="1px" CellPadding="3"
onselectedindexchanged="GridViewlist_SelectedIndexChanged">
<RowStyle ForeColor="#000066" />
<Columns>
<asp:BoundField DataField="ProjectID" HeaderText="项目编号" />
<asp:BoundField DataField="ProjectName" HeaderText="项目名称" />
</Columns>
<FooterStyle BackColor="White" ForeColor="#000066" />
<PagerStyle BackColor="White" ForeColor="#000066" HorizontalAlign="Left" />
<SelectedRowStyle BackColor="#669999" Font-Bold="True" ForeColor="White" />
<HeaderStyle BackColor="#006699" Font-Bold="True" ForeColor="White" />
</asp:GridView>右侧的:
<asp:UpdatePanel ID="UpdatePanelRight" runat="server" UpdateMode= "Conditional" >
<ContentTemplate>
<table cellpadding="5" width="100%" style="font: 10pt verdana">
<tr>
<td style="width: 635px; height:623px;">
<asp:DataList ID="DataListImages" runat="server" RepeatColumns="6"
RepeatDirection="Horizontal" AutoGenerateColumns="true"
Width="633px" BackColor="White" BorderColor="#CCCCCC" BorderStyle="None"
BorderWidth="1px" CellPadding="3" Height="621px"> <%--DataSourceID="SqlDataSource1" --%>
<HeaderTemplate>
</HeaderTemplate>
<ItemTemplate>
<tr>
<td>
<table cellpadding="0" cellspacing="0" border="0" width="100%" style="float:left">
<tr>
<td colspan="6">
<asp:Label ID="LabelControlID" runat="server" ForeColor="#000066" Text='<%# Eval("ControlID")%>'></asp:Label>
<asp:Label ID="LabelControlName" runat="server" ForeColor="#000066" Text='<%# Eval("ControlName")%>' ></asp:Label>
<asp:Label ID="LabelRepresentions" runat="server" ForeColor="#000066" Text='<%# Eval("Representions")%>'></asp:Label>
</td>
</tr>
<tr>
<asp:Literal ID="images" runat="server" Text='<%# getPP(Eval("images").ToString())%>'></asp:Literal> </tr>
</table>
</td>
</tr>
</ItemTemplate>
</asp:DataList>
</td>
</tr>
</table>
</ContentTemplate>
<Triggers>
<asp:AsyncPostBackTrigger ControlID="GridViewlist" EventName="SelectedIndexChanged" />
</Triggers>
</asp:UpdatePanel>
右键单击GridView->属性->(事件)黄色闪电符号->找到SelectedIndexChanged双击;