How to add a footer to window?

[xin]

Kendo UI window only provides the way to add title on window, is there a way to add a footer sticking to bottom while window height is not fixed?
Basically I am looking for footer similar to twitter bootstrap modal

http://getbootstrap.com/javascript/#modals

<div class="modal fade">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
<h4 class="modal-title">Modal title</h4>
</div>
<div class="modal-body">
<p>One fine body&hellip;</p>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
<button type="button" class="btn btn-primary">Save changes</button>
</div>
</div><!-- /.modal-content -->
</div><!-- /.modal-dialog -->
</div><!-- /.modal -->

[Iliana Dyankova]

Hello Xin,

To achieve this you can add the buttons as window content and position them using custom CSS rules. A sample implementation is demonstrated in this example.

Regards,
Iliana Nikolova
Telerik

 

 

[xin]

Thanks for reply.
This way can not create a fixed height window and let footer stick to the bottom.
It would be nice if Kendo Window could offer a way to make fixed height content area.

[Iliana Dyankova]

Hi Xin,

You can set height to Kendo UI Window via the height option. Also the buttons can be stuck to the bottom using custom CSS rules. For your convenience I modified the example with a possible implementation. 

Regards,
Iliana Nikolova
Telerik

 

 

[ALGOTEC]

If the window is shorter then the content and a scroll bar is added the footer is not stuck to bottom anymore... couldn't fix this (similar problem also in the mobile version).

[ALGOTEC]

Also tried to handle the scrolling myself by adding bottom padding to the content with position absolute to the footer but in mobile it's not working because of the km-scroll-container.

[Iliana Dyankova]

Hi,

Take a look at this thread which discussed the same subject and contains a possible solution. I would like to remind you that this layout is not supported out-of-the-box by Kendo UI Window and we cannot guarantee that the workaround will work in all cases. 

Regards,
Iliana Nikolova
Telerik