Posts mit dem Label Telerik werden angezeigt. Alle Posts anzeigen
Posts mit dem Label Telerik werden angezeigt. Alle Posts anzeigen

Donnerstag, 10. Juni 2010

Filter for Telerik Mvc Grid Version 0.3

Hey, I just did a small update on my gridfilter for the Telerik MVC Grid.

There's just one change: You're now able to put different values into a textbox, just put a ";" between them. So a textbox using the delimiters is handled the same as multiple textboxes with separate values. The column and operator settings will be applied to all elements.

Get the new version here.

Donnerstag, 6. Mai 2010

JQuery plugin to filter Telerik MVC Grid

This is a JQuery Plugin that enables you to filter the Telerik MVC Grid from outside the grid itself.


Changes
10.05.2010: Sorry guys, there was an debug alert in the script. I removed it in version 0.2.

10.06.2010: You're now able to put different values into a textbox, just put a ";" between them. So a textbox using the delimiters is handled the same as multiple textboxes with separate values. The column and operator settings will be applied to all elements.

What do I need?
Well, JQuery and the Telerik MVC Grid

Where do I start?
1. Give the grid a name, i.e. filteredGrid.
2. Put this one into document ready: $('#filteredGrid').gridFilter();

The "Apply Button"
By default, the apply button has to have the following class: "applyFilterButton"

What do I do in my html?
<input type="checkbox" class="gridfilter gf-op-range gf-col-Chambers" value="4::5" />
<input type="checkbox" class="gridfilter gf-op-range gf-col-Chambers" value="5::6" />
<input type="checkbox" class="gridfilter gf-op-eq gf-col-Chambers" value="5" />
<input type="checkbox" class="gridfilter gf-op-ne gf-col-Chambers" value="5" />
<input type="checkbox" class="gridfilter gf-op-gt gf-col-Chambers" value="5" />
<input type="radio" name="radiogroup" class="gridfilter gf-op-eq gf-col-Type" value="0" />
<input type="radio" name="radiogroup" class="gridfilter gf-op-eq gf-col-Type" value="1" />
<input type="radio" name="radiogroup" class="gridfilter gf-op-eq gf-col-Type" value="2" />
<input type="text" class="gridfilter gf-op-substringof gf-col-City" value="er" />
<input type="text" class="gridfilter gf-op-endswith gf-col-City" value="rn" />
<input type="text" class="gridfilter gf-op-startswith gf-col-City" value="be" />

Ok those are some pretty nice examples. Basically you give the input 3 classes:
the gridfilter class, the gf-op- class and the gf-col- class.


http://www.telerik.com/help/aspnet-mvc/telerik-ui-components-grid-client-api.html


Name of the column you wish to filter

This one goes out to all the Vulcans
To the logic, operations on the same column get connected with an OR expression, different
columns get connected by an AND expression:

(column1 OR column1) AND (column2) AND (column3 OR column3)

I think thats pretty much it.. here you go with a nice CNF (conjunctive normal form) :-)

Download
Get it here (Version 0.2)
Get the newest version here (Version 0.3) (Changes)

Have fun!

Socialize!