Hello,
I have a basic Window. This Window has a basic Tab Strip. Some of the content in each of the tabs will dynamically appear. When the content appears, the size of the tab dynamically grows, which is what I want. However, the Window stays the same size. Ideally, I would like for the Window height to grow as well. Is there a way to do this? I've included my code below to demonstrate what I'm talking about. Also, is there any support for a maxHeight-esque property?
I have a basic Window. This Window has a basic Tab Strip. Some of the content in each of the tabs will dynamically appear. When the content appears, the size of the tab dynamically grows, which is what I want. However, the Window stays the same size. Ideally, I would like for the Window height to grow as well. Is there a way to do this? I've included my code below to demonstrate what I'm talking about. Also, is there any support for a maxHeight-esque property?
<
input
type
=
"button"
id
=
"testButton"
value
=
"Test"
onclick
=
"return testButton_Click();"
/>
<
div
id
=
"testDialog"
>
<
div
id
=
"testTabs"
>
<
ul
>
<
li
class
=
"k-state-active"
>Tab 1</
li
>
<
li
>Tab 2</
li
>
</
ul
>
<
div
>
<
div
id
=
"errBanner"
style
=
"padding-bottom:8px;"
>Testing a longer error message. This thing will wrap. There is a chance this will wrap. It should.</
div
>
<
div
>Name</
div
>
<
input
id
=
"nameTextBox"
/>
<
div
>Please enter your name.</
div
>
</
div
>
<
div
>
Tab 2 Content
</
div
>
</
div
>
<
input
type
=
"button"
id
=
"validateButton"
value
=
"Validate"
onclick
=
"validateButton_Click();"
/>
</
div
>
<
script
type
=
"text/javascript"
>
$().ready(function () {
$("#testDialog").kendoWindow({
visible: false,
title: "Test",
minHeight: 150,
minWidth: 400,
modal: true,
open: function () {
$("#errBanner").hide();
}
}).data("kendoWindow");
$("#testTabs").kendoTabStrip({
animation: { open: { effects: ""} }
});
});
function testButton_Click() {
var dialog = $("#testDialog").data("kendoWindow");
dialog.center();
dialog.open();
}
function validateButton_Click() {
$("#errBanner").show();
}
</
script
>