mirror of
https://github.com/rstudio/shiny.git
synced 2026-01-10 23:48:01 -05:00
257 lines
17 KiB
HTML
257 lines
17 KiB
HTML
<!DOCTYPE html>
|
|
<!-- Generated by pkgdown: do not edit by hand --><html lang="en"><head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8"><meta charset="utf-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>Create date range input — dateRangeInput • shiny</title><!-- jquery --><script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.7.1/jquery.min.js" integrity="sha512-v2CJ7UaYy4JwqLDIrZUI/4hqeoQieOmAZNXBeQyjo21dadnwR+8ZaIJVT8EE2iyI61OV8e6M8PP2/4hpQINQ/g==" crossorigin="anonymous" referrerpolicy="no-referrer"></script><!-- Bootstrap --><link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.4.1/css/bootstrap.min.css" integrity="sha256-bZLfwXAP04zRMK2BjiO8iu9pf4FbLqX6zitd+tIvLhE=" crossorigin="anonymous"><script src="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.4.1/js/bootstrap.min.js" integrity="sha256-nuL8/2cJ5NDSSwnKD8VqreErSWHtnEP9E7AySL+1ev4=" crossorigin="anonymous"></script><!-- bootstrap-toc --><link rel="stylesheet" href="../bootstrap-toc.css"><script src="../bootstrap-toc.js"></script><!-- Font Awesome icons --><link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.12.1/css/all.min.css" integrity="sha256-mmgLkCYLUQbXn0B1SRqzHar6dCnv9oZFPEC1g1cwlkk=" crossorigin="anonymous"><link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.12.1/css/v4-shims.min.css" integrity="sha256-wZjR52fzng1pJHwx4aV2AO3yyTOXrcDW7jBpJtTwVxw=" crossorigin="anonymous"><!-- clipboard.js --><script src="https://cdnjs.cloudflare.com/ajax/libs/clipboard.js/2.0.6/clipboard.min.js" integrity="sha256-inc5kl9MA1hkeYUt+EC3BhlIgyp/2jDIyBLS6k3UxPI=" crossorigin="anonymous"></script><!-- headroom.js --><script src="https://cdnjs.cloudflare.com/ajax/libs/headroom/0.11.0/headroom.min.js" integrity="sha256-AsUX4SJE1+yuDu5+mAVzJbuYNPHj/WroHuZ8Ir/CkE0=" crossorigin="anonymous"></script><script src="https://cdnjs.cloudflare.com/ajax/libs/headroom/0.11.0/jQuery.headroom.min.js" integrity="sha256-ZX/yNShbjqsohH1k95liqY9Gd8uOiE1S4vZc+9KQ1K4=" crossorigin="anonymous"></script><!-- pkgdown --><link href="../pkgdown.css" rel="stylesheet"><script src="../pkgdown.js"></script><meta property="og:title" content="Create date range input — dateRangeInput"><meta property="og:description" content="Creates a pair of text inputs which, when clicked on, bring up calendars that
|
|
the user can click on to select dates."><meta property="og:image" content="/logo.png"><!-- mathjax --><script src="https://cdnjs.cloudflare.com/ajax/libs/mathjax/2.7.5/MathJax.js" integrity="sha256-nvJJv9wWKEm88qvoQl9ekL2J+k/RWIsaSScxxlsrv8k=" crossorigin="anonymous"></script><script src="https://cdnjs.cloudflare.com/ajax/libs/mathjax/2.7.5/config/TeX-AMS-MML_HTMLorMML.js" integrity="sha256-84DKXVJXs0/F8OTMzX4UR909+jtl4G7SPypPavF+GfA=" crossorigin="anonymous"></script><!--[if lt IE 9]>
|
|
<script src="https://oss.maxcdn.com/html5shiv/3.7.3/html5shiv.min.js"></script>
|
|
<script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
|
|
<![endif]--></head><body data-spy="scroll" data-target="#toc">
|
|
|
|
|
|
<div class="container template-reference-topic">
|
|
<header><div class="navbar navbar-default navbar-fixed-top" role="navigation">
|
|
<div class="container">
|
|
<div class="navbar-header">
|
|
<button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar" aria-expanded="false">
|
|
<span class="sr-only">Toggle navigation</span>
|
|
<span class="icon-bar"></span>
|
|
<span class="icon-bar"></span>
|
|
<span class="icon-bar"></span>
|
|
</button>
|
|
<span class="navbar-brand">
|
|
<a class="navbar-link" href="../index.html">shiny</a>
|
|
<span class="version label label-default" data-toggle="tooltip" data-placement="bottom" title="">1.12.1</span>
|
|
</span>
|
|
</div>
|
|
|
|
<div id="navbar" class="navbar-collapse collapse">
|
|
<ul class="nav navbar-nav"><li>
|
|
<a href="../reference/index.html">Reference</a>
|
|
</li>
|
|
<li>
|
|
<a href="../news/index.html">Changelog</a>
|
|
</li>
|
|
</ul><ul class="nav navbar-nav navbar-right"><li>
|
|
<a href="https://github.com/rstudio/shiny/" class="external-link">
|
|
<span class="fab fa-github fa-lg"></span>
|
|
|
|
</a>
|
|
</li>
|
|
</ul></div><!--/.nav-collapse -->
|
|
</div><!--/.container -->
|
|
</div><!--/.navbar -->
|
|
|
|
|
|
|
|
</header><div class="row">
|
|
<div class="col-md-9 contents">
|
|
<div class="page-header">
|
|
<h1>Create date range input</h1>
|
|
<small class="dont-index">Source: <a href="https://github.com/rstudio/shiny/blob/rc-v1.12.1/R/input-daterange.R" class="external-link"><code>R/input-daterange.R</code></a></small>
|
|
<div class="hidden name"><code>dateRangeInput.Rd</code></div>
|
|
</div>
|
|
|
|
<div class="ref-description">
|
|
<p>Creates a pair of text inputs which, when clicked on, bring up calendars that
|
|
the user can click on to select dates.</p>
|
|
</div>
|
|
|
|
<div id="ref-usage">
|
|
<div class="sourceCode"><pre class="sourceCode r"><code><span><span class="fu">dateRangeInput</span><span class="op">(</span></span>
|
|
<span> <span class="va">inputId</span>,</span>
|
|
<span> <span class="va">label</span>,</span>
|
|
<span> start <span class="op">=</span> <span class="cn">NULL</span>,</span>
|
|
<span> end <span class="op">=</span> <span class="cn">NULL</span>,</span>
|
|
<span> min <span class="op">=</span> <span class="cn">NULL</span>,</span>
|
|
<span> max <span class="op">=</span> <span class="cn">NULL</span>,</span>
|
|
<span> format <span class="op">=</span> <span class="st">"yyyy-mm-dd"</span>,</span>
|
|
<span> startview <span class="op">=</span> <span class="st">"month"</span>,</span>
|
|
<span> weekstart <span class="op">=</span> <span class="fl">0</span>,</span>
|
|
<span> language <span class="op">=</span> <span class="st">"en"</span>,</span>
|
|
<span> separator <span class="op">=</span> <span class="st">" to "</span>,</span>
|
|
<span> width <span class="op">=</span> <span class="cn">NULL</span>,</span>
|
|
<span> autoclose <span class="op">=</span> <span class="cn">TRUE</span></span>
|
|
<span><span class="op">)</span></span></code></pre></div>
|
|
</div>
|
|
|
|
<div id="arguments">
|
|
<h2>Arguments</h2>
|
|
|
|
|
|
<dl><dt id="arg-inputid">inputId<a class="anchor" aria-label="anchor" href="#arg-inputid"></a></dt>
|
|
<dd><p>The <code>input</code> slot that will be used to access the value.</p></dd>
|
|
|
|
|
|
<dt id="arg-label">label<a class="anchor" aria-label="anchor" href="#arg-label"></a></dt>
|
|
<dd><p>Display label for the control, or <code>NULL</code> for no label.</p></dd>
|
|
|
|
|
|
<dt id="arg-start">start<a class="anchor" aria-label="anchor" href="#arg-start"></a></dt>
|
|
<dd><p>The initial start date. Either a Date object, or a string in
|
|
<code>yyyy-mm-dd</code> format. If NULL (the default), will use the current
|
|
date in the client's time zone.</p></dd>
|
|
|
|
|
|
<dt id="arg-end">end<a class="anchor" aria-label="anchor" href="#arg-end"></a></dt>
|
|
<dd><p>The initial end date. Either a Date object, or a string in
|
|
<code>yyyy-mm-dd</code> format. If NULL (the default), will use the current
|
|
date in the client's time zone.</p></dd>
|
|
|
|
|
|
<dt id="arg-min">min<a class="anchor" aria-label="anchor" href="#arg-min"></a></dt>
|
|
<dd><p>The minimum allowed date. Either a Date object, or a string in
|
|
<code>yyyy-mm-dd</code> format.</p></dd>
|
|
|
|
|
|
<dt id="arg-max">max<a class="anchor" aria-label="anchor" href="#arg-max"></a></dt>
|
|
<dd><p>The maximum allowed date. Either a Date object, or a string in
|
|
<code>yyyy-mm-dd</code> format.</p></dd>
|
|
|
|
|
|
<dt id="arg-format">format<a class="anchor" aria-label="anchor" href="#arg-format"></a></dt>
|
|
<dd><p>The format of the date to display in the browser. Defaults to
|
|
<code>"yyyy-mm-dd"</code>.</p></dd>
|
|
|
|
|
|
<dt id="arg-startview">startview<a class="anchor" aria-label="anchor" href="#arg-startview"></a></dt>
|
|
<dd><p>The date range shown when the input object is first clicked.
|
|
Can be "month" (the default), "year", or "decade".</p></dd>
|
|
|
|
|
|
<dt id="arg-weekstart">weekstart<a class="anchor" aria-label="anchor" href="#arg-weekstart"></a></dt>
|
|
<dd><p>Which day is the start of the week. Should be an integer
|
|
from 0 (Sunday) to 6 (Saturday).</p></dd>
|
|
|
|
|
|
<dt id="arg-language">language<a class="anchor" aria-label="anchor" href="#arg-language"></a></dt>
|
|
<dd><p>The language used for month and day names. Default is "en".
|
|
Other valid values include "ar", "az", "bg", "bs", "ca", "cs", "cy", "da",
|
|
"de", "el", "en-AU", "en-GB", "eo", "es", "et", "eu", "fa", "fi", "fo",
|
|
"fr-CH", "fr", "gl", "he", "hr", "hu", "hy", "id", "is", "it-CH", "it",
|
|
"ja", "ka", "kh", "kk", "ko", "kr", "lt", "lv", "me", "mk", "mn", "ms",
|
|
"nb", "nl-BE", "nl", "no", "pl", "pt-BR", "pt", "ro", "rs-latin", "rs",
|
|
"ru", "sk", "sl", "sq", "sr-latin", "sr", "sv", "sw", "th", "tr", "uk",
|
|
"vi", "zh-CN", and "zh-TW".</p></dd>
|
|
|
|
|
|
<dt id="arg-separator">separator<a class="anchor" aria-label="anchor" href="#arg-separator"></a></dt>
|
|
<dd><p>String to display between the start and end input boxes.</p></dd>
|
|
|
|
|
|
<dt id="arg-width">width<a class="anchor" aria-label="anchor" href="#arg-width"></a></dt>
|
|
<dd><p>The width of the input, e.g. <code>'400px'</code>, or <code>'100%'</code>;
|
|
see <code><a href="https://rstudio.github.io/htmltools/reference/validateCssUnit.html" class="external-link">validateCssUnit()</a></code>.</p></dd>
|
|
|
|
|
|
<dt id="arg-autoclose">autoclose<a class="anchor" aria-label="anchor" href="#arg-autoclose"></a></dt>
|
|
<dd><p>Whether or not to close the datepicker immediately when a
|
|
date is selected.</p></dd>
|
|
|
|
</dl></div>
|
|
<div id="details">
|
|
<h2>Details</h2>
|
|
<p>The date <code>format</code> string specifies how the date will be displayed in
|
|
the browser. It allows the following values:</p>
|
|
<ul><li><p><code>yy</code> Year without century (12)</p></li>
|
|
<li><p><code>yyyy</code> Year with century (2012)</p></li>
|
|
<li><p><code>mm</code> Month number, with leading zero (01-12)</p></li>
|
|
<li><p><code>m</code> Month number, without leading zero (1-12)</p></li>
|
|
<li><p><code>M</code> Abbreviated month name</p></li>
|
|
<li><p><code>MM</code> Full month name</p></li>
|
|
<li><p><code>dd</code> Day of month with leading zero</p></li>
|
|
<li><p><code>d</code> Day of month without leading zero</p></li>
|
|
<li><p><code>D</code> Abbreviated weekday name</p></li>
|
|
<li><p><code>DD</code> Full weekday name</p></li>
|
|
</ul></div>
|
|
<div id="server-value">
|
|
<h2>Server value</h2>
|
|
|
|
|
|
<p>A <a href="https://rdrr.io/r/base/Dates.html" class="external-link">Date</a> vector of length 2.</p>
|
|
</div>
|
|
<div id="see-also">
|
|
<h2>See also</h2>
|
|
<div class="dont-index"><p><code><a href="dateInput.html">dateInput()</a></code>, <code><a href="updateDateRangeInput.html">updateDateRangeInput()</a></code></p>
|
|
<p>Other input elements:
|
|
<code><a href="actionButton.html">actionButton()</a></code>,
|
|
<code><a href="checkboxGroupInput.html">checkboxGroupInput()</a></code>,
|
|
<code><a href="checkboxInput.html">checkboxInput()</a></code>,
|
|
<code><a href="dateInput.html">dateInput()</a></code>,
|
|
<code><a href="fileInput.html">fileInput()</a></code>,
|
|
<code><a href="numericInput.html">numericInput()</a></code>,
|
|
<code><a href="passwordInput.html">passwordInput()</a></code>,
|
|
<code><a href="radioButtons.html">radioButtons()</a></code>,
|
|
<code><a href="selectInput.html">selectInput()</a></code>,
|
|
<code><a href="sliderInput.html">sliderInput()</a></code>,
|
|
<code><a href="submitButton.html">submitButton()</a></code>,
|
|
<code><a href="textAreaInput.html">textAreaInput()</a></code>,
|
|
<code><a href="textInput.html">textInput()</a></code>,
|
|
<code><a href="varSelectInput.html">varSelectInput()</a></code></p></div>
|
|
</div>
|
|
|
|
<div id="ref-examples">
|
|
<h2>Examples</h2>
|
|
<div class="sourceCode"><pre class="sourceCode r"><code><span class="r-in"><span><span class="co">## Only run examples in interactive R sessions</span></span></span>
|
|
<span class="r-in"><span><span class="kw">if</span> <span class="op">(</span><span class="fu"><a href="https://rdrr.io/r/base/interactive.html" class="external-link">interactive</a></span><span class="op">(</span><span class="op">)</span><span class="op">)</span> <span class="op">{</span></span></span>
|
|
<span class="r-in"><span></span></span>
|
|
<span class="r-in"><span><span class="va">ui</span> <span class="op"><-</span> <span class="fu"><a href="fluidPage.html">fluidPage</a></span><span class="op">(</span></span></span>
|
|
<span class="r-in"><span> <span class="fu">dateRangeInput</span><span class="op">(</span><span class="st">"daterange1"</span>, <span class="st">"Date range:"</span>,</span></span>
|
|
<span class="r-in"><span> start <span class="op">=</span> <span class="st">"2001-01-01"</span>,</span></span>
|
|
<span class="r-in"><span> end <span class="op">=</span> <span class="st">"2010-12-31"</span><span class="op">)</span>,</span></span>
|
|
<span class="r-in"><span></span></span>
|
|
<span class="r-in"><span> <span class="co"># Default start and end is the current date in the client's time zone</span></span></span>
|
|
<span class="r-in"><span> <span class="fu">dateRangeInput</span><span class="op">(</span><span class="st">"daterange2"</span>, <span class="st">"Date range:"</span><span class="op">)</span>,</span></span>
|
|
<span class="r-in"><span></span></span>
|
|
<span class="r-in"><span> <span class="co"># start and end are always specified in yyyy-mm-dd, even if the display</span></span></span>
|
|
<span class="r-in"><span> <span class="co"># format is different</span></span></span>
|
|
<span class="r-in"><span> <span class="fu">dateRangeInput</span><span class="op">(</span><span class="st">"daterange3"</span>, <span class="st">"Date range:"</span>,</span></span>
|
|
<span class="r-in"><span> start <span class="op">=</span> <span class="st">"2001-01-01"</span>,</span></span>
|
|
<span class="r-in"><span> end <span class="op">=</span> <span class="st">"2010-12-31"</span>,</span></span>
|
|
<span class="r-in"><span> min <span class="op">=</span> <span class="st">"2001-01-01"</span>,</span></span>
|
|
<span class="r-in"><span> max <span class="op">=</span> <span class="st">"2012-12-21"</span>,</span></span>
|
|
<span class="r-in"><span> format <span class="op">=</span> <span class="st">"mm/dd/yy"</span>,</span></span>
|
|
<span class="r-in"><span> separator <span class="op">=</span> <span class="st">" - "</span><span class="op">)</span>,</span></span>
|
|
<span class="r-in"><span></span></span>
|
|
<span class="r-in"><span> <span class="co"># Pass in Date objects</span></span></span>
|
|
<span class="r-in"><span> <span class="fu">dateRangeInput</span><span class="op">(</span><span class="st">"daterange4"</span>, <span class="st">"Date range:"</span>,</span></span>
|
|
<span class="r-in"><span> start <span class="op">=</span> <span class="fu"><a href="https://rdrr.io/r/base/Sys.time.html" class="external-link">Sys.Date</a></span><span class="op">(</span><span class="op">)</span><span class="op">-</span><span class="fl">10</span>,</span></span>
|
|
<span class="r-in"><span> end <span class="op">=</span> <span class="fu"><a href="https://rdrr.io/r/base/Sys.time.html" class="external-link">Sys.Date</a></span><span class="op">(</span><span class="op">)</span><span class="op">+</span><span class="fl">10</span><span class="op">)</span>,</span></span>
|
|
<span class="r-in"><span></span></span>
|
|
<span class="r-in"><span> <span class="co"># Use different language and different first day of week</span></span></span>
|
|
<span class="r-in"><span> <span class="fu">dateRangeInput</span><span class="op">(</span><span class="st">"daterange5"</span>, <span class="st">"Date range:"</span>,</span></span>
|
|
<span class="r-in"><span> language <span class="op">=</span> <span class="st">"de"</span>,</span></span>
|
|
<span class="r-in"><span> weekstart <span class="op">=</span> <span class="fl">1</span><span class="op">)</span>,</span></span>
|
|
<span class="r-in"><span></span></span>
|
|
<span class="r-in"><span> <span class="co"># Start with decade view instead of default month view</span></span></span>
|
|
<span class="r-in"><span> <span class="fu">dateRangeInput</span><span class="op">(</span><span class="st">"daterange6"</span>, <span class="st">"Date range:"</span>,</span></span>
|
|
<span class="r-in"><span> startview <span class="op">=</span> <span class="st">"decade"</span><span class="op">)</span></span></span>
|
|
<span class="r-in"><span><span class="op">)</span></span></span>
|
|
<span class="r-in"><span></span></span>
|
|
<span class="r-in"><span><span class="fu"><a href="shinyApp.html">shinyApp</a></span><span class="op">(</span><span class="va">ui</span>, server <span class="op">=</span> <span class="kw">function</span><span class="op">(</span><span class="va">input</span>, <span class="va">output</span><span class="op">)</span> <span class="op">{</span> <span class="op">}</span><span class="op">)</span></span></span>
|
|
<span class="r-in"><span><span class="op">}</span></span></span>
|
|
<span class="r-in"><span></span></span>
|
|
</code></pre></div>
|
|
</div>
|
|
</div>
|
|
<div class="col-md-3 hidden-xs hidden-sm" id="pkgdown-sidebar">
|
|
<nav id="toc" data-toggle="toc" class="sticky-top"><h2 data-toc-skip>Contents</h2>
|
|
</nav></div>
|
|
</div>
|
|
|
|
|
|
<footer><div class="copyright">
|
|
<p></p><p>Developed by Winston Chang, Joe Cheng, JJ Allaire, Carson Sievert, Barret Schloerke, Garrick Aden-Buie, Yihui Xie, Jeff Allen, Jonathan McPherson, Alan Dipert, Barbara Borges, Posit Software, PBC.</p>
|
|
</div>
|
|
|
|
<div class="pkgdown">
|
|
<p></p><p>Site built with <a href="https://pkgdown.r-lib.org/" class="external-link">pkgdown</a> 2.2.0.</p>
|
|
</div>
|
|
|
|
</footer></div>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
</body></html>
|
|
|