버튼 클릭 시 동일한 필드 추가 되게 하는 방법 문의 드립니다

버튼 클릭 시 동일한 필드 추가 되게 하는 방법 문의 드립니다

QA

버튼 클릭 시 동일한 필드 추가 되게 하는 방법 문의 드립니다

본문

<style>
  table10 {
    width: 100%;
    border: 1px solid #BDBDBD;
    border-collapse: collapse;
  }
  th, td {
    border: 1px solid #BDBDBD;

  }
</style>


<table id="table10" style="width:100%;">
<tr>
<td>
상품명<input id="wr_subject" name="wr_1" required class="form-control required"  rows="10" placeholder="상품명을 입력해 주세요" ><?php echo $write['wr_1'] ?></td>
<td>
상품URL<input id="wr_subject" name="wr_2" required class="form-control required"  rows="10" placeholder="상품URL" ><?php echo $write['wr_2'] ?> </td>
</tr><tr>
<td>
가격<input id="wr_3" name="wr_subject" required class="form-control required"  rows="10" placeholder="가격을 입력해 주세요" ><?php echo $write['wr_3'] ?> </td>
<td> 
수량<input id="wr_4" name="wr_subject" required class="form-control required"  rows="10" placeholder="수량을 입력해 주세요" ><?php echo $write['wr_4'] ?> </td>
</tr><tr>
<td> 
옵션<input id="wr_5" name="wr_subject" required class="form-control required"  rows="10" placeholder="옵션을 입력해 주세요" ><?php echo $write['wr_5'] ?></td>
<td> 
요청사항<input id="wr_6" name="wr_subject" required class="form-control required"  rows="10" placeholder="요청사항을 입력해 주세요" ><?php echo $write['wr_6'] ?>
</td></tr></table>
<button>상품추가</button><button>상품삭제</button>

 

이렇게 위처럼 기본적으로 입력 하면 해당 필드에 값이 입력이 됩니다. 여기서 상품추가 버튼을 누를때마다 위 필드 6개를 동일하게 나타나게 표할 수 있을까요?  그리고 삭제버튼을 누르면  추가했던 필드를 삭제 하게 도 가능할까요?

동일하게 db에도 값을 입력되게 하고요.. 혹시 알고 계신 고수분님들 계실까요?

 

 

 

 

 

이 질문에 댓글 쓰기 :

답변 2

아래 예제를 한번 참고 해보세요.

 

1.html

 

<!DOCTYPE html>
<html>
<head>
    <style>
        table {
            width: 100%;
            border: 1px solid #BDBDBD;
            border-collapse: collapse;
        }
        th, td {
            border: 1px solid #BDBDBD;
        }
    </style>
</head>
<body>
    <form id="productForm" action="submit_products.php" method="post">
        <table id="productTable" style="width:100%;">
            <tr>
                <td>상품명<input type="text" name="wr_1[]" required class="form-control required" placeholder="상품명을 입력해 주세요"></td>
                <td>상품URL<input type="text" name="wr_2[]" required class="form-control required" placeholder="상품URL"></td>
            </tr>
            <tr>
                <td>가격<input type="text" name="wr_3[]" required class="form-control required" placeholder="가격을 입력해 주세요"></td>
                <td>수량<input type="text" name="wr_4[]" required class="form-control required" placeholder="수량을 입력해 주세요"></td>
            </tr>
            <tr>
                <td>옵션<input type="text" name="wr_5[]" required class="form-control required" placeholder="옵션을 입력해 주세요"></td>
                <td>요청사항<input type="text" name="wr_6[]" required class="form-control required" placeholder="요청사항을 입력해 주세요"></td>
            </tr>
        </table>
        <button type="button" onclick="addProduct()">상품추가</button>
        <input type="submit" value="저장">
    </form>

    <script>
        function addProduct() {
            var table = document.getElementById("productTable");
            var row1 = table.insertRow();
            var row2 = table.insertRow();
            var row3 = table.insertRow();
            
            var cell1 = row1.insertCell(0);
            var cell2 = row1.insertCell(1);
            var cell3 = row2.insertCell(0);
            var cell4 = row2.insertCell(1);
            var cell5 = row3.insertCell(0);
            var cell6 = row3.insertCell(1);
            
            cell1.innerHTML = '상품명<input type="text" name="wr_1[]" required class="form-control required" placeholder="상품명을 입력해 주세요">';
            cell2.innerHTML = '상품URL<input type="text" name="wr_2[]" required class="form-control required" placeholder="상품URL">';
            cell3.innerHTML = '가격<input type="text" name="wr_3[]" required class="form-control required" placeholder="가격을 입력해 주세요">';
            cell4.innerHTML = '수량<input type="text" name="wr_4[]" required class="form-control required" placeholder="수량을 입력해 주세요">';
            cell5.innerHTML = '옵션<input type="text" name="wr_5[]" required class="form-control required" placeholder="옵션을 입력해 주세요">';
            cell6.innerHTML = '요청사항<input type="text" name="wr_6[]" required class="form-control required" placeholder="요청사항을 입력해 주세요">';
        }
    </script>
</body>
</html>

 

 

2. submit_products.php

 

<?php
// 데이터베이스 연결 코드 (예시)
include_once("./_common.php");

$wr_1 = $_POST['wr_1'];
$wr_2 = $_POST['wr_2'];
$wr_3 = $_POST['wr_3'];
$wr_4 = $_POST['wr_4'];
$wr_5 = $_POST['wr_5'];
$wr_6 = $_POST['wr_6'];

for ($i = 0; $i < count($wr_1); $i++) {
    $wr_1_val = mysql_real_escape_string($wr_1[$i]);
    $wr_2_val = mysql_real_escape_string($wr_2[$i]);
    $wr_3_val = mysql_real_escape_string($wr_3[$i]);
    $wr_4_val = mysql_real_escape_string($wr_4[$i]);
    $wr_5_val = mysql_real_escape_string($wr_5[$i]);
    $wr_6_val = mysql_real_escape_string($wr_6[$i]);

    $sql = "INSERT INTO your_table_name (wr_1, wr_2, wr_3, wr_4, wr_5, wr_6) VALUES ('$wr_1_val', '$wr_2_val', '$wr_3_val', '$wr_4_val', '$wr_5_val', '$wr_6_val')";
    $result = mysql_query($sql);

    if (!$result) {
        die('Error: ' . mysql_error());
    }
}

echo "데이터가 성공적으로 저장되었습니다.";
?>
 

 

 

와우 정말 좋은 답변 감사합니다. ^^ 혹시 위 내용을 넣고 저장을 누르면 내용을 입력하고 팝업이 뜨는데 어느 부분을 확인해봐야 할까요? 내용들은 다 입력했을데 그렇게 뜨네요~ㅠㅠ
기존 저장버튼은
<div class="px-3 px-sm-0">
<div class="row mx-n2">
<div class="col-6 order-2 px-2">
<button type="submit" id="btn_submit" accesskey="s" class="btn btn-primary btn-lg btn-block en">작성완료</button>
</div>
<div class="col-6 order-1 px-2">
<a href="<?php echo get_pretty_url($bo_table); ?>" class="btn btn-basic btn-lg btn-block en">취소</a>
</div>
</div>
</div>
이렇게 되어 있었습니다

input name을 저렇게 해서는 안됩니다

다음처럼 기본적으로 게시물 제목과 내용이 있어야 하고 게시물 카운트도 넣고....  

수정은 한꺼번에 여러개는 할 수 없으니 하나씩 수정하도록 코드를 만드세요

 

 <form name='aaa' method='post' action="goods_save.php">
 <input type='hidden' name='bo_table' value='survey'>
<input type='hidden' name='w' value='<?php echo $w?>'>

<table id="table10" style="width:100%;">
<tr>
<td>
상품명<input id="wr_subject" name="subject[]" required class="form-control required"  rows="10" placeholder="상품명을 입력해 주세요" ></td>
<td>
상품URL<input name="content[]" required class="form-control required"  rows="10" placeholder="상품URL" > </td>
</tr>
<tr>
<td>
가격<input name="wr1[]" required class="form-control required"  rows="10" placeholder="가격을 입력해 주세요" > </td>
<td> 
수량<input name="wr2[]" required class="form-control required"  rows="10" placeholder="수량을 입력해 주세요" > </td>
</tr>
<tr>
<td> 
옵션<input name="wr3[]" required class="form-control required"  rows="10" placeholder="옵션을 입력해 주세요" ></td>
<td> 
요청사항<input name="wr4[]" required class="form-control required"  rows="10" placeholder="요청사항을 입력해 주세요" ></td></tr></table>
</form>

<?php if( empty($w)){?>
<button onclick="add()">상품추가</button><button onclick='del()'>상품삭제</button>

<?php }?>
<button onclick='save()'>상품저장</button>

 

 

<script>
frm = $('#table10').html();
function add(){  $('#table10').append(frm); }
function del(){
     nn=$('#table10 tr').length;
  if( nn >3){
      $('#table10 tr:last').remove();
      $('#table10 tr:last').remove();
      $('#table10 tr:last').remove();
  }
}
function save(){
   document.aaa.submit();
}
</script>

 

============== goods-save.php

기존 write_update.php를 사용하지말고 별도로 만드세요

<?php
include "../gn55826/common.php";
$nn= count($_POST['subject']);
$wr_num = get_next_num($write_table);
$sql =$deli='';     $today = G5_TIME_YMDHIS; $vv=0;
for($i=0; $i<$nn; $i++){
  if( !trim($_POST['subject'][$i]) ) continue;
  $sql .=$deli. "($wr_num, '$subject[$i]','$content[$i]','admin','관리자','$today','$today','$wr1[$i]','$wr2[$i]','$wr3[$i]','$wr4[$i]')";
  $deli = ',';
  $vv++;  $wr_num--;
}
 $sql2="insert into $write_table (wr_num,wr_subject,wr_content,mb_id,wr_name,wr_datetime,wr_last,wr_1,wr_2,wr_3,wr_4) values $sql ";
 sql_query($sql2, true);     
 sql_query(" update $write_table set wr_parent = wr_id where wr_parent =0  ");
 sql_query("update {$g5['board_table']} set bo_count_write = bo_count_write + $vv where bo_table = '{$bo_table}'");

 

 

 

 

와우 답변 정말 정말 감사합니다~^^
goods-save 파일 만들고 상품추가,상품삭제,상품저장 버튼을 누르면 "게시판 정보가 올바른지 않습니다" ,"토큰정보가 올바르지 않습니다" 라고 팝업이 뜨는데 혹시 게시판 정보 수정부분이 어디에 있는것일까요?

<form name='aaa' <==name이 fwrite가 아닌 aaa처럼 다른 이름으로 하세요
<input type='hidden' name='bo_table' value='survey'><==value를 사용 게시판으로 하세요

include "../gn55826/common.php";<==자신의 사용 경로로 변경하세요
include "../common.php"; 아마 이렇게 될 것입니다

답변을 작성하시기 전에 로그인 해주세요.
전체 2,430
QA 내용 검색

회원로그인

(주)에스아이알소프트 / 대표:홍석명 / (06211) 서울특별시 강남구 역삼동 707-34 한신인터밸리24 서관 1404호 / E-Mail: admin@sir.kr
사업자등록번호: 217-81-36347 / 통신판매업신고번호:2014-서울강남-02098호 / 개인정보보호책임자:김민섭(minsup@sir.kr)
© SIRSOFT