# Date Columns

For date columns you can use `daterangepicker` as a filter instead of the normal free-text input. Note that you must import all the dependencies (JQuery + moment.js + daterangepicker) **GLOBALLY**, i.e on the `window` scope. You can check if this is so by typing `typeof $().daterangepicker` in the console. If it returns function you are good to go. To tell the plugin which columns should be treated as date columns use the `dateColumns` option. (E.g: `dateColumns:['created_at','executed_at']`).

For the client component the date must be rendered as a `moment` object for the filtering to work. You can use the `toMomentFormat` helper option to do that for you. It accepts the current format of the dates in your dataset, and uses it to convert those dates to moment objects. E.g, if you have a `created_at` column with a date like 2017-12-31, you can use `toMomentFormat: 'YYYY-MM-DD'`. To determine the presentation of the dates use the `dateFormat` option.

On the server component the filter will be sent along with the request in the following format:

```javascript
{
    query:{
        created_at:{
            start: '2010-12-31 00:00:00',
            end: '2011-12-31 00:00:00'       
        }
    }
}
```

Date presentation on the server component is completely up to you. If you are unable to control the server response, you can use the `templates` option to "massage" the date you get from the server into the desired format.


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://matanya.gitbook.io/vue-tables-2/date-columns.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.
