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.
Unfortunately, activation email could not send to your email. Please try again.
Syncfusion Feedback

Find selected checkboxes

Thread ID:

Created:

Updated:

Platform:

Replies:

109008 May 26,2013 02:01 AM UTC Jun 18,2013 09:13 AM UTC ASP.NET MVC (Classic) 4
loading
Tags: Grid
Brad Jeffery
Asked On May 26, 2013 02:01 AM UTC

Hi, I have a grid with a checkbox column like so: 
 column.Add(p => p.TeamId).HeaderText("Select").Format("<input type=\"checkbox\" name=\"check_{TeamId}\"  />").Width(40);

In my jQuery function, I would like to get each checked item in the grid, so another form on the page can use it. How do I do this, I can find any examples how to get the checked grid items?

Thanks in advance,

Brad

Hariharan J V [Syncfusion]
Replied On May 28, 2013 12:19 PM UTC

Hi Brad,

 

Thanks for using Syncfusion products.

 

We glad to inform you that we have achieved your requirement(‘Checked items’). We have prepared a simple sample to demonstrate this and please refer the below code snippets.

[Template.aspx]

var gridId = "Grid1";

           $("#Save").click(function (e) {

               var tempCheckedRecords = new Array();

               var gridobj = $find('Grid1');

               var checkboxes = $('#' + gridId + ' .check');

               $.each(checkboxes, function (index, element) {

                   if (element.checked == true) {

                       gridobj.selectRow($(element).parents("tr:first")[0].rowIndex);

                       gridobj.setJSONRecord();

                       tempCheckedRecords.push(gridobj.jsonrecord[0]); //Here you get the selected checkbox items

                   }

               });

 

 

And the same can be downloaded from the below link.

 

Sample: Sample.zip

 

Please try this, and if it does not meets your requirement, could you please provide more information on this so that we can provide a better solution quickly?.

 

Please let us know if you have any concerns.

 

Regards,

Hariharan J.V.


Greg Quinn
Replied On June 15, 2013 09:08 PM UTC

What is the point of posting samples in your forums if they get removed from your server?

Greg Quinn
Replied On June 15, 2013 10:46 PM UTC

I couldn't get the above example working, so here is what I got working....

Step 1 : Add a column to your grid with a checkbox, make sure to give a class named 'chkClass'
Note the {ID} value in the name denotes the name of your record ID in the database.
column.Add(p => p.ID).HeaderText("ID").Format("<input type='checkbox' name='check_{ID}' class='chkClass' />");

Step 2 : Add the following script to your page, what it does is look for all checkboxes in the page with the class 'chkClass', and determines if they have been checked. If they have been checked, they are pushed to the array called checkedRecords. Finally we do an Ajax post to the action in the controller named GetSelectedRecords. Note in order for this to work, make sure you specify the full URL as I have done.

$(document).ready(function() {
        $("#SaveButton").click(function (e) {
            var checkedRecords = new Array();
            $("input.chkClass:checkbox").each(function (index, element) {
                if (element.checked == true) {
                    var recordId = $(this).attr('name').replace('check_', '');
                    checkedRecords.push(recordId); 
                }
            });

            $.ajax({
                type: 'post',
                url: "http://localhost/MyController/GetSelectedRecords",
                data: { "checkedRecords": Sys.Serialization.JavaScriptSerializer.serialize(checkedRecords) },
                datatype: 'html'
            });
        });
    });

Step 3 : Add the GetSelectedRecords action in your controller, passing in the checkedRecords array..

 [AcceptVerbs(HttpVerbs.Post)]
        public ActionResult GetSelectedRecords(string checkedRecords)
        {
            //Deserialize checkRecords into an array of ints
            var selectedRecords = new JavaScriptSerializer().Deserialize(checkedRecords, typeof(int[]));

            var data = MyRepository.GetAllRecords();
            if (this.HttpContext.Request.IsAjaxRequest())
                return PartialView("_MyGrid", data);
            else
                return View("Index", data);
        }

Satheeskumar S [Syncfusion]
Replied On June 18, 2013 09:13 AM UTC

Hi Greg,

 

 

Thanks for using Syncfusion Products.

 

 

We glad to inform you that your requirement can be achieved using the below code snippet.

 

[Cshtml]

 

column.Add("Check").Format("<input type='checkbox' name='check_{ItemId}' class='chkClass' />");

 

[Script]

 

$("#SelectedRecordsPKey").click(function (e) {

 

            var params = {};

            var gridobj = $find('Grid1');

            var checkboxes = $('.chkClass');

 

            //Getting selected check box records

            $.each(checkboxes, function (index, element) {

                     if (element.checked == true)

                     {                   

                              var recordId = $(this).attr('name').replace('check_', '')

                              params["keys[" + index + "]"] = recordId;

                      }

            });

            $.ajax({

                       type: 'post',

                       url: "Home/SelectedRowsAction",

                       datatype: 'json',

                       data: params,

                       success: function (data) {

                               return data;

                       }

            });

});

 

[Controller]

 

[AcceptVerbs(HttpVerbs.Post)]

public JsonResult SelectedRowsAction(List<int> keys)

{

            return Json(keys); 

 }

 

For your convenience we have attached a sample. Could you use that sample and get back to us if you have any queries.

 

 

Let us know if you have any concerns.

 

 

Regards,

 

Satheeskumar S



SelectedRecordsKeyAtPost (2)_beb197d4.zip

CONFIRMATION

This post will be permanently deleted. Are you sure you want to continue?

Sorry, An error occured while processing your request. Please try again later.

Warning Icon You are using an outdated version of Internet Explorer that may not display all features of this and other websites. Upgrade to Internet Explorer 8 or newer for a better experience.Close Icon

;