title: Make HTML table columns resizable with jQuery
body: <p>I am trying <strong>colResizable.min.js</strong> to make html table column resizable. In my jsp page I have included <strong>colResizable.min.js</strong> file as below.</p>
  
  <pre><code>&lt;head&gt;
  &lt;meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1"&gt;
  &lt;title&gt;&lt;/title&gt;
  &lt;link href="assets/css/lib/bootstrap.min.css" rel="stylesheet"&gt;
  &lt;link href="assets/css/lib/bootstrap-responsive.min.css"
  rel="stylesheet"&gt;
  &lt;link href="css/report.css" rel="stylesheet"&gt;
  &lt;script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"&gt;  &lt;/script&gt;
  &lt;script
  src="//ajax.googleapis.com/ajax/libs/jqueryui/1.10.2/jquery-ui.min.js"&gt; &lt;/script&gt;
  &lt;script src="http://mrrio.github.io/jsPDF/dist/jspdf.debug.js"&gt;&lt;/script&gt;
  &lt;script src="assets/js/lib/colResizable.min.js"&gt;&lt;/script&gt;
  </code></pre>
  
  <p></p>
  
  <p>Then I use this.</p>
  
  <pre><code>$("#table-0").colResizable();
  </code></pre>
  
  <p>I am getting following errors in my console log.</p>
  
  <blockquote>
    <p>colResizable.min.js:2 Uncaught TypeError: Cannot read property 'msie' of undefined colResizable.min.js:2
      Uncaught TypeError: $(...).colResizable is not a function</p>
  </blockquote>
  
  <p>My full code.</p>
  
  <pre><code>&lt;head&gt;
  &lt;meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1"&gt;
  &lt;title&gt;&lt;/title&gt;
  &lt;link href="assets/css/lib/bootstrap.min.css" rel="stylesheet"&gt;
  &lt;link href="assets/css/lib/bootstrap-responsive.min.css"
  rel="stylesheet"&gt;
  &lt;link href="css/report.css" rel="stylesheet"&gt;
  &lt;script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"&gt;  &lt;/script&gt;
  &lt;script
  src="//ajax.googleapis.com/ajax/libs/jqueryui/1.10.2/jquery-ui.min.js"&gt; &lt;/script&gt;
  &lt;script src="assets/js/lib/jquery-migrate-1.2.1.js"&gt;&lt;/script&gt;
  &lt;script src="assets/js/lib/jspdf.debug.js"&gt;&lt;/script&gt;
  &lt;script src="assets/js/lib/colResizable.min.js"&gt;&lt;/script&gt;
  &lt;script src="assets/js/export.js"&gt;&lt;/script&gt;
  &lt;script src="assets/js/saveButtonHandler.js"&gt;&lt;/script&gt;
  &lt;script type="text/javascript"&gt;
  $(window)
          .load(
                  function() {
                      var myList;
  
                      if ($('#table-0').length) {
  
                          var $row = $('#table-0 tr:first');
                          $row.remove();
                      } else {
                          $('#design').append(
                                  "&lt;table id='table-0' border=1&gt;&lt;/table&gt;");
                      }
  
                      $
                              .getJSON(
                                      "/ReportBuilder/data.json",
                                      function(data) {
                                          console.log("11122333");
                                          console.log(data);
                                          myList = data;
  
                                          if (myList.length == 0) {
                                              alert("Your Report Has No Data");
                                          } else {
                                              var columns = [];
                                              var headerTr$ = $('&lt;tr/&gt;');
  
                                              for (var i = 0; i &lt; myList.length; i++) {
                                                  var rowHash = myList[i];
                                                  for ( var key in rowHash) {
                                                      if ($.inArray(key,
                                                              columns) == -1) {
                                                          columns.push(key);
                                                          headerTr$.append($(
                                                                  '&lt;th/&gt;')
                                                                  .html(key));
                                                      }
                                                  }
                                              }
                                              $("#table-0").append(headerTr$);
  
                                              for (var i = 0; i &lt; myList.length; i++) {
                                                  var row$ = $('&lt;tr/&gt;');
                                                  for (var colIndex = 0; colIndex &lt; columns.length; colIndex++) {
                                                      var cellValue = myList[i][columns[colIndex]];
  
                                                      if (cellValue == null) {
                                                          cellValue = "";
                                                      }
  
                                                      row$
                                                              .append($(
                                                                      '&lt;td/&gt;')
                                                                      .html(
                                                                              cellValue));
                                                  }
                                                  $("#table-0").append(row$);
                                              }
                                          }
  
                                      });
                      $(document).on("dblclick", "#table-0 th", function() {
                          $(this).prop('contenteditable', true);
                      });
  
                      $(document).on("dblclick", "#subtitle-0", function() {
                          $(this).prop('contenteditable', true);
  
                      });
  
                      $(document).on("dblclick", "#title-0", function() {
                          $(this).prop('contenteditable', true);
                      });
  
                      $("table").colResizable();
                      //makeResizable();
  
                  });
  &lt;/script&gt;
  &lt;/head&gt;
  </code></pre>
  
  <p>Whats wrong with my code ? Any suggestions are appreciated.</p>
  
  <p>Thank You</p>