Footable 2 Select rows

Question

Here's a quick example of one way you could do this:

<!DOCTYPE html>
<html>

<head>
  <script data-require="jquery@*" data-semver="2.0.3" src="http://code.jquery.com/jquery-2.0.3.min.js"></script>
  <link rel="stylesheet" href="style.css" />
  <script src="script.js"></script>
</head>

<body>
  <a id="sendSelectedButton" href="#">Send Selected</a>
  <table id="theTable">
    <thead>
      <tr>
        <th></th>
        <th>Description</th>
        <th></th>
      </tr>
    </thead>
    <tbody>
      <tr>
        <td>
          <input type="checkbox">
        </td>
        <td>Job 1</td>
        <td><a href="#">send</a>
        </td>
      </tr>
      <tr>
        <td>
          <input type="checkbox">
        </td>
        <td>Job 2</td>
        <td><a href="#">send</a>
        </td>
      </tr>
      <tr>
        <td>
          <input type="checkbox">
        </td>
        <td>Job 3</td>
        <td><a href="#">send</a>
        </td>
      </tr>
    </tbody>
  </table>
  <script>
    function sendRows(rows) {
      if (rows === undefined ||
        rows === null ||
        rows.length === 0)
        return;

      //Do stuff to send rows here.  
    }

    $(document).ready(function() {
      $("#sendSelectedButton").on("click", function() {
        var checkRows = $("#theTable").find("tbody tr").has("input:checked");
        sendRows(checkRows);
      });

      $("table").on("click", "tr a", function() {
        var row = $(this).parents("tr");
        sendRows(row);
      });
    });
  </script>
</body>
</html>

Here's a plunk with the same code: http://plnkr.co/edit/tK4WpCvV7vSjVFmKlJIx

I didn't add any Footable here because it doesn't seem like that Footable will affect it one way or another.

I think you'll find that things quickly get a lot more complex as your application matures. I'd suggest you look some type of data binding. I personally use Knockout.js. Even if you don't decide to use Knockout.js, I think their tutorial is pretty cool. (http://knockoutjs.com/index.html)