This is a migrated thread and some comments may be shown as answers.

textarea in Form

1 Answer 72 Views
Form
This is a migrated thread and some comments may be shown as answers.
KR
Top achievements
Rank 1
Veteran
KR asked on 29 Jan 2021, 12:54 AM

How to render a textarea in the Form? I have the below code, it did increase the height of the textbox, but does not behave like textarea.

 

items.AddGroup()
    .Label("Comments")
    .Layout("grid")
    .Grid(g => g.Cols(1).Gutter(10))
    .Items(i =>
    {
        i.Add()
             .Field(f => f.Comments)
             .Label(l => l.Text("Comments:")).InputHtmlAttributes(new { style = "height:80px;" });
    });

 

 

 

Thank  you!

1 Answer, 1 is accepted

Sort by
0
Martin
Telerik team
answered on 01 Feb 2021, 03:18 PM

Hello, 

You can define a custom editor for the field through the EditorTemplateHandler option. Please check the code below:

 items.AddGroup()
                .Label(" ")
                .Layout("grid")
                .Items(i =>
                {
                    i.Add()
                         .Field(f => f.Comments)
                         .Label(l => l.Text("Comments:"))
                         .EditorTemplateHandler("customEditor");
                });

JS:

function customEditor(container, options) {
        $("<textarea class='k-textarea' name='" + options.field + "' required data-bind='value: " + options.field + "'></textarea>")
            .appendTo(container);
    }

Let me know how that works for you.

Regards,
Martin
Progress Telerik

Virtual Classroom, the free self-paced technical training that gets you up to speed with Telerik and Kendo UI products quickly just got a fresh new look + new and improved content including a brand new Blazor course! Check it out at https://learn.telerik.com/.

Tags
Form
Asked by
KR
Top achievements
Rank 1
Veteran
Answers by
Martin
Telerik team
Share this question
or