Files
shiny/reference/submitButton.html
2025-06-19 15:31:31 +00:00

172 lines
12 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 a submit button — submitButton • 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 a submit button — submitButton"><meta property="og:description" content="Create a submit button for an app. Apps that include a submit
button do not automatically update their outputs when inputs change,
rather they wait until the user explicitly clicks the submit button.
The use of submitButton is generally discouraged in favor of
the more versatile actionButton() (see details below)."><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.10.0.9001</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 a submit button</h1>
<small class="dont-index">Source: <a href="https://github.com/rstudio/shiny/blob/main/R/input-submit.R" class="external-link"><code>R/input-submit.R</code></a></small>
<div class="hidden name"><code>submitButton.Rd</code></div>
</div>
<div class="ref-description">
<p>Create a submit button for an app. Apps that include a submit
button do not automatically update their outputs when inputs change,
rather they wait until the user explicitly clicks the submit button.
The use of <code>submitButton</code> is generally discouraged in favor of
the more versatile <code><a href="actionButton.html">actionButton()</a></code> (see details below).</p>
</div>
<div id="ref-usage">
<div class="sourceCode"><pre class="sourceCode r"><code><span><span class="fu">submitButton</span><span class="op">(</span>text <span class="op">=</span> <span class="st">"Apply Changes"</span>, icon <span class="op">=</span> <span class="cn">NULL</span>, width <span class="op">=</span> <span class="cn">NULL</span><span class="op">)</span></span></code></pre></div>
</div>
<div id="arguments">
<h2>Arguments</h2>
<dl><dt id="arg-text">text<a class="anchor" aria-label="anchor" href="#arg-text"></a></dt>
<dd><p>Button caption</p></dd>
<dt id="arg-icon">icon<a class="anchor" aria-label="anchor" href="#arg-icon"></a></dt>
<dd><p>Optional <code><a href="icon.html">icon()</a></code> to appear on the button</p></dd>
<dt id="arg-width">width<a class="anchor" aria-label="anchor" href="#arg-width"></a></dt>
<dd><p>The width of the button, 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>
</dl></div>
<div id="value">
<h2>Value</h2>
<p>A submit button that can be added to a UI definition.</p>
</div>
<div id="details">
<h2>Details</h2>
<p>Submit buttons are unusual Shiny inputs, and we recommend using
<code><a href="actionButton.html">actionButton()</a></code> instead of <code>submitButton</code> when you
want to delay a reaction.
See <a href="https://shiny.rstudio.com/articles/action-buttons.html" class="external-link">this article</a> for more information (including a demo of how to "translate"
code using a <code>submitButton</code> to code using an <code>actionButton</code>).</p>
<p>In essence, the presence of a submit button stops all inputs from
sending their values automatically to the server. This means, for
instance, that if there are <em>two</em> submit buttons in the same app,
clicking either one will cause all inputs in the app to send their
values to the server. This is probably not what you'd want, which is
why submit button are unwieldy for all but the simplest apps. There
are other problems with submit buttons: for example, dynamically
created submit buttons (for example, with <code><a href="renderUI.html">renderUI()</a></code>
or <code><a href="insertUI.html">insertUI()</a></code>) will not work.</p>
</div>
<div id="see-also">
<h2>See also</h2>
<div class="dont-index"><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="dateRangeInput.html">dateRangeInput</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="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="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="fu"><a href="shinyApp.html">shinyApp</a></span><span class="op">(</span></span></span>
<span class="r-in"><span> ui <span class="op">=</span> <span class="fu"><a href="bootstrapPage.html">basicPage</a></span><span class="op">(</span></span></span>
<span class="r-in"><span> <span class="fu"><a href="numericInput.html">numericInput</a></span><span class="op">(</span><span class="st">"num"</span>, label <span class="op">=</span> <span class="st">"Make changes"</span>, value <span class="op">=</span> <span class="fl">1</span><span class="op">)</span>,</span></span>
<span class="r-in"><span> <span class="fu">submitButton</span><span class="op">(</span><span class="st">"Update View"</span>, <span class="fu"><a href="icon.html">icon</a></span><span class="op">(</span><span class="st">"refresh"</span><span class="op">)</span><span class="op">)</span>,</span></span>
<span class="r-in"><span> <span class="fu"><a href="helpText.html">helpText</a></span><span class="op">(</span><span class="st">"When you click the button above, you should see"</span>,</span></span>
<span class="r-in"><span> <span class="st">"the output below update to reflect the value you"</span>,</span></span>
<span class="r-in"><span> <span class="st">"entered at the top:"</span><span class="op">)</span>,</span></span>
<span class="r-in"><span> <span class="fu"><a href="textOutput.html">verbatimTextOutput</a></span><span class="op">(</span><span class="st">"value"</span><span class="op">)</span></span></span>
<span class="r-in"><span> <span class="op">)</span>,</span></span>
<span class="r-in"><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></span>
<span class="r-in"><span></span></span>
<span class="r-in"><span> <span class="co"># submit buttons do not have a value of their own,</span></span></span>
<span class="r-in"><span> <span class="co"># they control when the app accesses values of other widgets.</span></span></span>
<span class="r-in"><span> <span class="co"># input$num is the value of the number widget.</span></span></span>
<span class="r-in"><span> <span class="va">output</span><span class="op">$</span><span class="va">value</span> <span class="op">&lt;-</span> <span class="fu"><a href="renderPrint.html">renderPrint</a></span><span class="op">(</span><span class="op">{</span> <span class="va">input</span><span class="op">$</span><span class="va">num</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 class="op">)</span></span></span>
<span class="r-in"><span><span class="op">}</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, 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.1.3.</p>
</div>
</footer></div>
</body></html>