How can i get the value of a cell in JQuery

[himit]

Hi All,

I am using JQuery in my solution and was trying to get the value of the cell which has been clicked. however, after all my searches i ended up with no exact solution.
the most common solution i got was to select a row (by making multi select true and selecting the checkbox) and then to find out the column.

I simply need the value of the cell that I've clicked. i might be asking a very simple question but this is something i am not able to find a solution for.

Please assist.

[kokoro90]

Hi,

Could you please show us the relevant code? Without that, it is impossible to answer your question, as you could be referring to any of an unlimited number of scenarios...

Cheers

[ivatanako]

Maybe you could add the click event on every data on the cell.

cheers

[himit]

Hi kokoro90 & ivatanako,

thanks for the response.

I am working with struts 2.2, struts-jquery-plugin 2.5.1 and struts2-
jquery-grid-plugin-2.5.1.

I tried following code that help in getting the complete row with multiselect to be set as true-

var grid = jQuery('#gridTable'); 
var sel_id = grid.jqGrid('getGridParam', 'selrow'); 
var myCellData = grid.jqGrid('getCell',sel_id,'configSetVersion'); 
alert(myCellData);

it works fine.
i want the same thing on clicking on any cell.

i tried using the onclick function and can get the cell value however i don't know how to get the complete row from that.

the final goal that i've to achieve is to get the value of a particular column on clicking on any cell of that row.
for example if i have 3 columns name 'appid', 'appname' and 'appver', then on clicking on any of the cell, say 3rd row 'appname', i need the value of 'appid' in that row (3rd row in this case).

Please assist.

[Airshow]

Himit,

First, construct your HTML like this:

<table id="myTable" border>
<tr><th>appid</th><th>appname</th><th>appver</th></tr>
<tr><td class="appid">100</td><td class="appname">App 1</td><td class="appver">1.1</td></tr>
<tr><td class="appid">200</td><td class="appname">App 2</td><td class="appver">2.2</td></tr>
<tr><td class="appid">300</td><td class="appname">App 3</td><td class="appver">3.3</td></tr>
</tr>
</table>

By giving the tds classes, they can be tested/addressed in javascript:

Simple:

$(function(){
  $("#myTable tr").click(function(){//click anywhere in a row
    alert($(this).find(".appid").html());
  });
});

Mode complicated:

$(function(){
	$("#myTable td").click(function() {//click any table cell
		var $this = $(this);
		$row = $this.closest('tr');
		switch($this.get(0).className) {//branch depending on which cell was clicked
			case "appid":
				alert($row.find(".appname").html());
			break;
			case "appname":
				alert($row.find(".appver").html());
			break;
			case "appver":
				alert($row.find(".appid").html());
			break;
		}
	});
});

Airshow

[himit]

Thanks for the answere Airshow.