views:

33

answers:

1

I am learning how to create plugin and have problem in how to create my own customized selector.

If I have a table with nth row and nth column below

<table id="myTable">
   <tr><td></td>........<td></td></tr>
    .
    .
    .
   <tr><td></td>........<td></td></tr>
</table>

and I would like to create a plugin that has a selector that points to a specified row and column

This might how the plugin function looks like

$.fn.Cell = function(row,col){
   //select the cell here ... assuming the target element is a table above
   // this could somehow written below
  var mycell =  $(this).children().find('tr:eq(' + row + ')').children().find('td:eq(' + col + ')');
  // return the selector here

};

Then, I should have in the application code something like this:

$("#myTable").Cell(2,3).text("Wow"); // this writes a text to row 2, col 3.

Can you help fill in the missing code? I tried looking on the available plugins but never found features like this. I prefer to know how this works than knowing names and links of existing plugins. My goal is to learn the process of making plugins and to master jquery and javascript as well.

+1  A: 

Try this:

$.fn.Cell = function(row, col){
   return $('tr:nth-child('+row+')>td:nth-child('+col+')', this);
}
Daniel Moura