We use cookies to give you the best experience on our website. If you continue to browse, then you agree to our privacy policy and cookie policy.
Hi Yujin,
Thanks for using Syncfusion Products.
Query 1: “to set checkbox or radiobutton in the
first column of the grid”
We suggest you to use template column to have check box in a column and to have checkbox in column header, we can use HeaderText property.
Please refer the following code snippets.
Code Snippet:
[CSHTML]
@{Html.Syncfusion().Grid<custom.Models.Student>("GenericListGrid")
…
cols.Add("Add").HeaderText("<input
type='checkbox' id='headercheck'/>").TemplateColumn(true).TemplateName("Partial").Width(130);
..
)
Query 2: “Select-All functionality”
For Select-All functionality we can use click event
of column header checkbox and in that event we can select all rows by using the
client-side function “selectMutipleRows”. Please refer the
following code snippet.
Code Snippet:
[JAVASCRIPT]
$('#headercheck').click(function ()
{
var checkbox = $find("GenericListGrid")._gridContentTable.children[1];
var rowslength = $find("GenericListGrid")._gridContentTable.rows.length;
for (var i = 0; i < rowslength; i++) {
$(checkbox.rows[i]).find("#check").click()
var univCode =
$($(checkbox.rows[i].children)[2]).text();
if ($("#headercheck").is(":checked") != true) {
$find("GenericListGrid").deselectRow((rowslength - 1)); // To
unselect rows
}
else {
myArray.push(univCode); // TO get records for deletion
operation
$find("GenericListGrid").selectMutipleRows(0, (rowslength - 1));
// To select rows
}
}
});
Query 3: “Opposite Select
functionality”
We have created custom sample request
for this query and we will update you with solution on February 21, 2014.
Query 4: “custom button in the toolbar to pop-up a
window and Delete-All functionality”
We can have a custom button in toolbar using “Template”
property and by using “OnToolbarClickEvent” clientsideevent we can pop-up a dialog
window. For Delete-All functionality, we can pass the selected records to
DeleteAll Controller Action and from there we can delete those records. Please
refer the following code snippet:
Code Snippet:
[CSHTML]
@{Html.Syncfusion().Grid<custom.Models.Student>("GenericListGrid")
…
.ClientSideEvents(c
=> c.OnToolbarClickEvent("ToolbarClick"))
.ToolBar(tools =>
{
tools.Template(@<div>
<li><button id="opener">Open
the dialog</button></li>
<li><button id="check1">DeleteAll</button></li>
</div>
);
…
)
[JAVASCRIPT]
function
ToolbarClick(sender, args)
{
var checkbox = $find("GenericListGrid")._gridContentTable.children[1];
var rowslength = $find("GenericListGrid")._gridContentTable.rows.length;
if (args._currentItemIndex ==
0)
{
$('#dialog').dialog({
title: "dialog",
autoOpen: false,
width: 400,
height:350
});
$("#dialog").dialog("open");
}
if (args._currentItemIndex ==
1)
{
if(myArray.length!=0){
$.ajax({
url: "/Layout/DeleteAll",
type: 'POST',
datatype: 'json',
contentType: 'application/json; charset=utf-8',
data: JSON.stringify({ DelAll: myArray }),
success: function (data) {
$find("GenericListGrid").sendRefreshRequest();
$('#headercheck').prop('checked', false);
myArray = [];
}
});
}
else{
alert("All
Records are not selected");
}
}
}
For your convenience we have created a sample and
the same can be downloaded from below link.
Sample:
http://www.syncfusion.com/downloads/support/directtrac/118618/custom1851820260.zip
Please let us know if you have any queries.
Regards,
Alan Sangeeth S
Hi Yujin,
Thanks for your patience.
We have created custom sample for your requirement
and the same can be downloaded from below link.
Sample:
http://www.syncfusion.com/downloads/support/directtrac/119364/custom-1431779880.zip
Please let us know if you have any queries.
Regards,
Alan Sangeeth S
