Hello,
I'm using the kendo panelbar to build an accordion in a corporate application, and I already profited of your help. I am using kendo.all version 2013.2.918.
My problem is that when I call the window containing the panelbar, the first time the event handlers apparently are not called. I'll try to explain helping myself with the code.
I need to do some processing and call a __doPostback(...) according to some conditions in the function called correspondingly to the select event. Basically
I have a initialization function InitPanelK() that iterates through the graphical elements and initializes the elements defined as panelbar.
I attach an event handler for the select, expand, collapse events
in the select event handler I have an alert and some processing with a __doPostback().
The point is that the first time InitPanelK() is called the alert of onSelect never appears, so the method is never called, if I exit-enter again, the alart pops out.
This is my barebone code
var pbuniqueid;
function HandleButtonEvent(e) {
// alert('accordion HandleButtonEvent');
$("#hdnKendoPanelbar").val("true");
return true;
}
function CallServerPostBack(itemid) {
var myid = 'AZBuilder1$' + pbuniqueid;
__doPostBack(myid, itemid);
}
function onSelect1(e) {
alert('accordion onSelect1');
if ($("#hdnKendoPanelbar").val() == "true") {
$("#hdnKendoPanelbar").val("false");
selectedid = $(e.item).attr("id");
CallServerPostBack(selectedid);
}
}
function onExpand1(e) {
// alert("Expand : " + $(e.item).find("> .k-link").text() + " " + $(e.item).attr('id'));
}
function onCollapse1(e) {
//jkLog("Collapse cs: " + $(e.item).find("> .k-link").text());
}
var initPanelK = function () {
var panelfields = [];
$("#hdnKendoPanelbar").val("false");
$('ul[data-role]').each(function () {
if (typeof $(this).attr('id') === 'undefined') {
return;
}
// var pos = $(this).attr("id").indexOf("panelbar");
var pos = $(this).attr('data-role').indexOf('panelbar');
if (pos >= 0) {
//alert("panelbar " + $(this).val() + '-' + $(this).attr("id"));
var fieldname = "#" + $(this).attr("id");
$(fieldname).kendoPanelBar({
expandMode: "multiple",
select: onSelect1,
expand: onExpand1,
collapse: onCollapse1
});
pbuniqueid = $(fieldname).attr("uniqueid");
alert('pbuniqueid ' + pbuniqueid);
}
});
};
In the server-side code I register this script and call it as
public const string INIT_KENDO_ACCORDION_START = @"
<script type=""text/javascript"">
$(document).ready(function () { initPanelK(); });
</script>
";
RegisterStartupScript(typeof(Page), "INIT_KENDO_ACCORDION", INIT_KENDO_ACCORDION_START);
What I verified is that the initialization function InitPanelK() is always called, the alert messages come out, so no script error seem to occur.
WHEN i ENTER THE SCREEN WITH THE ACCORDION,
THE ACCORDION APPEARS
IT COLLAPSES/EXPANDs CORRECTLY BUT THE ALERT IN THE ONSELECT1 METHOD IS NEVER CALLED.
IF I CHANGE SCREEN AND REENTER, INITPANELK() IS CALLED AGAIN BUT NOW THE onSelect1 handler is always called.
Instead of using the event definition in initialization I tried to use the bind method as
$(fieldname).kendoPanelBar({
expandMode: "multiple"
});
$(fieldname).data("kendoPanelBar").bind("select", onSelect1);
but the behaviour is the same.
In a simple application seems not to happen.
I will be very grateful for any hint, I'm spinning around the problem.
Thanks for your kind attention,
bet regards
marco
I'm using the kendo panelbar to build an accordion in a corporate application, and I already profited of your help. I am using kendo.all version 2013.2.918.
My problem is that when I call the window containing the panelbar, the first time the event handlers apparently are not called. I'll try to explain helping myself with the code.
I need to do some processing and call a __doPostback(...) according to some conditions in the function called correspondingly to the select event. Basically
I have a initialization function InitPanelK() that iterates through the graphical elements and initializes the elements defined as panelbar.
I attach an event handler for the select, expand, collapse events
in the select event handler I have an alert and some processing with a __doPostback().
The point is that the first time InitPanelK() is called the alert of onSelect never appears, so the method is never called, if I exit-enter again, the alart pops out.
This is my barebone code
var pbuniqueid;
function HandleButtonEvent(e) {
// alert('accordion HandleButtonEvent');
$("#hdnKendoPanelbar").val("true");
return true;
}
function CallServerPostBack(itemid) {
var myid = 'AZBuilder1$' + pbuniqueid;
__doPostBack(myid, itemid);
}
function onSelect1(e) {
alert('accordion onSelect1');
if ($("#hdnKendoPanelbar").val() == "true") {
$("#hdnKendoPanelbar").val("false");
selectedid = $(e.item).attr("id");
CallServerPostBack(selectedid);
}
}
function onExpand1(e) {
// alert("Expand : " + $(e.item).find("> .k-link").text() + " " + $(e.item).attr('id'));
}
function onCollapse1(e) {
//jkLog("Collapse cs: " + $(e.item).find("> .k-link").text());
}
var initPanelK = function () {
var panelfields = [];
$("#hdnKendoPanelbar").val("false");
$('ul[data-role]').each(function () {
if (typeof $(this).attr('id') === 'undefined') {
return;
}
// var pos = $(this).attr("id").indexOf("panelbar");
var pos = $(this).attr('data-role').indexOf('panelbar');
if (pos >= 0) {
//alert("panelbar " + $(this).val() + '-' + $(this).attr("id"));
var fieldname = "#" + $(this).attr("id");
$(fieldname).kendoPanelBar({
expandMode: "multiple",
select: onSelect1,
expand: onExpand1,
collapse: onCollapse1
});
pbuniqueid = $(fieldname).attr("uniqueid");
alert('pbuniqueid ' + pbuniqueid);
}
});
};
In the server-side code I register this script and call it as
public const string INIT_KENDO_ACCORDION_START = @"
<script type=""text/javascript"">
$(document).ready(function () { initPanelK(); });
</script>
";
RegisterStartupScript(typeof(Page), "INIT_KENDO_ACCORDION", INIT_KENDO_ACCORDION_START);
What I verified is that the initialization function InitPanelK() is always called, the alert messages come out, so no script error seem to occur.
WHEN i ENTER THE SCREEN WITH THE ACCORDION,
THE ACCORDION APPEARS
IT COLLAPSES/EXPANDs CORRECTLY BUT THE ALERT IN THE ONSELECT1 METHOD IS NEVER CALLED.
IF I CHANGE SCREEN AND REENTER, INITPANELK() IS CALLED AGAIN BUT NOW THE onSelect1 handler is always called.
Instead of using the event definition in initialization I tried to use the bind method as
$(fieldname).kendoPanelBar({
expandMode: "multiple"
});
$(fieldname).data("kendoPanelBar").bind("select", onSelect1);
but the behaviour is the same.
In a simple application seems not to happen.
I will be very grateful for any hint, I'm spinning around the problem.
Thanks for your kind attention,
bet regards
marco