Grid filter with checkbox and AJAX

This is a migrated thread and some comments may be shown as answers.

0 Answers 42 Views

This is a migrated thread and some comments may be shown as answers.

This question is locked. New answers and comments are not allowed.

hjbaard asked on 14 Apr 2011, 03:30 PM

Hi,
In my ASP.NET MVC 3 project I have a Telerik Grid that shows users from which I can export certificates.

On top of the grid I have a checkbox where I can tell if only I want to see only users which certificates are not exported yet or all users.
I also use AJAX to filter data.
Here is my code:

<div class="panel">

<label for="OrderStatus-input" style="vertical-align:top;">Show only not exported users:</label>

@Html.CheckBox("NotExportedOnly", true)

</div>

<p></p>

@(Html.Telerik().Grid(Model.CertUsers)

.Name("Grid")

.ToolBar(c => c

.Custom()

.HtmlAttributes(new { id = "exportCSV" })

.Text("Export CSV")

.Action("ExportCSV", "Beheer", new { orderBy = "~", filter = "~" }))

.ToolBar(c => c

.Custom()

.HtmlAttributes(new { id = "exportXLS" })

.Text("Export Excel")

.Action("ExportXLS", "Beheer", new { orderBy = "~", filter = "~" }))

.Columns(columns =>

{

columns.Bound(u => u.CourseName);

columns.Bound(u => u.Score);

columns.Bound(u => u.DatumAfgerond).Format("{0:dd-MM-yyyy}");

columns.Bound(u => u.LmsFirstName);

columns.Bound(u => u.LmsPrefix);

columns.Bound(u => u.LmsLastName);

})

.DataBinding(dataBinding => dataBinding.Ajax().Select("_Export", "Beheer"))

.ClientEvents(events => events.OnDataBound("onDataBound"))

.Resizable(r => r.Columns(true))

.Pageable(p => p.PageSize(14))

.Sortable()

.Filterable()

.Scrollable(s => s.Height(400))

)

<script type="text/javascript">

function onDataBound() {

var href;

var grid = $(this).data('tGrid');

//past de link van Export CSV aan ivm orderBy en filter

var $exportCSV = $('#exportCSV');

href = $exportCSV.attr('href');

href = href.replace(/orderBy=([^&]*)/, 'orderBy=' + (grid.orderBy || '~'));

href = href.replace(/filter=(.*)/, 'filter=' + (grid.filterBy || '~'));

$exportCSV.attr('href', href);

//past de link van Export XLS aan ivm orderBy en filter

var $exportXLS = $('#exportXLS');

href = $exportXLS.attr('href');

href = href.replace(/orderBy=([^&]*)/, 'orderBy=' + (grid.orderBy || '~'));

href = href.replace(/filter=(.*)/, 'filter=' + (grid.filterBy || '~'));

$exportXLS.attr('href', href);

}

</script>

But how can I make the filter work?