在 ask_confirmation 对话框中使用 JavaScript 函数 - Shiny R答案

【问题标题】：Use JavaScript function inside ask_confirmation dialog - Shiny R在 ask_confirmation 对话框中使用 JavaScript 函数 - Shiny R
【发布时间】：2022-12-14 13:01:52
【问题描述】：

我有这个 HTML 按钮：

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<select id="type">
    <option value="item0">--Select an Item--</option>
    <option value="item1">item1</option>
    <option value="item2">item2</option>
    <option value="item3">item3</option>
</select>

<select id="size">
    <option value="">-- select one -- </option>
</select>

另外我还有这个Javascript函数：

$(document).ready(function () {
    $("#type").change(function () {
        var val = $(this).val();
        if (val == "item1") {
            $("#size").html("<option value='test'>item1: test 1</option><option value='test2'>item1: test 2</option>");
        } else if (val == "item2") {
            $("#size").html("<option value='test'>item2: test 1</option><option value='test2'>item2: test 2</option>");
        } else if (val == "item3") {
            $("#size").html("<option value='test'>item3: test 1</option><option value='test2'>item3: test 2</option>");
        } else if (val == "item0") {
            $("#size").html("<option value=''>--select one--</option>");
        }
    });
});

我想将带有 Java 脚本函数的按钮放在 ask_confirmation 对话框中在我闪亮的应用程序中。

这是我的 ask_confirmation 对话框代码：

    ask_confirmation(
      "hi",
      title = "hi",
      type = "info", 
      width = '50%',
      html = TRUE,
      text =
        div(HTML(" my html code..
                  ")))

可能吗？

【问题讨论】：

什么是ask_confirmation？它来自一个包？哪一个？
是的，shinyWidgets 包。它与 ShinyAlert 非常相似，但效果更好

标签： javascript r shiny

【解决方案1】：

我会尝试以下。

将 JS 代码放在字符串中：

jsfun <- "
var val = $(this).val();
if (val == "item1") {
  $("#size").html(
    "<option value='test'>item1: test 1</option><option value='test2'>item1: test 2</option>"
  );
} else if (val == "item2") {
  $("#size").html(
    "<option value='test'>item2: test 1</option><option value='test2'>item2: test 2</option>"
  );
} else if (val == "item3") {
  $("#size").html(
    "<option value='test'>item3: test 1</option><option value='test2'>item3: test 2</option>"
  );
} else if (val == "item0") {
  $("#size").html("<option value=''>--select one--</option>");
}
"

在 text 参数中，放入以下 HTML：

tags$div(
  tags$select(
    tags$option(value = "item0", "Select an item"),
    tags$option(value = "item1"),
    tags$option(value = "item2"),
    tags$option(value = "item3"),
    onchange = jsfun
  ),
  tags$select(
    id = "size",
    tags$option(value = "", "select one")
  )
)

【讨论】：