35462

Get all data in html table into array

So far I can get all generic text data into an array, but I'm struggling with the select boxes within the table cell. So far in my jQuery I have this

$('.image-button').click(function(){ var myTableArray = []; $("table#imgList tr").each(function() { var arrayOfThisRow = []; var tableData = $(this).find('td'); if (tableData.length > 0) { tableData.each(function() { if($(this).has('select').length){ arrayOfThisRow.push($(this + ' select option:selected').text()); } else { arrayOfThisRow.push($(this).text()); } }); myTableArray.push(arrayOfThisRow); } }); console.log(myTableArray); });

It fails once it goes into the if has select statement, with an error I have not seen before:

Uncaught Error: Syntax error, unrecognized expression: [object HTMLTableCellElement]

I'm not really sure what is wrong with the above code so if anyone can help I'd much appreciate that.

Answer1:

Firstly, you can't append a string to an object to create the selector. You need to use find() to get the select within the current td:

arrayOfThisRow.push($(this).find('select option:selected').text());

Secondly, you can shorten your code by using map() to create the array:

$('.image-button').click(function(){ var myTableArray = $("table#imgList tr").map(function() { var arrayOfThisRow = $(this).find('td').map(function() { return $(this).has('select').length ? $(this).find('select option:selected').text() : $(this).text(); }).get(); return arrayOfThisRow; }).get(); console.log(myTableArray); });

Answer2:

This line:

arrayOfThisRow.push($(this + ' select option:selected').text());

should be changed to:

arrayOfThisRow.push($('select option:selected', this).text());

or:

arrayOfThisRow.push($(this).find('select option:selected').text());

Recommend

  • Why serializing an ImageList doesn't work well
  • Method in HomeController not called
  • How can I add image to ListView when I set it to details?
  • PyQt QAbstractTableModel checkbox not checkable
  • Filter NSMutableDictionary data in UITableView
  • DuplicateKeyException in LINQ, but I've set auto increment and auto sync
  • Adding new table in rest api of prestashop webservice
  • Slicing an SPA into several components and use AngularJS
  • force json_encode to create strings
  • distinct values from multiple fields within one table ORACLE SQL
  • Select inner HTML item in CSS
  • Double-click autofill - dynamic based on adjacent cell
  • garbled css name when styling within UiBinder
  • Angular Bootstrap Carousel Slide Transition not working correctly
  • How to open html table in xls on click of a button
  • how to get data attributes of dynamically generated element
  • Responsive design method for collapsing a div
  • Iron Router: How do I send data to the layout?
  • Building Qt project for C++11 standard
  • Silverlight DependencyProperty.SetCurrentValue Equivalent
  • Keep this build forever option - Jenkins
  • How to define custom class, title, and target in Link Browser for content elements and the new rte_c
  • How do I access an unhandled exception in an MVC Error view?
  • Google Custom Search with transparent background
  • Read a local file using javascript
  • vba code to select only visible cells in specific column except heading
  • Unanticipated behavior
  • How to delete a row from a dynamic generate table using jquery?
  • using HTMLImports.whenReady not working in chrome
  • Authorize attributes not working in MVC 4
  • EntityFramework adding new object to nested object collection
  • Binding checkboxes to object values in AngularJs
  • How to Embed XSL into XML
  • UserPrincipal.Current returns apppool on IIS
  • Conditional In-Line CSS for IE and Others?
  • To Get the radio button value in ruby on rails
  • Net Present Value in Excel for Grouped Recurring CF
  • How to push additional view controllers onto NavigationController but keep the TabBar?
  • jQuery Masonry / Isotope and fluid images: Momentary overlap on window resize
  • How to load view controller without button in storyboard?