0

我正在为一个朋友建立一个网站,并且想知道编写一个可选菜单(如http://www.istockphoto.com/stock-photo-8544108-beauty-with-hat.php - 那个)有多难在您选择图片大小的右侧。我想在 asp.net c# 中创建类似的东西。我在谷歌上搜索了 3 个小时,找不到任何类似或有用的解决方案。有人可以帮忙吗?

替代文字 http://www.balexandre.com/temp/2009-09-25_1158.png

4

2 回答 2

0

这很容易实现

1 - 在您的 Visual Studio 中创建一个新的启用 AJAX 的网站

替代文字 http://www.balexandre.com/temp/2009-09-25_1201.png

2 - 放置脚本管理器 3 - 放置更新面板并在其中添加 GridView 和文本框 4 - 告诉更新面板 ChildrenAsTriggers="true" 5 - 在网格视图中添加 2 个事件,RowDataBound 和 SelectedIndexChanged

<body>
   <form id="form1" runat="server">
   <asp:ScriptManager ID="sm" runat="server" />
   <div>
      <asp:UpdatePanel ID="pnl" runat="server">
         <ContentTemplate>
            <asp:GridView ID="grid" runat="server" OnRowDataBound="grid_RowDataBound" OnSelectedIndexChanged="grid_SelectedIndexChanged">
               <Columns>
                  <asp:CommandField ShowSelectButton="True" />
               </Columns>
            </asp:GridView>
            <br />
            Credits:
            <asp:Label ID="lbl" runat="server" Text="Label" Font-Bold="true" />
         </ContentTemplate>
      </asp:UpdatePanel>
   </div>
   </form>
</body>

6 - 两者兼而有之

protected void grid_RowDataBound(object sender, GridViewRowEventArgs e)
{
    if (e.Row.RowType == DataControlRowType.DataRow)
    {
        e.Row.Attributes.Add("onclick", "javascript:__doPostBack('grid','Select$" + e.Row.RowIndex + "')");
    }
}
protected void grid_SelectedIndexChanged(object sender, EventArgs e)
{
    lbl.Text = "changed...";
}
于 2009-09-25T09:22:34.130 回答
0

尝试这个:

<style type="text/css">
  .selectedRow{background-color:#E8E8FF;}
</style>

<table id="selectMenu">
  <tr><th>Size</th><th>Pixles</th><th>File size</th><th>Credits</th></tr>
  <tr><td>Small</td> <td>849 × 565 px</td> <td>555.96 KB</td> <td>20</td></tr>
  <tr><td>Medium</td> <td>1698 × 1131 px</td> <td>1.89 KB</td> <td>30</td></tr>
</table>

<div style="height:50px;width:200px">
    <div style="float:right;text-align:left;">
    Total Credits: <span id="credits">&nbsp;</span>
        //YOU CAN USE ASP.net HIDDEN FIELD TO WORK ON SERVER SIDE
        <input type="hidden" id="creditsValue" value=""/>
    </div>
</div>

<script type="text/javascript">
    $(document).ready(function(){
    $("table#selectMenu tr td").click(function(){
    var row=$(this).parent();
    //un-highlight any previously row
    $("table#selectMenu tr").removeClass("selectedRow");
    //highlight current row
    $(row).addClass("selectedRow");

    //get credits (from last td)
    var c=$(row).children(":last").text();
    //show credits required in span below table
    $("span#credits").text(c);
    $("#creditsValue").attr("value",c);
    })
});
</script>
于 2009-09-25T10:04:53.453 回答