{"id":1379,"date":"2022-08-30T15:16:02","date_gmt":"2022-08-30T15:16:02","guid":{"rendered":"https:\/\/unknownerror.org\/index.php\/2013\/11\/15\/getting-html-table-data-td-i-e-text-or-val-using-table-header-th-into-textarea-collection-of-common-programming-errors\/"},"modified":"2022-08-30T15:16:02","modified_gmt":"2022-08-30T15:16:02","slug":"getting-html-table-data-td-i-e-text-or-val-using-table-header-th-into-textarea-collection-of-common-programming-errors","status":"publish","type":"post","link":"https:\/\/unknownerror.org\/index.php\/2022\/08\/30\/getting-html-table-data-td-i-e-text-or-val-using-table-header-th-into-textarea-collection-of-common-programming-errors\/","title":{"rendered":"Getting HTML table data (td) (i.e. text or val) using table header (th) into Textarea-Collection of common programming errors"},"content":{"rendered":"<p>I have SQLite3 (i.e. Spatialite query) that outputs the results into HTML table. I want to get the AsText(Geometry) data to output in<\/p>\n<p>Here is the <code>table<\/code> and some assumptions.<\/p>\n<table>\n<tr>\n<th>name<\/th>\n<th>AsText(Geometry))<\/th>\n<\/tr>\n<tr>\n<td>Andres Street<\/td>\n<td>LINESTRING(7.120068 43.583917,7.120154 43.583652,7.120385 43.582716,7.12039 43.582568,7.120712 43.581511,7.120873 43.580718)<\/td>\n<\/tr>\n<\/table>\n<p><code>$('#wktInput').click(function(){ ??? ??? var asTextGeometryText = $(\"#wktResult\").text(asTextGeometryText); }); 'Should Display AsText(Geometry Column here!'<\/code><\/p>\n<p>This is the DOM<\/p>\n<pre><code>#~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~\n    var fieldNames = aResult.fieldNames;\n    var records = aResult.data;\n    var numFields = fieldNames.length;\n    var numRecords = records.length;\n    var container = document.getElementById('queryResults');\n    container.innerHTML = '';\n    var table = document.createElement('table');\n    container.appendChild(table);\n    var headerRow = document.createElement('tr');\n   table.appendChild(headerRow);\n    for(var i = 0; i &lt; numFields; i++){\n        var header = document.createElement('th');\n        header.innerText = fieldNames[i];\n        headerRow.appendChild(header);\n    }\n\n    for(var i = 0; i &lt; numRecords; i++){\n        var tableRow =  document.createElement('tr');\n        table.appendChild(tableRow);\n\n        for(var j = 0; j &lt; numFields; j++){\n            var tableData = document.createElement('td');\n            tableRow.appendChild(tableData);\n            tableData.innerText = records[i][j];\n        }\n    }\n}\n\n\n\n\n<\/code><\/pre>\n<p>Thanks in advance<\/p>\n<p>It seems that texarea uses id for value.<\/p>\n<p><code>example text<\/code> [This problem is related to textarea in jQuery as well][1]<\/p>\n<p>This example below demonstrate that jquery is not working in textarea using id.<\/p>\n<pre><code>    \n$(function() {\n    $('button').click(function() {\n        var row = $('input:first').val();\n        var column = $('input:eq(1)').val();\n        var cell = $('table tr:eq('+row+') td:eq('+column+')');\n        if (cell.length == 0) {\n            $('#value').text('Undefined');\n        }\n        else {\n            $('#value').text(cell.text());\n        }\n    });\n});\n\n\n\n\n<\/code><\/pre>\n<h1><code>Table Cell Value<\/code><\/h1>\n<pre>\n<\/pre>\n<table>\n<tr>\n<td>Cell 1-1<\/td>\n<td>Cell 1-2<\/td>\n<td>Cell 1-3<\/td>\n<\/tr>\n<tr>\n<td>Cell 2-1<\/td>\n<td>Cell 2-2<\/td>\n<td>Cell 2-3<\/td>\n<\/tr>\n<tr>\n<td>Cell 3-1<\/td>\n<td>Cell 3-2<\/td>\n<td>Cell 3-3<\/td>\n<\/tr>\n<\/table>\n<p><code>Row: Column: Value: ?<br \/>\nTextarea: Try this! this is not working Get Value<\/code><\/p>\n<p>All is working in this example. Then added a textarea to see if I can make it work. Textarea is not working in this example. Something wrong with jquery and textarea using id as well as name.<\/p>\n<p><code>Textarea: Try this! this is not work as well<\/code><\/p>\n<p>How this does not work.<\/p>\n<p>New info about this <code>textarea<\/code> value.<\/p>\n<pre><code>$('#id_of_textarea').attr('value'); \/\/to get and...\n$('#id_of_textarea').attr('value','updated value of textarea'); \/\/to set it...\n\n\n\nfunction update_textarea(obj)\n{\n    $('#mydiv').text($(obj).attr('value')); \/\/whatever you type in the textarea would be reflected in #mydiv\n<\/code><\/pre>\n<p>}<\/p>\n<p>http:\/\/blog.ekini.net\/2009\/02\/24\/jquery-getting-the-latest-textvalue-inside-a-textarea\/<\/p>\n<p>It seems that my problem is not rendering a regular html tablet but a direct render to the screen.<\/p>\n<p>The author of QuickConnect say told me,<\/p>\n<blockquote>\n<p>If you want one of those values so that you can use it you need to pull it out of the 2D array.<\/p>\n<\/blockquote>\n<ol>\n<li>\n<p>Do you mean displaying the content in AsText(Geometry) column at the textarea?<\/p>\n<pre><code>var text = []\n$('table').find('tr:has(td)').each(function(){\n    text.push($.trim($(this).find('td:eq(1)').html()));\n})\n\/\/ and you set it to your textarea\n$('textarea[name=\"wktResult\"]').val(text.join('\\n'));\n<\/code><\/pre>\n<\/li>\n<li>\n<p>1- assign an id attribute to your textarea to use it in jquery or if your page contain just one textarea you can use tag name insteasd.<\/p>\n<p>2- to get text of textarea you need just call text function without any parameters<\/p>\n<pre><code>$('#wktInput').click(function(){\n     var asTextGeometryText =$('table').find('th').eq(2).text();\n     $('#id_of_textarea').attr('value',asTextGeometryText);\n});\n<\/code><\/pre>\n<\/li>\n<\/ol>\n<p id=\"rop\"><small>Originally posted 2013-11-15 09:07:27. <\/small><\/p>","protected":false},"excerpt":{"rendered":"<p>I have SQLite3 (i.e. Spatialite query) that outputs the results into HTML table. I want to get the AsText(Geometry) data to output in Here is the table and some assumptions. name AsText(Geometry)) Andres Street LINESTRING(7.120068 43.583917,7.120154 43.583652,7.120385 43.582716,7.12039 43.582568,7.120712 43.581511,7.120873 43.580718) $(&#8216;#wktInput&#8217;).click(function(){ ??? ??? var asTextGeometryText = $(&#8220;#wktResult&#8221;).text(asTextGeometryText); }); &#8216;Should Display AsText(Geometry Column here!&#8217; This [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[1],"tags":[],"class_list":["post-1379","post","type-post","status-publish","format-standard","hentry","category-uncategorized"],"_links":{"self":[{"href":"https:\/\/unknownerror.org\/index.php\/wp-json\/wp\/v2\/posts\/1379","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/unknownerror.org\/index.php\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/unknownerror.org\/index.php\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/unknownerror.org\/index.php\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/unknownerror.org\/index.php\/wp-json\/wp\/v2\/comments?post=1379"}],"version-history":[{"count":0,"href":"https:\/\/unknownerror.org\/index.php\/wp-json\/wp\/v2\/posts\/1379\/revisions"}],"wp:attachment":[{"href":"https:\/\/unknownerror.org\/index.php\/wp-json\/wp\/v2\/media?parent=1379"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/unknownerror.org\/index.php\/wp-json\/wp\/v2\/categories?post=1379"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/unknownerror.org\/index.php\/wp-json\/wp\/v2\/tags?post=1379"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}