This project is read-only.

Get selected row data on button click

Nov 25, 2013 at 4:28 PM
I read the tutorial on how to get the selected row data, but it only fires when the selected row has changed. Is there some way to do this only after a button click? I tried the following but it doesn't work:
$(document).on('click', '#editItem', function () {

    pageGrids.expenseReportGrid.onRowSelect(function (e) {


I realize that it doesn't work because the onRowSelect is waiting for a row to be selected, correct? Is there a way around that? I want the row to be selected the a button to be clicked to do something using the data from the selected row. Below is the view code if it helps

Scripts & Stylesheets:
    <script src="/Scripts/jquery-1.9.1.js" type="text/javascript"></script>
    <script src="/Scripts/jquery-1.9.1.min.js" type="text/javascript"></script>
    <script src="/Scripts/app/api.js" type="text/javascript"></script>
    <script src="/Scripts/app/ui.js" type="text/javascript"></script>
    <script src="/Scripts/gridmvc.min.js" type="text/javascript"></script>
    <link rel="stylesheet" type="text/css" href="/Content/bootstrap.min.css">
    <link rel="stylesheet" type="text/css" href="/Content/Gridmvc.css">
Grid code:
@using (Html.BeginForm())

@Html.Grid(Model).Named("expenseReportGrid").Columns(columns =>
        columns.Add(c => c.Id);
        columns.Add(c => c.Date).Filterable(true);

        columns.Add(c => c.Type_of_Visit).Titled("Type of visit").Filterable(true);
        columns.Add(c => c.Clinic_Id).Titled("Facility").Filterable(true);

    <input type="button" id="editItem" name="editItem" value="Edit">
Nov 26, 2013 at 5:44 AM
You can disable button by default and enable it after row is selected:
<input type="button" id="editItem" disabled name="editItem" value="Edit">

var selectedRow;
$(document).on('click', '#editItem', function () {

    pageGrids.expenseReportGrid.onRowSelect(function (e) {
              selectedRow = e.row;


Nov 27, 2013 at 12:13 PM
With that code nothing happens... onRowSelect is within the editItem click event but since its disabled it never fires and so nothing ever happens. I tried it anyway, but nothing happens.
Dec 3, 2013 at 2:49 AM
onRowSelect event should enable #editItem checkbox. Try to use browser developer tools (F12) to understand what happens
Mar 31, 2014 at 10:44 AM
Please help me out in selecting rows of Grid.

@Html.Grid(Model).Named("ordersGrid").Columns(columns =>
{ columns.Add().Titled("Name").Encoded(false).Sanitized(false).SetWidth(30).RenderValueAs(c => @<div style="width: 100px;">
<input type="text" value="@c.Name @c.LastName " id="Name"/> </div>);
columns.Add(c => c.RecordId).Titled("Actions").Encoded(false) .Sanitized(false) .SetWidth(30) .RenderValueAs(c => CustomRenderingOfColumn(c)); }).WithPaging(15).Sortable(true)

@helper CustomRenderingOfColumn(MTLApp.Models.MemberModel item)
<div style="width: 100px;" id="dvIdRecord>
<img src="~/Images/edt_btn_sml.png" onclick="Edit();" class="editDialog" id="RecordIdEdit" />
<div style="width: 100px; display: none;" id="dvIdRec>
    <img src="~/Images/save.jpg" id="btnAddNew1" onclick="AddNewData();" /><img src="~/Images/cancel.jpg" id="btnCancel1" onclick="ClearRecords();" />

I want to show dvIdRec on Edit() click. But when i do this ,it will open for the first record. And i want to open for Selected row of a Grid.

Please help me out on this.