闪亮R:警报消息或模态对话框输入:无效

时间:2017-10-05 22:45:03

标签: html css r validation shiny

我正在开发一个简单的应用程序,我希望它创建一个弹出窗口,以防一些输入无效。在#1656中的链接响应之后,我有以下示例,在输入无效的情况下允许一些漂亮的背景颜色(对于我的300个变量):

library(shiny)

ui <- fluidPage(
  tags$style(HTML("
    input:invalid {
  background-color: #FFCCCC;
                  }")),

  numericInput("myValue", "My Variable", min = 0, max = 1, value = 0.5),
  numericInput("myValue2", "My Variable2", min = 0, max = 3, step = 0.5, value = 0.5),
  textOutput("text"),
  textOutput("text2")
)

server <- function(input, output) {
  output$text <- renderText(input$myValue)
  output$text2 <- renderText(input$myValue2)
}

shinyApp(ui, server)

标签tags$style("input:invalid{ ... }")),有很多帮助,但我希望有一个引导警报,而不仅仅是更改背景颜色。

基本上,我需要以某种方式在input:invalid{}以下的div类中(我要检查300个变量):

<div class="alert alert-danger">
  <strong>Danger!</strong> Indicates a dangerous or potentially negative action.
</div>

我很高兴听到一些建议。

2 个答案:

答案 0 :(得分:1)

修改:以下是基于this answer的无效条目提醒的示例。一旦用户点击输入框(blur)或用户完成输入(keyup)后,就可以触发警报。 #!/usr/bin/perl use warnings; use strict; sub menu { my $args = shift; my $title = $args->{title}; my $choices = $args->{choices}; while (1) { print "--------------------\n"; print "$title\n"; print "--------------------\n"; for (my $i = 1; $i <= scalar(@$choices); $i++) { my $itemHeading = $choices->[$i-1][0]; print "$i.\t $itemHeading\n"; } print "\n?: "; my $i = <STDIN>; chomp $i; if ($i && $i =~ m/[0-9]+/ && $i <= scalar(@$choices)) { &{$choices->[$i-1][1]}(); } else { print "\nInvalid input.\n\n"; } } } my $menus = {}; $menus = { "1" => { "title" => "Menu 1 header", "choices" => [ [ "Create file " , sub { print "Name of file you want to create: "; my $createFile = <STDIN>; open my $fh, ">>", "$createFile" or die "can't open\n"; print $fh "Here's that file you ordered\n"; close $fh; print "done\n"; }], [ "Rename a file" , sub { print "What file do you want to rename (add ext): "; my $oldName = <STDIN>; print "What do you want to rename it: "; my $newName = <STDIN>; }], [ "Copy file" , sub { print "What file do you want to copy: " my $copyFile = <STDIN>; print "What do you want to call this file: :"; my $newFile = <STDIN>; copy "$copyFile" , "$newFile" || die "can't copy"; }], [ "Remove file" , sub { print "Which file do you want to remove"; my removeF = <STDIN>; open my $fh; unlink "$removeF"; }], }, }; menu($menus->{1}); 对此示例可能更有用。

keyup

以下是一些选项:

  1. 闪亮:modalDialogshowNotification

  2. shinyjs:alert

  3. shinyBS:bsAlert ---尝试运行library(shiny) alert <- '$(document).ready(function() { $(function () { $("input").keyup(function () { if ($(this).is(":invalid")) { alert(\'invalid!\'); } }); }); })' ui <- fluidPage( tags$head(tags$script(HTML(alert))), tags$style(HTML(" input:invalid { background-color: #FFCCCC; }")), numericInput("myValue", "My Variable", min = 0, max = 1, value = 0.5), numericInput("myValue2", "My Variable2", min = 0, max = 3, step = 0.5, value = 0.5), textOutput("text"), textOutput("text2") ) server <- function(input, output) { output$text <- renderText(input$myValue) output$text2 <- renderText(input$myValue2) } shinyApp(ui, server) 作为示例

  4. 以下是您的示例应用,其中包含这些功能的示例。请注意,bsExamples("Alerts")shinyjs需要向ui和服务器添加语句,但shinyBS只需要在服务器上添加语句。 modalDialog也需要包含在session的服务器功能中。

    shinyBS

答案 1 :(得分:1)

如果您的所有输入都以“myValue”开头,则可以选择所有输入:

$('input[id^="myValue"]')

我第一次尝试

$(document).ready(function(){
  $('input[id^="myValue"]').on("invalid", function(){alert("invalid");});
})

但由于某些原因不起作用。

我的第二次尝试:

library(shiny)
js <- '$(document).ready(function(){
$("input[id^=\\\"myValue\\\"]").on("keyup", function(){
  if($(this)[0].checkValidity()){
    $(this).tooltip("destroy");
  }else{
    $(this).tooltip({title:"invalid"});
  }
})
})
'
ui <- fluidPage(
  tags$head(
    tags$script(js)
  ),
  numericInput("myValue", "My Variable", min = 0, max = 1, value = 0.5),
  numericInput("myValue2", "My Variable2", min = 0, max = 3, step = 0.5, value = 0.5),
  textOutput("text"),
  textOutput("text2")
  )

server <- function(input, output) {
  output$text <- renderText(input$myValue)
  output$text2 <- renderText(input$myValue2)
}

shinyApp(ui, server)

它有效但输入有效时我在控制台中出现了一些错误。我不知道为什么。