【问题标题】:Reset customized input shiny R using shinyjs::reset使用 shinyjs::reset 重置自定义输入闪亮 R
【发布时间】:2020-03-14 09:56:31
【问题描述】:

我有一个用于自定义输入的闪亮模块,每次单击此按钮时,我都会尝试添加一个按钮来重置此自定义输入(界面和服务器)。下面是一个使用 shinyjs::reset 的示例:

app.R

    library(shinyjs)
library(rintrojs)
library(shinydashboard)
library(shinyWidgets)

source("customTextInput.R", local = TRUE, encoding = "UTF-8")

ui <- fluidPage(

    useShinyjs(),

    # Assembling page
    dashboardPage(

        # Assembling header
        dashboardHeader(title = "Custom Inputs", titleWidth = 1294), 

        # Assembling sidebar
        dashboardSidebar(

            sidebarMenu(
                menuItem("Custom inputs reset", tabName = "custom", icon = icon("search"))
            )

        ),
        # Assembling the body of the page
        dashboardBody(

            tabItems(
                tabItem(tabName = "custom",
                        br(),
                        br(),
                        customTextInputUI("text1"),
                        fluidPage(

                            textInput(inputId = "text2", label = "Native text input", width = "100%"),
                            actionButton(inputId = "reseter1", label = "Reset custom"),
                            actionButton(inputId = "reseter2", label = "Reset native")

                        ),
                )

            ) 

        )

    )
)

server <- function(input, output, session) {

    {### Reset -----

        observe({

            shinyjs::onclick("reseter1", {
                reset("text1")
            })

        })

        observe({

            shinyjs::onclick("reseter2", {
                reset("text2")
            })

        })

    }

}

shinyApp(ui, server)

customTextInput.R

library(shinyjs)


{# UI Module -----

    customTextInputUI <- function(id, addWidth = "100%", addHeight="64px", addTop="5px", addValue = "") {

        if (is.null(addValue)){addValue <- ""}

        ns <- NS(id)

        return(

                fluidPage(

                    HTML(

                        sprintf(

"
<form id='%s' autocomplete='off' class = 'form-group shiny-input-container' style = 'padding-top:%s; width:%s; height:%s;'>
    <label for='%s'>Custom text input</label>
        <input charset='UTF-8' type='text' class = 'form-control' 
        id='%s' data-slots=' ' value = \"%s\"  
        data-shinyjs-resettable-id='%s' data-shinyjs-resettable-type='Text' data-shinyjs-resettable-value='' required>
</form>", ns('textBloco'), addTop, addWidth, addHeight, ns('textInput'), ns('textInput'), addValue, ns('textInput')))

                )

          )

    }

}

在这种情况下,reseter2 可以重置闪亮的 text2 原生 textInput,但是 reseter1 无法重置自定义输入 text1。

为什么会有这种意想不到的行为?是否有任何解决方法,也许使用纯javascript?

提前谢谢你!

【问题讨论】:

    标签: javascript r shiny shinyjs


    【解决方案1】:

    如果您检查text1 的输入ID,那么您将看到它显示为text1-textBloco

    所以要让您的reset 工作,您可以将其更新为reset("text1-textBloco"),然后它应该可以工作。

    或者,您可以将customerTextInput.R 更新为sprintf 中的ns('textBloco') 为id,然后它应该与app.R 中的reset("text1") 一起使用。 所以sprintf() 会是这样的:

    sprintf(    
                "
    <form id='%s' autocomplete='off' class = 'form-group shiny-input-container' style = 'padding-top:%s; width:%s; height:%s;'>
        <label for='%s'>Custom text input</label>
            <input charset='UTF-8' type='text' class = 'form-control' 
            id='%s' data-slots=' ' value = \"%s\"  
            data-shinyjs-resettable-id='%s' data-shinyjs-resettable-type='Text' data-shinyjs-resettable-value='' required>
    </form>", id, addTop, addWidth, addHeight, ns('textInput'), ns('textInput'), addValue, ns('textInput')))
    
          )
    

    【讨论】:

    • 非常感谢。确实,我已经尝试过您的建议,但是当您在标签内输入内容时,事情会变得很难看。除此之外,我真正期待的是一种尽可能重新渲染元素的方法,因为重置只会将值带入默认值,但我也需要带上样式。
    猜你喜欢
    • 2019-08-09
    • 2017-03-03
    • 2018-09-05
    • 1970-01-01
    • 2014-10-11
    • 2014-09-18
    • 2020-12-28
    • 2020-05-24
    相关资源
    最近更新 更多