2017-09-07 4 views
1

데이터 수집을 위해 MTurk에서 편집 할 수있는 HTML 테이블이 있습니다. 나는 테이블을 json으로 바꾸어 각 HIT에 대해 한 행에 나타나도록하는 함수를 만들었지 만 지금은 이것을 제출하는 방법을 알지 못한다. json에 데이터를 성공적으로 집계 한 다음 콘솔에 기록했습니다. 나는 HTML과 Javascript에 비교적 익숙하다. 이상적인 대답은 Sandbox에서 Amazon으로 데이터를 다시 제출하는 방법을 분명히 보여줍니다.MTurk 제출에 출력 JSON 보내기

자바 스크립트

<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> 

답변

1

당신은 정말 가까이있어.

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

값의 원인이됩니다 그 대신

alert(JSON.stringify(table)); 

이 할 일을, 그리고

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

: 오른쪽

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

요소 아래에, 또 다른 하나를 추가 숨겨진 사람 data 입력 요소를 사용하여 table의 값을 유지합니다. 작업자가 제출을 누르면이 숨겨진 필드가 MTurk로 전송되어 HIT를받을 때 사용할 수 있습니다.

+0

나는 이것을 이미 알아 냈지만 당신은 정확하다. 응답에 감사한다. –