Kendo grid Popup edit template Textbox wrap text
hi,I am using Kendo grid template to bind data. While editing data in a grid, pop up will be dispalyed in which we can update the data.
In pop up, the text contents should be wrapped in the textbox
Grid Template
<div style="height: 600px; margin: 0 20px">
@(Html.Kendo().Grid<.....>()
.Name("gridFunctions")
.DataSource(dataSource => dataSource
.Ajax()
.Model(model =>
{
model.Id(p => p.ID);
model.Field(p => p.Priority);
})
.Read("DetailsFetchGrid", "Dataset", new { acProgram = this.Model.Program, dataset = this.Model.Computer })
.Create("FunctionCreate", "Dataset", new { acProgram = this.Model.Program, dataset = this.Model.Computer })
.Update("FunctionUpdate", "Dataset")
.Destroy("FunctionDestroy", "Dataset")
.Events(e =>
{
e.Error("Dataset.onErrorGrid");
e.RequestEnd("Dataset.onRequestEndGrid");
})
)
.Columns(columns =>
{
columns.Bound(x => x.ID).Hidden(true);
columns.Bound(x => x.Name).Title("Function Name");
columns.Bound(x => x.Condition).Title("Function Condition");
columns.Command(command =>
{
command.Edit();
if (!this.Model.HasConfigurationLinked)
command.Destroy();
}).Title("Edit").Width(100).HeaderHtmlAttributes(new { @class = "col-edition"});
})
.DefaultBehaviors()
.ToolBar(toolbar => toolbar.Create().Text("Add new Function"))
.Editable(editable => editable.Mode(GridEditMode.PopUp))
.Events(e => e.Edit("Dataset.onEdit").Cancel("Dataset.onCancelEdit"))
)
</div>
Here in Condition column, while editing the content needs to be wordwrap.
So we are increasing the height and width of Condition textbox
onEdit: function (e) {
e.container.find("#Condition")[0].style.height = "100px";
e.container.find("#Condition")[0].style.width = "100px";
e.container.find("#Condition")[0].style.wordWrap = "break-word";
//e.container.find("#Condition")[0].style.wrapper = "break-word";
}
After Applying the above code, height and width of condition textbox is increased. But textcontent is not Wordwrapped.
Could anyone help me, how to make the content wordwrap?