New to Kendo UI for jQueryStart a free 30-day trial

OutputActions

configuration

An array of action configurations for the output cards. Can contain strings for built-in actions or objects with custom action properties.

Built-in actions:

  • "copy" - Copy output content to clipboard.
  • "retry" - Retry generating the output.
  • "discard" - Clears the output content and closes the popup.

Custom actions trigger the outputAction event with the action command and output data.

Default: ["copy", "retry", "discard"]

Parameters:actionString

The output action that has initiated the given operation.

contentString

The currently present output content.

<div id="inlineaiprompt"></div>
<script>
$("#inlineaiprompt").kendoInlineAIPrompt({
    outputActions: ["copy", "retry", "rating"]
});
</script>
<div id="inlineaiprompt"></div>
<script>
$("#inlineaiprompt").kendoInlineAIPrompt({
    outputActions: [
        "copy",
        "retry",
        { command: "export", text: "Export", icon: "download" },
        { command: "share", text: "Share", icon: "share" }
    ],
    outputAction: function(e) {
        if (e.action === "export") {
            // Handle export action
            console.log("Content:", e.content);
        } else if (e.command === "share") {
            // Handle share action
            console.log("Sharing output:", e.content);
        }
    }
});
</script>

The command identifier for the action. This is used to identify the action when the outputAction event is triggered.

<div id="inlineaiprompt"></div>
<script>
$("#inlineaiprompt").kendoInlineAIPrompt({
    outputActions: [
        { command: "export", text: "Export", icon: "download" }
    ]
});
</script>

Specifies the fill mode of the action button. Available options: "solid", "outline", "flat", "none".

<div id="inlineaiprompt"></div>
<script>
$("#inlineaiprompt").kendoInlineAIPrompt({
    outputActions: [
        { command: "primary", text: "Primary", fillMode: "solid" },
        { command: "secondary", text: "Secondary", fillMode: "outline" }
    ]
});
</script>

The icon name for the action button. Uses Kendo UI icon names.

<div id="inlineaiprompt"></div>
<script>
$("#inlineaiprompt").kendoInlineAIPrompt({
    outputActions: [
        { command: "bookmark", text: "Bookmark", icon: "star" },
        { command: "share", text: "Share", icon: "share" }
    ]
});
</script>

Specifies the border radius of the action button. Available options: "small", "medium", "large", "full", "none".

<div id="inlineaiprompt"></div>
<script>
$("#inlineaiprompt").kendoInlineAIPrompt({
    outputActions: [
        { command: "rounded", text: "Rounded", rounded: "full" }
    ]
});
</script>

The text displayed on the action button.

<div id="inlineaiprompt"></div>
<script>
$("#inlineaiprompt").kendoInlineAIPrompt({
    outputActions: [
        { command: "export", text: "Export to PDF", icon: "download" }
    ]
});
</script>

Specifies the theme color of the action button. Available options: "base", "primary", "secondary", "tertiary", "success", "warning", "error", "info", "inverse".

<div id="inlineaiprompt"></div>
<script>
$("#inlineaiprompt").kendoInlineAIPrompt({
    outputActions: [
        { command: "danger", text: "Delete", themeColor: "error" },
        { command: "success", text: "Approve", themeColor: "success" }
    ]
});
</script>

Specifies the title attribute (tooltip) for the action button.

<div id="inlineaiprompt"></div>
<script>
$("#inlineaiprompt").kendoInlineAIPrompt({
    outputActions: [
        { command: "help", icon: "question", title: "Get help with this output" }
    ]
});
</script>