How do you get to the underlying data in an MVC3 WebGrid using jQuery?

I have a simple MVC WebGrid. When a user clicks on a row, I'd like to do something based on the row he clicked. Its pretty simple in jqGrid and even using jquery templates, but I'd like to get it right using the MVC WebGrid.

I have the following:

<h2>OrderList</h2> @{ var grid = new WebGrid(canPage: true, rowsPerPage: 20, canSort: true, ajaxUpdateContainerId: "grid_Orders"); grid.Bind(Model.Orders, rowCount: Model.TotalOrders, autoSortAndPage: true); grid.Pager(WebGridPagerModes.All); @grid.GetHtml(htmlAttributes: new { id = "grid_Orders" }, columns: grid.Columns( grid.Column(columnName: "OrderNo", header: "Order No"), grid.Column(columnName: "TotalAmountDisplay", header: "Amount", format:@<div style="text-align:right"> R @item.TotalAmountDisplay</div>, canSort: false) )); }

and the following jQuery

$(document).ready(function () { $("#grid_Orders").delegate("tbody tr", "hover", function () { $(this).css("cursor", "pointer"); $(this).toggleClass("datahighlight"); }); $("#grid_Orders").delegate("tbody tr", "click", function () { //How do I get the underlying data in this row??? }); });

-------------Problems Reply------------

Unfortunately you will need to use jQuery in order to access each row's html data - there is no rich programming model against it that Im aware of (the beauty of MVC at times as well ha)

The same scenario applies here: MVC WebGrid - How to programatically get the current page, sort column etc. mvc Views:0 Time:2011-05-31

Related post

  • Associating data to a DOM element for jQuery 2008-12-12

    In a previous life, I might have done something like this: <a href="#" onclick="f(311);return false;">Click</a><br/> <a href="#" onclick="f(412);return false;">Click</a><br/> <a href="#" onclick="f(583);return f

  • What is the maximum amount of data i passed through querystring of jquery ajax? 2011-04-12

    What is the maximum amount of data i passed through querystring of jquery ajax? --------------Solutions------------- Query strings form part of the URL for an HTTP GET request, so the main limit you'll hit is URL length. Here's a question about that:

  • ASP.Net MVC: Can you use Data Annotations / Validation with an AJAX / jQuery call? 2011-04-28

    Can you use Data Annotations / Validation with an AJAX / jQuery call? If so, please provide an example or a post which shows an example. Basically I have seen an example of how to use Data Annotations, however it was with a full post back. Is there a

  • Do we have any option to copy data from clip board to MVC Jquery grid 2011-08-16

    I have to copy data from excel using clipboard to Jquery grid and provide user an opportunity to edit the data copied and then save it to database. Is there a way to do it with Jquery. I am looking at Jquery grid examples

  • how to get data from facebook graph api in jquery 2011-10-02

    I am trying to get json data using facebook graph api through jquery. I am using the code below. I am trying to get json data using $.getJSON function but it displays this error in firebug NetworkError: 400 Bad Request -

  • Passing strongly type form model data in mvc through jquery 2011-11-03

    It is easy to submit form to an action method in the controller which has strongly typed textboxes for example, with a submit button, but what if I want to send the exact same form with the strongly typed textboxes through jquery perhaps the $.ajax c

  • Set data-theme programatically on textbox in Jquery Mobile 2012-01-19

    Is there a way to set the "data-theme" of a textbox in Jquery mobile? $("#txtEmail").attr("data-theme", "b"); ...doesn't work. I like to use this to to display invalid form items in form validation. --------------Solutions------------- You have to ma

  • How To Use Ajax To Retrieve My Data From a PHP File (Using JQuery) 2012-02-09

    I am trying to use an Ajax call using JQuery on my html page to retrieve the data field 'Page' which is stored using PHP. I would like to retrieve $Page from the input.php or alternatively $f1 from the output.php ( this is the same data). and put thi

  • I need to retrieve data from a RESTful webservice using jquery 2012-02-16

    i'm new to this RESTful webservice stuff so i'm asking if you can help me with this one. I need to retrieve data from a restful webservice using jquery. now i know that i can do that using $.ajax or $.getJSON but the question is how can i do it if my

  • How can I format a MVC3 WebGrid date column for local timezone? 2012-03-06

    My datetime values are stored as UTC in the database. I want to display them in the local timezone using the standard MVC3 WebGrid control, but don't have a clue how to do that or where to look for the answer. My current code looks like this: grid.Co

  • getting data from xml into html using jquery 2012-04-21

    i am getting data from XML into html using jquery, i build a function which is working perfectly which is given below function parseXml(xml){ xmlcontent = xml; $('#file').html('$'+ GetDeals('delhi','india')); $('#file1').html('$'+ GetDeals('mumbai','

  • Populate a form with data from an associative array with jQuery 2008-10-05

    Last time I asked about the reverse process, and got some very efficient answers. I'm aiming for least lines of code here. I have a form of fields and an associative array in the {fieldname:data} format, I want to populate a corresponding form with i

  • Best Practice for Storing JSON Data That Will Be Passed to jQuery Plugin 2009-02-05

    I'm looking for the "best practice" as to where the JSON should be stored if it's just a string array. Should it be stored in a variable in a script block in the HTML page? Should it be stored in a JavaScript file outside of the HTML for separation?

  • Use of $.data(li, "ac_data", data[i]) from function fillList() of jquery-autocomplete 2009-11-25

    I'm using the jquery-autocomplete plugin of Jörn Zaefferer and I can't understand the use of this line in the fillList() function: $.data(li, "ac_data", data[i]); Please help me. Thanks. --------------Solutions------------- each tag "li"

  • How to pass data (a dropped element) to a jQuery dialog? 2009-11-26

    This is probably a simple one but I cant get my head around it. Basically I have a list that is set up to accept dropped elements. I want a jQuery dialog to display in response to a dropped element and, upon the user pressing OK, post to the server w

  • Date Picker with Simple Javascript or Jquery 2009-12-26

    I have a form with multiple date fields, Can anyone suggest me simple date picker in jquery or in simple javascript? Note: My form contains multiple date fields --------------Solutions------------- Here's a really simple (no JS frameworks required) o

  • How to display JSON data in a select box using jQuery? 2010-02-21

    this is my JSON data: {"ACT":"Australian Capital Territory","NSW":"New South Wales","NT":"Northern Territory","QLD":"Queensland","SA":"South Australia","TAS":"Tasmania","VIC":"Victoria"} How to display this JSON data in a selectlist? --------------So

  • Efficient way to serialize form data to .NET ASHX/C# from JQuery 2010-02-25

    As most people, I have read a seen a lot of examples of getting data from a form (html) and being able to effeciently handle the posted data say within an ASHX (Generic Handler) page... and from there say update a database via a stored procedure.. ma

  • I am not able to update form data to MySQL using PHP and jQuery 2010-04-06

    What happens is that I'm able to add and delete records from form using jQuery and PHP scripts to MYSQL database, but I am not able to update data which was retrieved from the database. The file structure is as follows: index.php is a file with jQuer

Copyright (C), All Rights Reserved.

processed in 0.133 (s). 11 q(s)