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

PromptTextArea

configuration

Configuration options for the Kendo UI TextArea component used in the prompt view. Only specific properties from the Kendo UI TextArea are supported.

<div id="aiprompt"></div>
<script>
$("#aiprompt").kendoAIPrompt({
    promptTextArea: {
        resize: "vertical",
        rows: 4,
        placeholder: "Enter your AI prompt here...",
        fillMode: "outline",
        rounded: "medium",
        size: "large",
        maxLength: 1000,
        label: {
            content: "AI Prompt",
            floating: true
        }
    }
});
</script>

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

<div id="aiprompt"></div>
<script>
$("#aiprompt").kendoAIPrompt({
    promptTextArea: {
        fillMode: "outline"
    }
});
</script>

Specifies the input mode attribute for mobile keyboards.

<div id="aiprompt"></div>
<script>
$("#aiprompt").kendoAIPrompt({
    promptTextArea: {
        inputMode: "text"
    }
});
</script>

Specifies the label configuration for the textarea.

<div id="aiprompt"></div>
<script>
$("#aiprompt").kendoAIPrompt({
    promptTextArea: {
        label: {
            content: "Enter your prompt",
            floating: true
        }
    }
});
</script>

Specifies the maximum number of characters allowed in the textarea.

<div id="aiprompt"></div>
<script>
$("#aiprompt").kendoAIPrompt({
    promptTextArea: {
        maxLength: 500
    }
});
</script>

Specifies the maximum number of visible rows to which the textarea can auto-resize. Used in combination with resize: "auto".

Default: null

<div id="aiprompt"></div>
<script>
$("#aiprompt").kendoAIPrompt({
    promptTextArea: {
        resize: "auto",
        maxRows: 3
    }
});
</script>

Specifies the overflow behavior. Available options: "auto", "hidden", "visible", "scroll".

<div id="aiprompt"></div>
<script>
$("#aiprompt").kendoAIPrompt({
    promptTextArea: {
        overflow: "auto"
    }
});
</script>

Specifies the placeholder text for the textarea.

<div id="aiprompt"></div>
<script>
$("#aiprompt").kendoAIPrompt({
    promptTextArea: {
        placeholder: "Type your AI prompt here..."
    }
});
</script>

Specifies the resize behavior. Available options: "none", "both", "horizontal", "vertical", "auto".

<div id="aiprompt"></div>
<script>
$("#aiprompt").kendoAIPrompt({
    promptTextArea: {
        resize: "vertical"
    }
});
</script>

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

<div id="aiprompt"></div>
<script>
$("#aiprompt").kendoAIPrompt({
    promptTextArea: {
        rounded: "medium"
    }
});
</script>

Specifies the number of visible text lines.

<div id="aiprompt"></div>
<script>
$("#aiprompt").kendoAIPrompt({
    promptTextArea: {
        rows: 3
    }
});
</script>

Specifies the size of the component. Available options: "small", "medium", "large", "none".

<div id="aiprompt"></div>
<script>
$("#aiprompt").kendoAIPrompt({
    promptTextArea: {
        size: "large"
    }
});
</script>