Question

188

How do I get my selected GridView rows into a Javascript variable?

rated 0 times [ 191] [ 3] / answers: 1 / hits: 21720 / 12 Years ago, thu, april 12, 2012, 12:00:00

I use ASP.NET C# MVC3 with razor templates and I want to know the following:

I have a DevExpress GridView in which I can select rows.

When selected, I want to pass them into a Javascript variable. How do I do this?

And what if I have selected multiple rows at the same time, can I get them in an array or something?

Edit:
Thank you for the comment, I now have the following 'JQuery' function:

$(function () { // Verwijder functie

    $('#select').click(function () {

        var Delete = confirm(Weet u zeker dat u de geselecteerde records wilt verwijderen?);

        if (Delete) {

            //Verwijder Funtie

            var test = ;

            alert(test);

        } else {

            //Niks

        }

    });

});

I need to get the Id of the selected rows into the variable 'test', I tried it with GetSelectedFieldValuesCallback and GetSelectedFieldValues. But this is not working as I'm expecting.
If someone can provide some example I would really appreciate that.

Answers

Only authorized users can answer the question. Please sign in first, or register a free account.

makaylahk

Add To Favorites

Follow

Total Points: 166

Total Questions: 94

Total Answers: 117

Location: Gabon

Member since Sat, Jul 25, 2020

4 Years ago

makaylahk questions

1 Electron store data locally without localstorage

Tue, Apr 26, 22, 00:00, 2 Years ago

1 Request header field authorization is not allowed by Access-Control-Allow-Headers in preflight response when using http get req from JS to SlackAPI

Mon, Feb 28, 22, 00:00, 2 Years ago

1 How do I use the useState hook to change the color of my react icons to blue?

Wed, Jul 21, 21, 00:00, 3 Years ago

1 Property 'selectionStart' does not exist on type 'EventTarget'

Fri, Mar 19, 21, 00:00, 3 Years ago

1 How can I pass multiple values in a single prop in react?

Sat, Feb 27, 21, 00:00, 3 Years ago

View All

answered 12 Years ago quinlanhenryf · Accepted Answer

There is a surprising lack of examples for one of the most basic operations of a grid. Especially if you want to send rows back to the server for further processing.

The problem with grid.GetSelectedFieldValues() is that it generates a postback. Meaning you would need a second postback to actually send data back to the server.

The most elegant solution I was able to achieve is to use grid.GetSelectedKeysOnPage(). This will return selected key fields defined through settings.KeyFieldName = Id;

the view which will display your grid.

<script type=text/javascript>

    $(function () {

        $('#btn1').click(function () {

            simpleGrid.PerformCallback();

        });

    });

    function OnBeginCallback(s, e) {

        var selectedValues = s.GetSelectedKeysOnPage();

        e.customArgs[Id] = ;

        for (var i = 0; i < selectedValues.length; i++) {

            e.customArgs[Id] += selectedValues[i] + ',';

        }

    }

</script>

@Html.Partial(ProductsPartial, Model.Data)

<div id=btn1>

    btn

</div>

It is important that you create your grid in a separate partial view (don't know why, but that is what it says on the devexpress page.

The ProductsPartial partial view:

@Html.DevExpress().GridView(

        settings =>

        {

            settings.Name = simpleGrid;

            settings.KeyFieldName = Id;

            settings.CallbackRouteValues = new { Controller = yourController, Action = Postback };

            settings.SettingsText.Title = simpleGridWithPostback;

            settings.Settings.ShowTitlePanel = true;

            settings.Settings.ShowStatusBar = GridViewStatusBarMode.Visible;

            settings.SettingsPager.Mode = GridViewPagerMode.ShowAllRecords;

            settings.SettingsPager.AllButton.Text = All;

            settings.SettingsPager.NextPageButton.Text = Next &gt;;

            settings.SettingsPager.PrevPageButton.Text = &lt; Prev;

            settings.Width = new System.Web.UI.WebControls.Unit(200);

            settings.Columns.Add(Id);

            settings.Columns.Add(Name);

            settings.CommandColumn.Visible = true;

            settings.CommandColumn.ShowSelectCheckbox = true;

            settings.ClientSideEvents.BeginCallback = OnBeginCallback;

        }).Bind(Model).GetHtml()

And finally the controller in which you can process the data

public ActionResult Postback()

{

    String data = Request[Id];

}

This way you can process all the data you want server side