Change dropdrown length select to buttons - jQuery DataTables - javascript

Is it possible to change the Datatables drop down length select to buttons representing [10][25][50][100]. So that if we click on the number we can change the length of the table with pagination.
I tried many manipulations which are given in
http://www.datatables.net/plug-ins/api/ but of no use please suggest me how to change the drop down to buttons

There is a feature plug-in for DataTables that provides that ability here:
https://github.com/DataTables/Plugins/tree/master/features/lengthLinks.
If we plug the dataTables.lengthLinks.js its working fine. and the implementation is clearly given in js.

Related

kendo grid - fillter row based on column filter option

I am using kedoGrid. In the link I provided here, its is working fine. But the issue is its not updating the table based on multi-check option.
official link.
with available functionality I am able to filter based on checked value. but its not updating when I uncheck and click on filter button.
Table will get update only if we click clear button. Since new to kendo grid I am finding some difficulties to apply Jquery to update the table.
trying to convert it in jquery but failed. would be better if some share jsfiddle/plunker link
I am trying to achieve this in kendo Grid [so far][2]
many thanks for any help.
[1]: http://dojo.telerik.com/
[2]: https://jsfiddle.net/vy384myy/2/

how to select multiple values in a drop down Data tables

I am new to jquery and Data tables. I have a drop down when user select one value it will search the data and draw a table.This search and drawing a table both are default properties of data tables. Now i want the user can select multiple value.
And based on the multiple selection the search should happen.I did lot of search on this but didn't get any thing. Any help will be appreciate !!
In this image i have selected one value from drop down and based on that two entries are populating on table. now i want to select multiple values here in this drop down , may be using check box after that need the search should work with both selected entries.
I did this . I am posting this answer because it may be help some one.
jQuery MultiSelect is a jQuery plugin that turns a multiselect list into a nice dropdown list with checkboxes. This plugin is easy to use and very useful in web form. You need to use two library called jquery.multiselect.css and jquery.multiselect.js. if you will search examples of multi select using J query you will find many links and that will work perfect with your data tables. For search option You need to pass multiple value to the function which is constructing your data tables. See below link for details.
http://www.codexworld.com/multi-select-dropdown-list-with-checkbox-jquery/

How to make a selectable list in HTML5

I am trying to mimic a listbox as what would be available in MS visual studio. I have found HTML elements
select
and datalist
The problem is that these are really for data entry. What I had in mind is to have search results shown in a list but they are selectable? I need to know the index of the item(s) chosen so I can retrieve more additional detail for a subsequent screen. The elements above are more like drop downs. I want something like a textbox with a scroll bar that allows for multi select. Is that possible for HTML5?
I know VS had a form toolbox item that did just that.
Any advice?
Thanks in advance.
Matt

pro tinkering for html select box look-alike but with extra features

This could be an fun question. I'm planning to make a select box that looks like normal html at first, but when you open it there will be two exciting things:
The box will contain 2 different text-aligns making two neat rows.(see picture)
At the end of each line of the list item contained in the box, there will be a like/dislike button system.(see picture)
Some of you already know where this is going, I'll need to make the thing like you'd make any such menu in GUI programming. I assume some object oriented Javascript programming?
(I'm looking for technical details as I'm novice at Javascript and jQuery(but not at programming), I'm basically interested in info about transferring such a pseudocode construct into Javascript/jQuery or another more usable framework if really need be. I'm also perfectly aware that I'm normally not going to be using any actual html in this GUI.)
So my question is, how should I set out to do this according to you?
You will not be able to modify a normal select element to achieve this, you will have to
Create a proxy-pro-select-element and hide the original one.
Copy option elements and create equivalent one in your proxy
You will have to also keep both selects in sync.
Once you have that you can do anything in your proxy-pro-select-element, simplest would be to on click show a table with select able rows, with table it would be very easy to align all columns.
Technical details:
Read how to implement a jQuery plugin
In your plugin's init loop through options in target select and create corresponding rows in a div say dropdown, hide original select and replace it with your control which will be a select-div
onclick on select-div, show dropdown div after re-positioning correctly
See code like this and modify
You should be able to accomplish something similar to this with jQuery and jQuery UI comboboxing, http://jqueryui.com/demos/autocomplete/#combobox
And then modify _renderItem to change the layout of results in the dropdown. You can search for the following in the view source:
input.data( "autocomplete" )._renderItem
However, I would try to avoid having like/dislike buttons in a combo box because it goes against normal web conventions.

fogbugz select drop downs

Does anyone know the code fogbugz uses for styling their selects? I'm interested in getting some firefox functionality (when a fixed select width is set for the select, the options width show up expanded to fit long option values).
It looks like fogbugz is using a select still, but they've added in an input that shows the current value and maintains the fixed width. I can't find the code that does all this however. It's exactly what I need.
They are using some AJAX and it is not actually a select list, it is more akin to the auto complete drop down like Google uses on its front page. YUI, jQuery UI, ExtJS, etc all have similar functionality if you are looking for a toolset.

Categories

Resources