9 Answers, 1 is accepted
0
Hello Bojan,
There was no such sample, but since this is a very common scenario, we made one. Enjoy!
Kind regards,
Alex Gyoshev
the Telerik team
There was no such sample, but since this is a very common scenario, we made one. Enjoy!
Kind regards,
Alex Gyoshev
the Telerik team
Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
0

Bojan
Top achievements
Rank 1
answered on 15 Jan 2012, 01:26 AM
Thanks
0

Łukasz
Top achievements
Rank 1
answered on 19 Mar 2012, 03:29 PM
well... try this fiddle on IE8 - doesn't work :/
0

Łukasz
Top achievements
Rank 1
answered on 19 Mar 2012, 04:18 PM
figure this out:
div.k-window-content {
visibility: visible!important;
}
div.k-window-content {
visibility: visible!important;
}
0

Michael
Top achievements
Rank 2
answered on 20 Mar 2012, 09:25 AM
I had same issue, but wanted configurable dialog type windows. I just stared using Kendo. I came up with this
the CSS
The Script
Usage
put this in your body somewhere, just once
Call like this.
Like I said, I'm new this but this is what I came up with and it works for me :) . In my CSS I float the buttons right, so reverse the order of the buttons.
You can make the buttons anything you like and the Text of the button will be returned to your function.
Hope this helps...
M.
the CSS
.czDLGIcon{
padding-right
:
10px
;
width
:
32px
;
height
:
32px
;
padding-bottom
:
10px
;
background-repeat
:
no-repeat
;
}
.czDLGText{
padding-right
:
20px
;
font-weight
:
bold
;
padding-bottom
:
10px
;
}
.czDLGBtn{
margin-right
:
5px
;
border
:
1px
solid
#666
;
background-color
:
#0d0d0d
;
color
:
#d59eff
;
font-weight
:
bold
;
-moz-border-radius:
6px
;
-webkit-border-radius:
6px
;
border-radius:
6px
;
font-size
:
13px
;
padding
:
4px
10px
;
outline
:
0
;
-webkit-appearance:
none
;
cursor
:
pointer
;
float
:
right
;
}
.czDLGBtn:hover {
background-color
:
#1d1d1d
;
}
.czWarning{
background-image
:
url
(
'/assets/icons/dlgIcons/warning.png'
);
}
.czInformation{
background-image
:
url
(
'/assets/icons/dlgIcons/information.png'
);
}
.czConfirm{
background-image
:
url
(
'/assets/icons/dlgIcons/confirm.png'
);
}
.czError{
background-image
:
url
(
'/assets/icons/dlgIcons/error.png'
);
}
.czStop{
background-image
:
url
(
'/assets/icons/dlgIcons/stop.png'
);
}
The Script
var
czDLGResult =
"Cancel"
;
var
czDLGWindow;
var
czDLGCallBack;
function
czDLGClose(BtnResult){
czDLGResult = BtnResult;
czDLGWindow.close();
};
function
czDLGCloseCallBack(e){
czDLGWindow.unbind(
"close"
, czDLGCloseCallBack);
if
(czDLGCallBack !==
null
){
czDLGCallBack(czDLGResult);
}
}
function
czDLG(Title,Message,Type,Buttons,theFunction){
var
DLGData =
'<table cellpadding="0" cellspacing="0"><tr><td><div class="czDLGIcon '
+ Type +
'"></div></td>'
+
'<td><div class="czDLGText">'
+Message+
'</div></td></tr></table><div>'
;
for
(
var
i
in
Buttons){
var
s = Buttons[i];
DLGData +=
'<input class="czDLGBtn" type="button" onclick="czDLGClose(\''
+s+
'\')" value="'
+s+
'">'
;
}
DLGData +=
'</div>'
;
czDLGResult =
"Cancel"
;
if
(theFunction !== undefined){
czDLGCallBack = theFunction;
}
else
{
czDLGCallBack =
null
;
}
czDLGWindow.bind(
"close"
, czDLGCloseCallBack);
czDLGWindow.title(Title);
czDLGWindow.center();
czDLGWindow.content(DLGData);
czDLGWindow.open();
}
$(document).ready(
function
() {
czDLGWindow = $(
"#czDLGWindow"
).kendoWindow({
actions: [
"Close"
],
draggable:
true
,
modal:
true
,
resizable:
false
,
visible:
false
,
title:
"Confirm action"
,
}).data(
"kendoWindow"
);
});
Usage
put this in your body somewhere, just once
<
div
id
=
"czDLGWindow"
></
div
>
Call like this.
<script>
function
myTestClose(dlgResult){
alert(
'Dialog Result: '
+dlgResult);
}
$(document).ready(
function
() {
$(
"#testBtn"
).click(
function
(){
// czWarning / czInformation / czConfirm / czError / czStop
czDLG(
"Test DLG"
,
"Are you sure?"
,
"czStop"
,[
"Cancel"
,
"OK"
],myTestClose);
});
});
</script>
Like I said, I'm new this but this is what I came up with and it works for me :) . In my CSS I float the buttons right, so reverse the order of the buttons.
You can make the buttons anything you like and the Text of the button will be returned to your function.
Hope this helps...
M.
0

Michael
Top achievements
Rank 1
answered on 06 Jun 2013, 08:39 AM
Wow. I'd think this would have been one of the first things done and definitely one done quickly (if not first) for UI consistency. This is a nightmare though. Back to jQuery for me on this one :(
0
Indeed, this is a common scenario that may be implemented in the future. To show your support, please vote on the associated uservoice issue.
Regards,Alex Gyoshev
Telerik
Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
0

Navin
Top achievements
Rank 1
answered on 17 Sep 2013, 02:22 PM
Will you guys be including a kendo dialog to the kendo framework in the next release of Kendo? I am sure it will be quite useful for not just me but for many other Kendo users/developers.
Thanks,
Nav
Thanks,
Nav
0
Hello Navin,
Alex Gyoshev
Telerik
It is not scheduled for our short-term plans (Q3 2013). You can vote for it in the UserVoice portal mentioned above, and you will be notified once it is planned to be released.
Regards,Alex Gyoshev
Telerik
Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!