2017-09-07 4 views
1

Ich habe eine HTML-Tabelle, die von einem MTurk zum Zwecke der Datenerfassung bearbeitet werden kann. Ich habe eine Funktion gebaut, um die Tabelle in ein JSON zu verwandeln, so dass es in einer Zeile für jeden HIT erscheint, außer dass ich nicht sicher bin, wie ich das jetzt einreichen soll. Ich habe die Daten erfolgreich zu json zusammengefasst und anschließend in der Konsole protokolliert. Ich bin relativ neu in HTML und Javascript. Die ideale Antwort würde deutlich zeigen, wie ich die Daten in Sandbox an Amazon zurücksende.Ausgabe JSON an MTurk senden senden

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], 
      extractor:function(cellIndex, $cell) { 
       return $cell.find('input').val(); 
      } 
     }); 
    console.log(table); 
    alert(JSON.stringify(table)); 
}); 


</script> 

HTML

<HTMLQuestion xmlns="http://mechanicalturk.amazonaws.com/AWSMechanicalTurkDataSchemas/2011-11-11/HTMLQuestion.xsd"> 
    <HTMLContent><![CDATA[ 
<!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 align="center">Insertion of Missing Data</h1> 
    <h2>Instructions:</h2> 
    <p>Open the document <a href="https://storage.googleapis.com/directionalsurvey/Amazon%20Turk%20Test%20files/PDFS/100122514.pdf" target='_blank'>HERE</a> and look for a missing value by scanning a column in the pdf until the data shown below does not line up. when you find one insert a row and enter the three variables Measured Depth, Inclination, and Azimuth.</p> 
    <p> The variables could appear as: </p> 
     <ul> 
     <li><b>Measured Depth</b></li> 
      <ul><li>MD, Depth, Measured Depth, M.D.</li></ul> 
     <li><b>Inclination</b></li> 
      <ul><li>Incl, IncAng, Inclination Angle, Inclination</li></ul> 
     <li><b>Azimuth</b></li> 
      <ul><li>Azi, Azimuth Angle, DirDeg, Directional Angle</li></ul> 
     </ul> 

    <p>I expect there to be <b>~ 5 </b>missing rows... when you are done hit submit.</p> 

    <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> 
      <tr> 
       <td><input size=25 type="text" id="Measured Depth1[]" contenteditable="true" value='432'></td> 
       <td><input size=25 type="text" id="Inclination1[]" contenteditable='true' value='0.930000007'></td> 
       <td><input size=25 type="text" id="Azimuth1[]" contenteditable='true' value='326.3599854'></td> 
       <td><input type="button" id="delbutton1" value="Delete" onclick="deleteRow(this)"/></td> 
       <td><input type="button" id="addmorebutton1" 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> 
]]> 
    </HTMLContent> 
    <FrameHeight>900</FrameHeight> 
</HTMLQuestion> 

Antwort

1

Sie sind ganz in der Nähe. Direkt unter dem

<input type='hidden' value='' name='assignmentId' id='assignmentId'/> 

Element, fügen Sie ein anderes:

<input type='hidden' value='' name='data' id='data'/> 

Dann statt

alert(JSON.stringify(table)); 

tun dies zu tun:

$('#data').val(JSON.stringify(table)); 

Das bewirkt, dass der Wert von der versteckten data Eingabeelement, um den Wert table zu halten. Wenn der Worker submit drückt, wird dieses versteckte Feld an MTurk übertragen und ist verfügbar, wenn du den HIT bekommst.

+0

Ich habe das schon herausgefunden, aber Sie sind richtig, also danke für die Antwort –