Telerik Forums
Kendo UI for jQuery Forum
11 answers
94 views

Sample: http://dojo.telerik.com/OCURa

 

I'm trying to use a mobile Collapsible widget with icons in the header, but toggling the collapsed state will break those icons marked with the km-icon class. Icons in the body are unaffected.

 
Marco
Top achievements
Rank 1
Iron
 answered on 17 Jan 2020
1 answer
191 views

Hi,

How can I bind to the expand or collapse event from code? I tried:

 

 $("#collapsibleDiv").on("expand", function () {
                alert("expand");
            });

 

without sucess. 

Kind regards,

 

Marco

 

 

 

 

 

 

Ivan Danchev
Telerik team
 answered on 12 Oct 2017
2 answers
82 views

I have a jquery mobile app that I'm converting to kendo-ui mobile.   It uses forms inside of collapsible's extensively.  Kendo UI doesn't like it.  I tested by copying the example mobile collapsible  index.html from examples to my app, works fine.  Then tried pasting various example mobile-forms.  They all fail, the page is a mess.

I guess I'll have to figure another way unless you guys have some solution?

Jim
Top achievements
Rank 1
 answered on 01 Feb 2016
5 answers
173 views
I have a stack of divs with data-role="collapsible" and I'm trying to get an auto-scroll to work in the data-expand event. I can't seem to figure out how to do this. Basically, I just want to auto scroll the div to top of the current view minus 100px. Any ideas on how to do this? I've spent hours trying to figure this out.
Alexander Valchev
Telerik team
 answered on 25 Aug 2015
9 answers
123 views

I have some collapsible widgets that I am "routing open" by way of a view().param switch on the view's "afterShow" event.

Basically, if a user clicks a nav link I am taking them to a different collapsible in that view. This all works well, however I may have a bug or some odd behavior on my hands.

If in my onAfterShow function I call:

$("#giving-collapse").data("kendoMobileCollapsible").expand();

...But I am left with a zero height .km-collapsible-content block:

<div data-role="collapsible-content" class="km-collapsible-content km-animated" style="height: 0px; display: block;"><div>

So I have called this after calling .expand() ...

$("#giving-collapse .km-collapsible-content").css("height","auto");

Which works and shows the proper content.

Am I missing something or should this work straight away without a defined height change?

Alexander Valchev
Telerik team
 answered on 24 Apr 2015
2 answers
45 views

Is it possible to link multiple collapsible div containers together in operation so that only one can be open at a time?

Right now this is how I have it operating. It works, but I'm not sure if this is the best way to accomplish such a thing.

 

onCollapsibleExpand: function(e){
        var thisID = $(this.element).attr("id");
        $(".km-collapsible").each(function(k,v){ 
            // if not clicked item and is currently visible 
            if( ($(this).attr("id") != thisID) && $(this).is(":visible") ){
                $(this).data("kendoMobileCollapsible").collapse();
            }
        });
    },

David
Top achievements
Rank 2
 answered on 10 Apr 2015
1 answer
72 views

Hi there, I'm currently working on a project for a client, and part of what we do has to deal with the latest and coolest kendo UI components. In my current project, I'm trying to explore the use of the Kendo UI Mobile Collapsible control. Being a Telerik MVP myself, I figured I can help ask the right questions, and perhaps it will help other developers who face the same issues later find the answers here.

Here's my coding and what I am trying to achieve.

<div id="#: data.idValue #" data-role="collapsible" data-expand="onExpand('#: data.idValue #')">

<h3>#: data.dataItemLabel #</h3> 

... 

</div>

 

As you can understand from the code, I am using a kendo-template, and I am creating a list of collapsible items, and when each item is being clicked upon, it should trigger the onExpand method, passing the value of the id of the div into the method.

 

What's happening right now is that whenever the page is loaded for the first time, the method get executed when the list of collapsible are being created. (Please see my attached screenshot) Any developer with any good ideas on how we can solve this, please do share your ideas and input.

 

My intentions are for the method to be executed only when the collapsible item is selected for the first time.

Alexander Valchev
Telerik team
 answered on 08 Apr 2015
Narrow your results
Selected tags
Tags
+? more
Top users last month
horváth
Top achievements
Rank 2
Iron
Iron
Steve
Top achievements
Rank 2
Iron
Erkki
Top achievements
Rank 1
Iron
Mark
Top achievements
Rank 2
Bronze
Iron
Veteran
Jakub
Top achievements
Rank 1
Iron
Want to show your ninja superpower to fellow developers?
Top users last month
horváth
Top achievements
Rank 2
Iron
Iron
Steve
Top achievements
Rank 2
Iron
Erkki
Top achievements
Rank 1
Iron
Mark
Top achievements
Rank 2
Bronze
Iron
Veteran
Jakub
Top achievements
Rank 1
Iron
Want to show your ninja superpower to fellow developers?
Want to show your ninja superpower to fellow developers?