NEWS

[DEVEXPRESS] Hướng dẫn custome popup filter date range trong Gridview

[DEVEXPRESS] Hướng dẫn custome popup filter date range trong Gridview
Đăng bởi: Thảo Meo - Lượt xem: 9287 09:20:18, 25/07/2018DEVEXPRESS   In bài viết

Bài viết hôm nay, mình sẽ hướng dẫn các bạn cách custom filter date range (từ ngày đến ngày) trong gridview của Devexpress.

Mình ví dụ, trong GridView của các bạn có ô ngày tháng, và bạn muốn filter từ ngày đến ngày trong Gridview.

Mặc định, Gridview chỉ cho phép chúng ta filter trong ngày, nên muốn chọn từ ngày đến ngày các bạn cần phải custom Gridview của Devexpress lại.

Dưới đây là giao diện filter trên ô ngày tháng, khi chưa custom.

custome popup filter gridview devexpress

Và giao diện, dưới đây là sau khi chúng ta đã custom lại có thêm ô Is Between (Bạn có thể chọn từ ngày đến ngày để filter dữ liệu trên gridview)

Filter date range gridview devexpress

Source code C#:

using DateRange;
using DevExpress.XtraEditors.Repository;
using System;
using System.Collections.Generic;
using System.ComponentModel;
using System.Data;
using System.Drawing;
using System.Linq;
using System.Text;
using System.Windows.Forms;

namespace RangeFilterGridView
{
    public partial class Form1 : DevExpress.XtraEditors.XtraForm
    {
        public Form1()
        {
            InitializeComponent();
        }
        RepositoryItemDateEdit riDateEdit = new RepositoryItemDateEdit();
        private void Form1_Load(object sender, EventArgs e)
        {
            DataTable dataTable = new DataTable();
            dataTable.Columns.Add("Ngày", typeof(DateTime));
            dataTable.Columns.Add("Data", typeof(string));
            int days = DateTime.DaysInMonth(2018, 07);
            for (int day = 1; day <= days; day++)
            {
                DateTime ngay = new DateTime(2018, 07, day);
                dataTable.Rows.Add(ngay, $"Ngày {day}");
            }


            myGridControl1.DataSource = dataTable;

            myGridView1.Columns["Ngày"].ColumnEdit = riDateEdit;
            myGridView1.Columns["Ngày"].OptionsFilter.FilterPopupMode = FilterPopupModeExtended.DateRange;
            myGridView1.Columns["Ngày"].OptionsFilter.UseFilterPopupRangeDateMode = true;
            myGridView1.OptionsFilter.ColumnFilterPopupMode = DevExpress.XtraGrid.Columns.ColumnFilterPopupMode.Classic;
        }
    }
}

Demo ứng dụng filter:

demo date range filter gridview devexpress

Để custome Gridview, các bạn có thể download component ở source code bên dưới nhé

Download

HAPPY CODING heart

Tags: gridview

THÔNG TIN TÁC GIẢ

BÀI VIẾT LIÊN QUAN

[DEVEXPRESS] Hướng dẫn custome popup filter date range trong Gridview
Đăng bởi: Thảo Meo - Lượt xem: 9287 09:20:18, 25/07/2018DEVEXPRESS   In bài viết

CÁC BÀI CÙNG CHỦ ĐỀ

Đọc tiếp
.