테이블에서 즉시 데이터 가져 오기 HTML

Question

이것은 설명하기가 약간 어려울 수 있지만 2 x 2 인 격자를 표시합니다. 셀 텍스트를 클릭하면 (0,1) 팝업 상자를 열고 이러한 좌표를 숨겨진 값으로 저장하십시오. 그런 다음 숨겨진 값은 POST를 통해 양식에 제출됩니다. https://jsfiddle.net/v08bzm9k/1/

<table border=1> 
<tr> 
    <td class='grid-cells'><a href='#myPopup' data-rel='popup'>1</a></td> 
    <td class='grid-cells'><a href='#myPopup' data-rel='popup'>2</a></td> 
</tr> 
<tr> 
    <td class='grid-cells'><a href='#myPopup' data-rel='popup'>3</a></td> 
    <td class='grid-cells'><a href='#myPopup' data-rel='popup'>4</a></td> 
</tr> 
</table> 

<div data-role="popup" id="myPopup" class="ui-content" style="min-width:250px;"> 
     <form method="post" action="save-square.php"> 
     <div> 
      <h3>Pick This Square:</h3> 
      <label for="name" class="ui-hidden-accessible">Name:</label> 
      <input type="text" name="name" id="name" placeholder="Name"> 
      <label for="email" class="ui-hidden-accessible">Email:</label> 
      <input type="text" name="email" id="email" placeholder="Email"> 
      <input type="submit" data-inline="true" value="Submit"> 
      <div id='row'></div> 
      <div id='col'></div> 
     </div> 
     </form> 
    </div> 

가 나는 자바 스크립트를 통해 숨겨진 필드에 클릭 한 셀의 값을 저장합니다 : 여기

은 내가 잘하면 내가 뭘하려고 오전 명확히하기 위해 작성한 몇 가지 예제 코드?

Answer 1

나는

https://jsfiddle.net/v08bzm9k/2/ 예 숨겨진 필드를 사용할 수있는 업데이트되었습니다. 온 클릭을

function setCoords(newCoords) { 
    $('#coords').val(newCoords); 
} 

그리고 당신의 링크에 추가 :

<input type="hidden" name="coords" id="coords" value=""> 

이 당신의 페이지에 JS 추가 양식이 추가

<a href='#myPopup' data-rel='popup' onclick="setCoords('1,1');">1</a>