Fungsi bawaan Pemfilteran Gridview?

Apakah .NET memiliki beberapa jenis fungsi bawaan yang memungkinkan pemfilteran pada Gridviews? Saya selalu memprogram filter saya dengan menggunakan sumber data yang dihasilkan oleh prosedur tersimpan dinamis yang mengambil parameter. Tetapi untuk menjaga baris filter selalu ada, saya harus menempatkan kode untuk membuat kontrol yang digunakan untuk memfilter di tiga tempat berbeda ketika paging diizinkan (Page_load,Gridview_Databound,Page_SaveStateComplete) Sepertinya pasti ada cara yang lebih baik . Jika ya, Bagaimana?


person Eric    schedule 09.07.2009    source sumber


Jawaban (1)


Hanya jika Anda melakukan pekerjaan itu. Periksa

http://blog.evonet.com.au/post/Creating-a-Stylish-looking-Gridview-with-Filtering.aspx


Seperti disebutkan dalam komentar, situs ini tidak tersedia lagi. Berikut ini diambil langsung dari entri blog Bartek Marnane yang dapat Anda temukan di web.archive.com :

Langkah 1: Buat Gridview dan Sumber Data

Buat Gridview dan Datasouce sederhana. Dalam contoh ini saya menggunakan Sumber Data SQL, tapi saya sarankan menggunakan ObjectDataSource untuk lingkungan produksi. Tetapkan ConnectionString ke nilai di file web.config Anda dan ItemStyle-Width untuk setiap bidang Anda bergantung pada tipe data dan berapa banyak ruang yang Anda miliki.

<asp:GridView ID="Gridview1" runat="server" AutoGenerateColumns="False" AllowPaging="True"
AllowSorting="true" DataSourceID="dsGridview" Width="650px" PageSize="20"
CssClass="Gridview">
<Columns>
    <asp:BoundField DataField="id" HeaderText="id" SortExpression="id"
        ItemStyle-Width="50px" ItemStyle-HorizontalAlign="Center" />
    <asp:BoundField DataField="FirstName" HeaderText="Sort" SortExpression="FirstName"
        ItemStyle-Width="150px" />
    <asp:BoundField DataField="LastName" HeaderText="Sort" SortExpression="LastName"
        ItemStyle-Width="150px" />
    <asp:BoundField DataField="Department" HeaderText="Sort" SortExpression="Department"
        ItemStyle-Width="150px" />
    <asp:BoundField DataField="Location" HeaderText="Sort" SortExpression="Location"
        ItemStyle-Width="150px" />
</Columns>
</asp:GridView>
<asp:SqlDataSource ID="SqlDataSource1" runat="server"
ConnectionString="<%$ ConnectionStrings:EvonetConnectionString %>"
SelectCommand="SELECT * FROM [T_Employees]" />

Langkah 2: Buat tabel yang digunakan untuk header Gridview

Sekarang kita membuat tabel sederhana untuk menampung judul dan menyaring kotak drop down.

<table style="width: 650px" border="0" cellpadding="0" cellspacing="1"
class="GridviewTable">
<tr>
    <td style="width: 50px;">
        ID
    </td>
    <td style="width: 150px;">
        First Name
    </td>
    <td style="width: 150px;">
        Last Name
    </td>
    <td style="width: 150px;">
        Department
    </td>
    <td style="width: 150px;">
        Location
    </td>
</tr>
<tr>
    <td style="width: 50px;">
    </td>
    <td style="width: 150px;">
    </td>
    <td style="width: 150px;">
    </td>
    <td style="width: 150px;">
        <asp:DropDownList ID="ddldepartment" DataSourceID="dsPopulateDepartment"
            AutoPostBack="true" DataValueField="department" runat="server" Width="130px"
            Font-Size="11px" AppendDataBoundItems="true">
            <asp:ListItem Text="All" Value="%"></asp:ListItem>
        </asp:DropDownList>
    </td>
    <td style="width: 150px;">
        <asp:DropDownList ID="ddlLocation" DataSourceID="dsPopulateLocation"
            AutoPostBack="true" DataValueField="location" runat="server" Width="130px"
            Font-Size="11px" AppendDataBoundItems="true">
            <asp:ListItem Text="All" Value="%"></asp:ListItem>
        </asp:DropDownList>
    </td>
</tr>
<tr>
    <td colspan="5">
        <asp:GridView ID="Gridview1" runat="server" AutoGenerateColumns="False"
            AllowPaging="True" AllowSorting="true" DataSourceID="dsGridview"
            Width="650px" PageSize="10" CssClass="Gridview">
            <Columns>
                <asp:BoundField DataField="id" HeaderText="Sort" SortExpression="id"
                    ItemStyle-Width="50px" ItemStyle-HorizontalAlign="Center" />
                <asp:BoundField DataField="FirstName" HeaderText="Sort"
                    SortExpression="FirstName" ItemStyle-Width="150px" />
                <asp:BoundField DataField="LastName" HeaderText="Sort"
                    SortExpression="LastName" ItemStyle-Width="150px" />
                <asp:BoundField DataField="Department" HeaderText="Sort"
                    SortExpression="Department" ItemStyle-Width="150px" />
                <asp:BoundField DataField="Location" HeaderText="Sort"
                    SortExpression="Location" ItemStyle-Width="150px" />
            </Columns>
        </asp:GridView>
    </td>
</tr>
</table>

Untuk sel terakhir, atur nilai td colspan ke jumlah bidang di Gridview Anda. Pindahkan Gridview Anda ke sel terakhir itu.

Langkah 3: Buat lembar gaya

Stylesheet yang saya gunakan memiliki item berikut:

.GridviewDiv {font-size: 62.5%; font-family: 'Lucida Grande',
    'Lucida Sans Unicode', Verdana, Arial, Helevetica, sans-serif; color: #303933;}
Table.Gridview{border:solid 1px #df5015;}
.GridviewTable{border:none}
.GridviewTable td{margin-top:0;padding: 0; vertical-align:middle }
.GridviewTable tr{color: White; background-color: #df5015; height: 30px; text-align:center}
.Gridview th{color:#FFFFFF;border-right-color:#abb079;border-bottom-color:#abb079;
    padding:0.5em 0.5em 0.5em 0.5em;text-align:center}
.Gridview td{border-bottom-color:#f0f2da;border-right-color:#f0f2da;
    padding:0.5em 0.5em 0.5em 0.5em;}
.Gridview tr{color: Black; background-color: White; text-align:left}
:link,:visited { color: #DF4F13; text-decoration:none }

Anda seharusnya bisa menyalin ini ke dalam file css Anda tanpa mempengaruhi style sheet Anda yang keluar, namun berhati-hatilah jika Anda sudah menyetel :link dan :visited di situs Anda.

Langkah 4: Tambahkan kotak drop-down pemfilteran dan sumber data

Dalam tabel yang dibuat pada Langkah 2, tambahkan daftar dropdown ke setiap sel di baris kedua yang berisi bidang yang ingin Anda filter. Pastikan masing-masing daftar dropdown lebih kecil dari sel yang dituju, jika tidak, batas tabel Anda tidak akan sejajar. Siapkan sumber data yang mendapatkan setiap kemungkinan nilai bidang tersebut dalam tabel Anda. Saya melakukan ini dengan menjalankan DISTINCT untuk semua nilai dalam tabel yang saya filter:

<asp:DropDownList ID="ddldepartment" DataSourceID="dsPopulateDepartment"
AutoPostBack="true" DataValueField="department" runat="server" Width="130px" Font-Size="11px"
AppendDataBoundItems="true">
    <asp:ListItem Text="All" Value="%"></asp:ListItem>
</asp:DropDownList>
<asp:SqlDataSource ID="dsPopulateDepartment" runat="server"
ConnectionString="<%$ ConnectionStrings:EvonetConnectionString %>" SelectCommand="SELECT
DISTINCT Department from [T_Employees]"></asp:SqlDataSource>

Buat daftar tarik-turun sebanyak bidang yang ingin Anda filter.

Beberapa hal yang perlu diperhatikan:

Setel properti AppendDataBoundItems=True untuk daftar dropdown Anda karena akan diisi saat runtime. Atur properti AutoPostBack=True sehingga Gridview di-refresh ketika pilihan berubah. Pastikan ListItem Anda untuk 'Semua' memiliki nilai '%'. Ekspresi filter Anda akan menjadi SELECT * FROM [TABLE NAME] Dimana [FieldName] seperti '{0}%' dengan {0} adalah nilai dalam daftar dropdown Anda. Jika daftar dropdown Anda disetel ke semua maka string kuerinya adalah SELECT * FROM [TABLE NAME] Dimana [FieldName] seperti '%%' yang, dalam SQL mengembalikan semua nilai.

Langkah 5: Tambahkan pemfilteran ke Sumber Data Gridview Anda

Tambahkan FilterExpress sehingga Sumber Data Gridview Anda seperti

[Field1] seperti '{0}%' dan [Field2] seperti '{1}%' dan [Field3] seperti '{2}%' dan [Field4] seperti '{3}%' dan … dll

Bidang Anda kemudian perlu ditambahkan ke bagian FilterParameters dalam urutan yang sama dengan ekspresi filter Anda. Bagian FilterParameters mereferensikan SelectedValue dari daftar dropdown Anda.

<asp:SqlDataSource ID="dsGridview" runat="server"
    ConnectionString="<%$ ConnectionStrings:EvonetConnectionString %>"
    SelectCommand="SELECT * FROM [T_Employees]" FilterExpression="Department like '{0}%'
    and Location like '{1}%'">
    <FilterParameters>
        <asp:ControlParameter Name="Department" ControlID="ddldepartment"
            PropertyName="SelectedValue" />
        <asp:ControlParameter Name="Location" ControlID="ddllocation"
            PropertyName="SelectedValue" />
    </FilterParameters>
</asp:SqlDataSource>

Itu dia!

person dr.    schedule 09.07.2009
comment
Dingin. Saya suka situsnya. Terima kasih! +1 - person Eric; 09.07.2009
comment
Tautan dalam jawaban mati - Situs ini tidak dapat dijangkau / alamat DNS server blog.evonet.com.au tidak dapat ditemukan - person Pang; 13.06.2017
comment
Saya menemukan entri blog di web.archive.org dan memperbarui jawaban saya dengan menempelkan teks utama dari Bartek Marnane - person dr.; 30.08.2017