글쓰기시 행추가 문제..
본문
안녕하세요
글쓰기 페이지에서 버튼으로 행 추가를 하려 합니다.
<?php
$wr_1 = explode("|", $write['wr_1']);
?>
<button name="addStaff">정산담당자 추가</button>
<table border="1">
<tbody>
<tr name="trStaff">
<td style="width:150px"><strong>정산담당자</strong></td>
<td style="width:800px">
<input type="text" name="wr_1[0]" placeholder="성명">
<select name="wr_1[1]">
<option value="Y">사용</option>
<option value="N">미사용</option>
</select>
</td>
</tr>
</tbody>
</table>
<script>
//추가 버튼
$(document).on("click","button[name=addStaff]",function(){
var addStaffText = '<tr name="trStaff">'+
' <td class="active col-md-1"><strong>정산담당자</strong></td>'+
' <td class="col-md-11">'+
' <input type="text" class="form-control" name="wr_2[0]" placeholder="성명">'+
' <select class="form-control statusYn" name="wr_2[1]">'+
' <option value="Y">사용</option>'+
' <option value="N">미사용</option>'+
' </select>'+
' <button class="btn btn-default" name="delStaff">삭제</button>'+
' </td>'+
'</tr>';
var trHtml = $( "tr[name=trStaff]:last" ); //last를 사용하여 trStaff라는 명을 가진 마지막 태그 호출
trHtml.after(addStaffText); //마지막 trStaff명 뒤에 붙인다.
});
//삭제 버튼
$(document).on("click","button[name=delStaff]",function(){
var trHtml = $(this).parent().parent();
trHtml.remove(); //tr 테그 삭제
});
</script>
최상단에 행 추가버튼이 button으로 되어있어서
글쓰기 완료버튼과 중복이 되어 같이 눌어저 버리네요
다른 버튼으로 방법이 없을까요?
그리고 추가할때 마다 wr_1, wr_2 이런식으로 여분필드를 늘려나가려 합니다.
for ($i=1; $i<=10; $i++) {
<input type="text" class="form-control" name="wr_$i[$i]" placeholder="성명">
<select class="form-control statusYn" name="wr_$i[$i]">
}
이런식이 맞는지요 ㅠ
자바스크립트 안에서 php를 써도 되는건가요
고수님들의 답변 부탁드립니다. ㅠ
답변 1
상단 행추가 버튼에 type="button" 추가해보세요.(form 안에서는 type을 줘야 submit 안됩니다.)
그리고 위와 같이 자바스크립트에서 php 변수를 동적으로 사용하시려면 페이지 로딩시 자바스크립트 변수에 php 변수 값을 대입하신 후 해당 자바스크립트 변수를 사용하셔야 됩니다.
답변을 작성하시기 전에 로그인 해주세요.
