3

私は ASP.NET の箇条書きリスト コントロールを持っていますが、これは今日まで、プレーン テキストに対してのみ作成および使用されていました。新しいデザイン リクエストで、これらのアイテムの一部をハイパーリンクに変換するよう求められています。したがって、箇条書きリストには最終的に、いくつかのプレーン テキスト項目といくつかのハイパーリンクを含める必要があります。DisplayMode=Hyperlink に変更すると、値を空白のままにしても、プレーン テキストであるべきエントリがクリック可能なリンクになります。

私ができると思う解決策の 1 つは、リテラル コントロールを使用<a href...し、リンクが必要な行で HTML ( ) を使用することです。これには古いコードを少し作り直す必要があるため、実際に試してみる前に、既存の BulletedList でこれが可能かどうかを知りたいと思います。

編集：

私は真剣にこれについてどこにも何も見つけることができませんでした. したがって、次の 10 年のうちに同じシナリオに陥る 1 人または 2 人の迷子になった魂のために、以下に提供する優れた回答の完全な実装を以下に示します。

ページの分離コード:

foreach (SupportLog x in ordered)
{
    blschedule.Items.Add(new ListItem(x.Headline, "http://mysite/Support/editsupportlog.aspx?SupportLogID=" + x.SupportLogID));
}

blschedule.DataBind();

最後の DataBind に注意してください --- これは、DataBound イベントに分類するために必要です。

protected void blschedule_DataBound(object sender, EventArgs e)
{
    foreach (ListItem x in blschedule.Items)
    {
        if (x.Value.Contains("http")) //an item that should be a link is gonna have http in it, so check for that
        {
            x.Attributes.Add("data-url", x.Value);
        }
    }
}

.aspx ページのヘッド:

<script src="<%# ResolveClientUrl("~/jquery/jquery141.js") %>" type="text/javascript"></script>
    <script>

        $(document).ready(function () {

           $('#<%=blschedule.ClientID %> li').each(function () {
               var $this = $(this);
               var attr = $this.attr('data-url');

               if (typeof attr !== 'undefined' && attr !== false) {
                   $this.html('<a href="' + $this.attr('data-url') + '">' + $this.text() + '</a>');
               }
           });
       });

    </script>

if ステートメントは、「data-url」属性を持つアイテムのみをリンクに変換し、すべてのアイテムをリンクに変換しないようにするために必要です。

4

1 に答える 1

2

<asp:Repeater />そのタスクにはを使用する方が簡単な場合があります。

何かのようなもの：

<asp:Repeater ID="Repeater1" runat="server">
    <HeaderTemplate><ul></HeaderTemplate>
    <ItemTemplate>
        <li><%# string.IsNullOrEmpty(Eval("url").ToString()) ? Eval("text") : string.Format("<a href=\"{0}\">{1}</a>", Eval("url").ToString(), Eval("text").ToString()) %></li>
    </ItemTemplate>
    <FooterTemplate></ul></FooterTemplate>
</asp:Repeater>

ハッカリシャスな方法

DataValueFieldデータバインディング時にURL 値をに設定しますBulletedList

イベントを使用しDataBoundてアイテムを反復処理し、URL 値を持つ属性を各アイテムに追加します

protected void BulletedList1_DataBound(object sender, EventArgs e)
{
    foreach (ListItem i in BulletedList1.Items)
    {
        if (i.Value.Length > 0)
        {
            i.Attributes.Add("data-url", i.Value);
        }
    }
}

JavaScript/jQuery を使用して、必要なマークアップを適用します。

$('[data-url]').each(function() {
    var $this = $(this);
    $this.html('<a href="' + $this.attr('data-url') + '">' + $this.text() + '</a>');
});

このjQueryはテストしていませんが、近いはずです

于 2012-10-26T03:27:53.777 に答える