0

以下のjQueryを使用して、テキストに「続きを読む」オプションを追加しているため、最初の200文字のみが表示され、ユーザーは続きを読むをクリックしてテキストの残りの部分を表示できます。

<head><title>Add Read More Link (from DevCurry.com)</title>    
    <script type="text/javascript" src="http://ajax.microsoft.com/ajax/jquery/jquery1.4.4.min.js">    </script>    
    <script type="text/javascript"    src="http://plugins.learningjquery.com/expander/jquery.expander.js">    </script>    
    <script type="text/javascript">
           $(function () {
               $('div.readmore').expander({
                 slicePoint: 200, expandText: 'Click Here to Read More', userCollapseText: 'Hide Text'
              });
           }
          );    
    </script>
</head>

この機能を使用するには、次のものを使用する必要があります

<div class="readmore">     The Div Text Comes Here      </div> 

私の問題は、gridviewバウンドフィールド内でjQueryを使用したいということです。長い説明を含む列が1つあり、その中にjQueryを適用する必要があります。

<asp:GridView ID="GridView1" runat="server" AllowPaging="True" AllowSorting="True"
            AutoGenerateColumns="False" EmptyDataText="No Records" EnableSortingAndPagingCallbacks="True"
            Width="1017px" ShowFooter="False" DataSourceID="SqlDataSource1" 
            EnableModelValidation="True" PageSize="10" GridLines="None" CssClass="mGrid"
            PagerStyle-CssClass="pgr" AlternatingRowStyle-CssClass="alt"  >

        <Columns>
            <asp:BoundField DataField="CreationDate" HeaderText="Date" SortExpression="CreationDate"  dataformatstring="{0:MM/dd/yyyy}" />
            <asp:BoundField DataField="Title" HeaderText="Title" SortExpression="Title" />
            <asp:BoundField DataField="Description" HeaderText="Description" SortExpression="Description" />
            <asp:BoundField DataField="Type" HeaderText="Type" SortExpression="Type" />
            <asp:BoundField DataField="Department" HeaderText="Department" SortExpression="Department" />

        </Columns>

    </asp:GridView>

残念ながら、バウンドフィールド内に挿入することはできません。Jqueryをバウンドフィールドに適用する他の方法はありますか?

4

2 に答える 2

3

交換できます

<asp:BoundField DataField="Description" HeaderText="Description"
   SortExpression="Description" />

<asp:TemplateField HeaderText="Description" SortExpression="Description">
    <ItemTemplate>
        <div class="readmore"><%# Eval("Description") %></div>
    </ItemTemplate>                                                
</asp:TemplateField>
于 2013-03-25T12:44:39.477 に答える
0

css-classを設定し、そのクラスをjQueryで使用できます。
また、データを表示するにはTemplateFieldを使用する必要があります。

于 2013-03-25T12:45:43.827 に答える