버튼 클릭 시 동일한 필드 추가 되게 하는 방법 문의 드립니다
본문
<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 "데이터가 성공적으로 저장되었습니다.";
?>
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}'");