테스트 사이트 - 개발 중인 베타 버전입니다

상품관리목록 다이얼로그

많은도움필요 4년 전 조회 3,386

상품 목록을 뿌려주고 관리해 주는 페이지를 만들고있습니다.  상품의 고유번호들이 다 있고 

 

그걸 수정 삭제 할수 있는 기능을 구현한 후에 그냥 input 으로 수정하려니 뭔가 보기가 그래서 다이얼로그로

 

처리하려고 했거든요 ㅠㅠ 

 

밑에 코드로 실행하는데 자바스크립트로 하나하나의 키값? 을 어떻게 담아와야 하나요..? 지금 상태로하면 맨 윗값만 버튼이 눌리고 수정이 가능합니다... 제가 자바스크립트가 약해서 ㅠ  정보를 매칭시켜 주고싶은데 어떻게 해야 할지 감이안옵니다 ... 도와주세요 ㅠㅠ 

</p>

<p> while ($row = mysqli_fetch_array($result)) {</p>

<p> </p>

<p>            ?></p>

<p>                <tr></p>

<p>

 </p>

<p>                    <input type="hidden" name="productno" value="<?php echo $row['productno'] ?>"></p>

<p>                    <input type="hidden" name="manager" value="<?php echo $row['manager'] ?>"></p>

<p>                    <input type="hidden" name="work_type" value="<?php echo $row['work_type'] ?>"></p>

<p>                    <td><input type="text" name="name" class="form-control" value="<?php echo $row['name'] ?>"></td></p>

<p>                    <td><input type="text" name="memo" class="form-control" value="<?php echo $row['memo'] ?>"></td></p>

<p>                    <td><input type="text" name="count" class="form-control" value="<?php echo $row['count'] ?>"></td></p>

<p>                    <td><input type="date" id=input_date class="form-control" style="height:30px;" name="open_date" value="<?php echo $row['open_date'] ?>"></td></p>

<p>                    <td><input type="date" id=input_date class="form-control" style="height:30px;" name="end_date" value="<?php echo $row['end_date'] ?>"></td></p>

<p> </p>

<p>                    <td><input type="text" name="status" class="form-control" value="<?php echo $row['status'] ?>"></td></p>

<p> </p>

<p>                    <td> <input type="submit" class=button1 id="update_btn" value="수정"><input type="button" class=button2 value="삭제" onclick='return submit1(this.form);'></td></p>

<p> </p>

<p>                    <dialog id="favDialog['<?php echo $row['productno'];  ?>']"></p>

<p>                        <form action="main_control.php?option=update" method="POST"></p>

<p>                            <input type="hidden" name="productno" value="<?php echo $row['productno'] ?>"></p>

<p>                            <input type="hidden" name="manager" value="<?php echo $row['manager'] ?>"></p>

<p>                            <input type="hidden" name="work_type" value="<?php echo $row['work_type'] ?>"></p>

<p>                            <input type="text" name="name" class="form-control" value="<?php echo $row['name'] ?>"></p>

<p>                            <input type="text" name="memo" class="form-control" value="<?php echo $row['memo'] ?>"></p>

<p>                            <input type="text" name="count" class="form-control" value="<?php echo $row['count'] ?>"></p>

<p>                            <menu></p>

<p>                                <input type=button value="cancel" value="취소"></p>

<p>                                <input type=submit id="confirmBtn" value="확인"></p>

<p>                            </menu></p>

<p>                        </form></p>

<p>                    </dialog></p>

<p>



 </p>

<p>                    <output aria-live="polite"></output></p>

<p> </p>

<p>                    <script></p>

<p>                        var updateButton = document.getElementById('update_btn');</p>

<p>                        var favDialog = document.getElementById('favDialog['<?php echo $row['productno'];  ?>']');</p>

<p>                        var outputBox = document.getElementsByTagName('output')[0];</p>

<p>                        var selectEl = document.getElementsByTagName('select')[0];</p>

<p>                        var confirmBtn = document.getElementById('confirmBtn');</p>

<p> </p>

<p>                        // “Update details” button opens the <dialog> modally</p>

<p>                        updateButton.addEventListener('click', function onOpen() {</p>

<p>                            if (typeof favDialog.showModal === "function") {</p>

<p>                                favDialog.showModal();</p>

<p>                            } else {</p>

<p>                                alert("The <dialog> API is not supported by this browser");</p>

<p>                            }</p>

<p>                        });</p>

<p>                        // "Favorite animal" input sets the value of the submit button</p>

<p>                        selectEl.addEventListener('change', function onSelect(e) {</p>

<p>                            confirmBtn.value = selectEl.value;</p>

<p>                        });</p>

<p>                        // "Confirm" button of form triggers "close" on dialog because of [method="dialog"]</p>

<p>                        favDialog.addEventListener('close', function onClose() {</p>

<p>                            outputBox.value = favDialog.returnValue + " button clicked - " + (new Date()).toString();</p>

<p>                        });</p>

<p>                    </script></p>

<p>                <?php</p>

<p>            }</p>

<p>                ?></p>

<p> </p>

<p>

댓글을 작성하려면 로그인이 필요합니다.

답변 1개

4년 전

맨 윗 값이 어떤 것인지..

 

실제로 동작되는 화면 캡쳐도 있으면 좋을 것 같고..

 

 

</p>

<pre>
<code>var selectEl = document.getElementsByTagName('select')[0];</code></pre>

<p><code>

 

여기서 select에 해당되는 태그도 안 보이네요

 

로그인 후 평가할 수 있습니다

댓글을 작성하려면 로그인이 필요합니다.

답변을 작성하려면 로그인이 필요합니다.

로그인