2017-09-07 3 views
1

jQueryパッケージHTMLtoJSONを使用して、値をHTML表からjson形式に変換しています。私が遭遇している問題は、文書化されたオプションのいずれかを使用して実際の入力値を取得することができないということです。 jsonはこの場合、キー値のペアの例である「測定深さ」:「 "< \ td>"」の間にあるべきものを返します。「339」HTMLtoJSONを使用してHTML表からJSON形式に値を戻す

あなたは抽出機能を実装する必要がありますJavascriptを

<script language='Javascript'> 
    function deleteRow(row) 
{ 
    var i=row.parentNode.parentNode.rowIndex; 
    document.getElementById('Table').deleteRow(i); 
} 


    function addRow(row) 
{ 
    var i = row.parentNode.parentNode.rowIndex; 
    var tr = document.getElementById('Table').insertRow(i+1); 
    tr.innerHTML = row.parentNode.parentNode.innerHTML; 
    tr.children[0].innerHTML = tr.parentNode.querySelectorALL("tr").length-1; 
} 

$('#convert-table').click(function() 
{ 
    var table = $('#Table').tableToJSON(
     { 
      onlyColumns:[0,1,2], 
      textDataOverride:'text-override' 
     }); 
    console.log(table); 
    alert(JSON.stringify(table)); 
}); 


</script> 

HTML

<!DOCTYPE html> 
<html> 
<head> 
    <meta http-equiv='Content-Type' content='text/html; charset=UTF-8'/> 
    <script type='text/javascript' src='https://s3.amazonaws.com/mturk-public/externalHIT_v1.js'></script> 
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script> 
    <script src="https://storage.googleapis.com/jquerytabletohtml/jquery.tabletojson.js"></script> 
</head> 
<body> 
    <form name='mturk_form' method='post' id='mturk_form' action='https://www.mturk.com/mturk/externalSubmit'> 
    <input type='hidden' value='' name='assignmentId' id='assignmentId'/> 

    <h1>This is a test for Directional Surveys</h1> 
    <div id="tablediv"> 
     <table id="Table" border="1"> 
      <tr> 
       <td><b>Measured Depth</b></td> 
       <td><b>Inclination</b></td> 
       <td><b>Azimuth</b></td> 
       <td><b>Delete?</b></td> 
       <td><b>Add Row?</b></td> 
      </tr> 
      <tr> 
       <td><input size=25 type="text" id="Measured Depth0[]" contenteditable="true" value='339'></td> 
       <td><input size=25 type="text" id="Inclination0[]" contenteditable='true' value='0.540000021'></td> 
       <td><input size=25 type="text" id="Azimuth0[]" contenteditable='true' value='310.7200012'></td> 
       <td><input type="button" id="delbutton0" value="Delete" onclick="deleteRow(this)"/></td> 
       <td><input type="button" id="addmorebutton0" value="Add Row Below" onclick="addRow(this)"/></td> 
      </tr> 
     </table> 
    </div> 
    <button id="convert-table">Convert!</button> 
    <p><input type='submit' id='submitButton' value='Submit' /></p></form> 

    <script language='Javascript'>turkSetAssignmentID();</script> 

</body> 
</html> 
+0

'tableToJSON'という関数が既にJSONを作成していて、文字列なので、もう一度' JSON.stringify'を実行する必要はないと思います。 – adeneo

+1

@adeneoそう考えているかもしれませんが、実際にはそうではありません。それは通常のオブジェクトを返します、私は多くの人々のような作者はJSONが何を意味するのか混乱していると思います。 – dfsq

答えて

2

+0

偉大な私はそれを完全に理解していない、あなたの助けに感謝 –

関連する問題