Skip to content

SEO-2778 React DateTime Picker External Linking #1

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
wants to merge 3 commits into
base: main
Choose a base branch
from
Open
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension


Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
38 changes: 38 additions & 0 deletions .github/workflows/gitleaks.yaml
Original file line number Diff line number Diff line change
@@ -0,0 +1,38 @@
name: Secret Value found!
on:
push:
public:
jobs:
scan:
name: gitleaks
runs-on: ubuntu-latest
steps:
- name: Checkout
uses: actions/checkout@v3
- name: Install the gitleaks
run: wget https://github.com/zricethezav/gitleaks/releases/download/v8.15.2/gitleaks_8.15.2_linux_x64.tar.gz
shell: pwsh
- name: Extract the tar file
run: tar xzvf gitleaks_8.15.2_linux_x64.tar.gz
- name: Generate the report
id: gitleaks
run: $GITHUB_WORKSPACE/gitleaks detect -s $GITHUB_WORKSPACE -f json -r $GITHUB_WORKSPACE/leaksreport.json
shell: bash
continue-on-error: true
- name: Setup NuGet.exe
if: steps.gitleaks.outcome != 'success'
uses: nuget/setup-nuget@v1
with:
nuget-version: latest
- name: Install the dotnet
if: steps.gitleaks.outcome != 'success'
uses: actions/setup-dotnet@v3
with:
dotnet-version: '3.1.x'
- name: Install the report tool packages
if: steps.gitleaks.outcome != 'success'
run: |
nuget install "Syncfusion.Email" -source "https://nexus.syncfusion.com/repository/nuget-hosted/"
dir $GITHUB_WORKSPACE/Syncfusion.Email.1.0.0/lib/netcoreapp3.1
dotnet $GITHUB_WORKSPACE/Syncfusion.Email.1.0.0/lib/netcoreapp3.1/Email.dll "citeam@syncfusion.com" "$GITHUB_REF_NAME" ${{ secrets.NETWORKCREDENTIALS }} ${{ secrets.NETWORKKEY }} "$GITHUB_WORKSPACE"
exit 1
69 changes: 63 additions & 6 deletions README.md
Original file line number Diff line number Diff line change
@@ -1,13 +1,70 @@
# Getting Started with the React DateTime Picker in 5 Minutes

A quick-start project that helps you to create a new React application using Create React App toolchain and add the React DateTime picker to it. This project contains simple code customizations, as well as some important features like setting specific date time values, formats and range restriction for date time selection.

Documentation: https://ej2.syncfusion.com/react/documentation/datetimepicker/getting-started/

Online examples: https://ej2.syncfusion.com/react/demos/#/material/datetimepicker/default
The [React DateTime Picker](https://www.syncfusion.com/react-components/react-datetime-picker?utm_source=github&utm_medium=listing&utm_campaign=react-datetime-picker-github-samples) is a lightweight and mobile-friendly component that allows end users to enter or select date and time values from a pop-up calendar and drop-down time list. A quick-start project that helps you to create a new React application using Create React App toolchain and add the React DateTime picker to it. This project contains simple code customizations, as well as some important features like setting specific date time values, formats and range restriction for date time selection.

## Project prerequisites
Make sure that you have the lastest versions of NodeJS and visual studio code in your machine before starting to work on this project.

## How to run this application?
To run this application, you need to clone the `getting-started-with-the-react-datetime-picker-in-5-minutes` repository and then open it in Visual Studio Code. Now, simply install all the necessary react packages into your current project using `npm install` command and run your project using the `npm start` command.
To run this application, you need to clone the `getting-started-with-the-react-datetime-picker-in-5-minutes` repository and then open it in Visual Studio Code. Now, simply install all the necessary react packages into your current project using `npm install` command and run your project using the `npm start` command.

## Features and Benefits

## Masked date-time input

Allows users to enter valid dates and times in the correct format and avoid data input errors during data entry.

## Custom date and time format

The DateTime Picker allows users to format the display of time and date, and also set custom time and date formats in the text box to improve readability.

## Date and time range

Restrict the React Date Time Picker, so that only date and time values within a specific range can be entered or selected in React Date Picker by specifying the min and max date time options.

## Disable dates

Disable any date in the React DateTime Picker to show it as an inactive date. Easily prevent weekends and holidays from selection by disabling them in the pop-up calendar.

## DateTime Picker in multiple languages

Extract a specific culture, datetime format, and first day of the week, and translate the names of months, days, and today button text to the current culture with globalization feature in react calendar component.

## Date and time validation

Allow only valid values to be entered in the React DateTime Picker component's input by validating them with disabled, out-of-min, and out-of-max date-time.

## Related links
[Learn More about React DateTime Picker](https://www.syncfusion.com/react-components/react-datetime-picker?utm_source=github&utm_medium=listing&utm_campaign=react-datetime-picker-github-samples)

[Download Free Trial](https://www.syncfusion.com/downloads/react?utm_source=github&utm_medium=listing&utm_campaign=react-datetime-picker-github-samples)

[Pricing](https://www.syncfusion.com/sales/products/react?utm_source=github&utm_medium=listing&utm_campaign=react-datetime-picker-github-samples)

[Documentation](https://ej2.syncfusion.com/react/documentation/datetimepicker/getting-started/?utm_source=github&utm_medium=listing&utm_campaign=react-datetime-picker-github-samples)

[View Demos](https://github.com/SyncfusionExamples/getting-started-with-the-react-datetime-picker-in-5-minutes?utm_source=github&utm_medium=listing&utm_campaign=react-datetime-picker-github-samples)

[Community Forums](https://www.syncfusion.com/forums/react-components?utm_source=github&utm_medium=listing&utm_campaign=react-datetime-picker-github-samples)

[Suggest a feature or report a bug](https://www.syncfusion.com/feedback/react?utm_source=github&utm_medium=listing&utm_campaign=react-datetime-picker-github-samples)

[Online example](https://ej2.syncfusion.com/react/demos/#/material/datetimepicker/default?utm_source=github&utm_medium=listing&utm_campaign=react-datetime-picker-github-samples)

[Knowledge base](https://www.syncfusion.com/kb/react-components?utm_source=github&utm_medium=listing&utm_campaign=react-datetime-picker-github-samples)


## About Syncfusion React UI Components

Syncfusion's [React UI Components](https://www.syncfusion.com/react-components?utm_source=github&utm_medium=listing&utm_campaign=react-datetime-picker-github-samples) library is the only suite that you will ever need to build an application since it contains over 80 high-performance, lightweight, modular, and responsive UI Components in a single package. In addition to datetime-picker, we provide popular React Components such as [DataGrid](https://www.syncfusion.com/react-components/react-data-grid?utm_source=github&utm_medium=listing&utm_campaign=react-datetime-picker-github-samples), [Charts](https://www.syncfusion.com/react-components/react-charts?utm_source=github&utm_medium=listing&utm_campaign=react-datetime-picker-github-samples), [Scheduler](https://www.syncfusion.com/react-components/react-scheduler?utm_source=github&utm_medium=listing&utm_campaign=react-datetime-picker-github-samples), [Diagram](https://www.syncfusion.com/react-components/react-diagram?utm_source=github&utm_medium=listing&utm_campaign=react-datetime-picker-github-samples), and [Word Processor](https://www.syncfusion.com/react-components/react-word-processor?utm_source=github&utm_medium=listing&utm_campaign=react-datetime-picker-github-samples).

### About Syncfusion
Founded in 2001 and headquartered in Research Triangle Park, N.C., Syncfusion has more than 29,000 customers and more than 1 million users, including large financial institutions, Fortune 500 companies, and global IT consultancies.

Today, we provide 1700+ components and frameworks for web ([Blazor](https://www.syncfusion.com/blazor-components?utm_source=github&utm_medium=listing&utm_campaign=react-datetime-picker-github-samples), [ASP.NET Core](https://www.syncfusion.com/aspnet-core-ui-controls?utm_source=github&utm_medium=listing&utm_campaign=react-datetime-picker-github-samples), [ASP.NET MVC](https://www.syncfusion.com/aspnet-mvc-ui-controls?utm_source=github&utm_medium=listing&utm_campaign=react-datetime-picker-github-samples), [ASP.NET WebForms](https://www.syncfusion.com/jquery/aspnet-webforms-ui-controls?utm_source=github&utm_medium=listing&utm_campaign=react-datetime-picker-github-samples), [JavaScript](https://www.syncfusion.com/javascript-ui-controls?utm_source=github&utm_medium=listing&utm_campaign=react-datetime-picker-github-samples), [react](https://www.syncfusion.com/react-components?utm_source=github&utm_medium=listing&utm_campaign=react-datetime-picker-github-samples), [React](https://www.syncfusion.com/react-components?utm_source=github&utm_medium=listing&utm_campaign=react-datetime-picker-github-samples), [Vue](https://www.syncfusion.com/vue-components?utm_source=github&utm_medium=listing&utm_campaign=react-datetime-picker-github-samples), and [Flutter](https://www.syncfusion.com/flutter-widgets?utm_source=github&utm_medium=listing&utm_campaign=react-datetime-picker-github-samples)), mobile ([Xamarin](https://www.syncfusion.com/xamarin-ui-controls?utm_source=github&utm_medium=listing&utm_campaign=react-datetime-picker-github-samples), [Flutter](https://www.syncfusion.com/flutter-widgets?utm_source=github&utm_medium=listing&utm_campaign=react-datetime-picker-github-samples), [UWP](https://www.syncfusion.com/uwp-ui-controls?utm_source=github&utm_medium=listing&utm_campaign=react-datetime-picker-github-samples), [JavaScript](https://www.syncfusion.com/javascript-ui-controls?utm_source=github&utm_medium=listing&utm_campaign=react-datetime-picker-github-samples), and [.NET MAUI](https://www.syncfusion.com/maui-controls?utm_source=github&utm_medium=listing&utm_campaign=react-datetime-picker-github-samples)), and desktop development ([WinForms](https://www.syncfusion.com/winforms-ui-controls?utm_source=github&utm_medium=listing&utm_campaign=react-datetime-picker-github-samples), [WPF](https://www.syncfusion.com/wpf-controls?utm_source=github&utm_medium=listing&utm_campaign=react-datetime-picker-github-samples), [WinUI](https://www.syncfusion.com/winui-controls?utm_source=github&utm_medium=listing&utm_campaign=react-datetime-picker-github-samples),[UWP](https://www.syncfusion.com/uwp-ui-controls?utm_source=github&utm_medium=listing&utm_campaign=react-datetime-picker-github-samples), [Flutter](https://www.syncfusion.com/flutter-widgets?utm_source=github&utm_medium=listing&utm_campaign=react-datetime-picker-github-samples), and [.NET MAUI](https://www.syncfusion.com/maui-controls?utm_source=github&utm_medium=listing&utm_campaign=react-datetime-picker-github-samples)). We provide ready-to-deploy enterprise software for dashboards, reports, data integration, and big data processing. Many customers have saved millions in licensing fees by deploying our software.

<hr style="height:0.3px;border:none;color:lightgrey;background-color:lightgrey;" />

<p align="center">
<a href="mailto:sales@syncfusion.com?Subject=Syncfusion React DateTime Picker - GitHub" target="_top">sales@syncfusion.com</a> | <a href="https://www.syncfusion.com?utm_source=github&utm_medium=listing&utm_campaign=react-datetime-picker-github-samples">www.syncfusion.com</a> | Toll Free: 1-888-9 DOTNET <br>
</p>