When I try to use the Filter widget on my table, the Group stops collapsing.
I made 2 test tables.
The "Group" is under SERVIDOR
http://stats.wotpt.tk/WOTPT_Filter_Off.php
with widgets : ['group', 'zebra', 'math', 'cssStickyHeaders'],
http://stats.wotpt.tk/WOTPT_Filter_On.php
with widgets : ['group', 'filter', 'zebra', 'math', 'cssStickyHeaders'],
This is the only difference between the tables.
On WOTPT_Filter_Off.php the Groups collapses, but they are not visible on page load. The table needs to be reordered to display the Groups.
On WOTPT_Filter_Off.php the Groups are shown at page load but they do not collapse.
I'm using: Tablesorter by Rob Garrison (Mottie) 2.20.1 and Jquery 1.11.2.
That problem turned out to be a bug in the filter widget. It was adding a "display:table-row" to every visible row so the "group-hidden" class was not able to hide the collapsed group.
I've fixed this problem in the latest version (v2.21.0) - The grouping widget demo now includes a filter row for testing ;P
Thanks for reporting this issue!
Related
I am trying to create a page that shows a table that contains products and I would like for the user to be able to toggle the categories. For example, if there are categories jeans, shirts and jackets, I would like a set of checkboxes that would toggle between showing the three categories of products. The problem is that I am unsure of how to approach this problem. I am not sure how to allow the user to relay the information to the controller without changing every users toggled categories. I also don't know how to get around the fact that refreshing the page to refresh the table would simply reset all of the categories.
you can do it in this way,
based upon event click of checkbox fire up ajax request on get req/param_catagory
get and assign data and load it over data table
you can use jquery data table plugins for that
There are few easy jquery plugins for that example: jquery data table
Hope this will help.
I have nested jQuery accordions in my markup where I try to auto-open on page load according to the path that was last opened in previous sessions.
I saved the path into a cookie, loading the cookie and run the following code
path.forEach(function(label){
var element = root.find("[data-caption='"+label+"']");
element.parent().accordion( "option", "active", parseInt(element.attr('data-index')) );
root = element.children().eq(1);
});
The issue is that for some reason the 'active' takes effect only for the first accordion and non of the nested ones.
I checked several times and:
element.parent() is indeed an accordion (otherwise it would have thrown an error).
data-caption is a unique key for elements in each iteration.
element.children().eq(1) is the active panel (according to the structure of jQuery UI Accordion).
the active element I am asking to open indeed exists for each iteration.
I don't know what is the issue here, any ideas?
I found the problem by myself and post here for future reference.
The issue is this part of the code
parseInt(element.attr('data-index'))
And the reason lies with how accordion counts elements within its panel.
In my panel I had several html elements which were not accordion and several which were. Now the code above brought me the index of the accordion element in compare to the entire panel.
The issue is that for some reason .active only counts sub elements which are accordion themselves. So for example if the panel index of an element is 3 but it has 1 non-accordion element before it in the panel, then it's "active" index is actually 2.
I don't know why they chose for this behaviour, but there you have it.
My solution was to place a different attribute on the element with it's "active" index and use it instead of data-index.
Now everything works like a charm.
I am trying to put 2 kendo ui treeviews in same page.
The Page is Rendered fine but i can't expand the nodes of the trees.
Can someone help please?
You must provide different names to the .Name() attribute of the treeviews in order to let it expand because onclicking node items it distracts one another..
Check your page for JavaScript errors. Those would prevent the Kendo UI widgets from working as expected. Here is a list of common JS errors: http://docs.kendoui.com/getting-started/troubleshooting#known-javascript-errors
We have hierarchical items here with a series of TR structure and not in a nested table structure. So we need to have the functionality to drag and drop items with the same level or a function to sort same level items.
For example I'll try to move Item 1.1 below Item 1.4, that row must be displayed below Item 1.4 together with its children items(Item 1.1.1 and Item 1.1.2). It will work but if you will try to move the children items, it will not work.
And we should also be able to sort/move the Item 1, Item 2 and Item 3 together with its children.
Help with regards to these sorting in jQuery UI.
var tmpTr = jQuery(ui.item).clone(true, true);
var tmpParent = jQuery('tbody[data="'+ui.item[0].id+'"]').clone(true,true);
I think there's something wrong in my code for clone. By the way here's the jsFiddle link
[http://jsfiddle.net/UAcC7/403/ ]
Thanks,
After experimenting with jquery-ui Sortable for a recent implementation of a heirarchical list of items that are draggable/droppable/sortable, I ended up rolling my own implementation using Draggable and Droppable. It helped avoid a lot of squidgy issues with hierarchical and complex sorting/dragging/dropping interactions with Sortable. Even though I got less up front, I was able handle all the cases we needed to without understanding and hacking the default behavior of Sortable. This is not exactly an answer to your question about the behavior of clone, but it may help!
I am using a twitter jquery plugin to display a list (ul/li) of twitter posts .
Also I want my users to be able to rearrange the posts as they want and I want the moved post to be marked.
I saw a post here how to do so.
If I use this the selectable function doesn't work(I can rearrange but can't select):
$(document).ready(function() {
$(".ul_sortable" ).sortable().selectable();
});
If I use this the sortable function doesn't work(I can select but cant re arrange):
$(".ul_sortable" ).sortable().selectable();
The key is to use the sortable handle option as shown in the link to the other question.
Sortable and selectable both take over the mouse events for the items they are applied to, however the handle option allows you to apply the sorting to a part of the item therefor allowing selectable to work on the rest of the item.
It should also be noted that selecting a bunch of items then sorting them all together is not natively supported.
For marking if an item is moved you can use a variety of sortable events such as stop and change docs