오류 내용:
java.lang.IllegalStateException: Neither BindingResult nor plain target object for bean name 'researchList[${num}]' available as request attribute
select박스 값이 변동되면 onchange로 바로 함수를 호출해서 innerHtml로 용도에 맞게 테이블을 변경하려고 했다.
//selectBox가 변경시 이벤트 감지
function chageLangSelect(num,selectVal){
var tableId = "search_table_"+num; //테이블 id
var selectId = "researchList["+num+"].reType"; //셀렉트 박스 id
if (selectVal == '0') {
alert("라디오박스");
var innerHtml =`
<table class="tbl_row_type01" id="search_table_\${num}">
<caption>내용(제목, 작성자, 작성일 등으로 구성)</caption>
<colgroup>
<col style="width:20%;">
<col style="width:30%;">
<col style="width:20%;">
<col style="width:30%;">
</colgroup>
<tbody id="sub_tbody_\${num}">
<tr>
<th scope="row"><strong class="th_tit">설문 타입</strong></th>
<td colspan="3">
<select name="researchList[\${num}].reType" id="researchList[\${num}].reType" title="설문 타입" cssClass="w100">
<option value="0" label="라디오박스" selected="selected"/>
<option value="1" label="이미지"/>
<option value="2" label="체크박스"/>
</select>
</td>
</tr>
<tr>
<th scope="row"><strong class="th_tit">설문 제목</strong></th>
<td colspan="3">
<input type="text" name="researchList[\${num}].reTitle" class="text w50p" required="required" maxlength="50"/>
<a href="#" class="btn btn_mdl btn_save">항목 추가</a>
</td>
</tr>
<tr id="add_tr_1">
<th scope="row"><strong class="th_tit">설문 내용</strong></th>
<td colspan="3" class="search_cont">
<input type="radio" name="researchList[0].check" id="researchList[0].check" value="0" />
<input type="text" name="researchList[0].reCont" id="researchList[0].reCont" class="text w50p" required="required" maxlength="50"/>
<a href="#" class="btn btn_i_del"><span>삭제</span></a>
</td>
</tr>
<tr id="add_tr_2">
<th scope="row"></th>
<td colspan="3" class="search_cont">
<input type="radio" name="researchList[1].check" id="researchList[1].check" value="0" />
<input type="text" name="researchList[1].reCont" id="researchList[1].reCont" class="text w50p" required="required" maxlength="50"/>
<a href="#" class="btn btn_i_del"><span>삭제</span></a>
</td>
</tr>
</tbody>
</table>
`;
$("#research_tables>tbl_wrap:last").append(innerHtml);
}
}
<table class="tbl_row_type01" id="search_table_1">
<caption>내용(제목, 작성자, 작성일 등으로 구성)</caption>
<colgroup>
<col style="width:20%;">
<col style="width:30%;">
<col style="width:20%;">
<col style="width:30%;">
</colgroup>
<tbody id="sub_tbody_1">
<tr>
<th scope="row"><strong class="th_tit">설문 타입</strong></th>
<td colspan="3">
<form:select path="researchList[0].reType" id="researchList[0].reType" onchange="chageLangSelect('1',this.value)" title="설문 타입" cssClass="w100">
<form:option value="0" label="라디오박스"/>
<form:option value="1" label="이미지"/>
<form:option value="2" label="체크박스"/>
</form:select>
</td>
</tr>
<tr>
<th scope="row"><strong class="th_tit">설문 제목</strong></th>
<td colspan="3">
<input type="text" name="researchList[0].reTitle" class="text w50p" required="required" maxlength="50"/>
<a href="#" class="btn btn_mdl btn_save" onclick="fncAdd('1');">항목 추가</a>
</td>
</tr>
<tr id="add_tr_1">
<th scope="row"><strong class="th_tit">설문 내용</strong></th>
<td colspan="3" class="search_cont">
<input type="radio" name="researchList[0].check" id="researchList[0].check" value="0" />
<input type="text" name="researchList[0].reCont" id="researchList[0].reCont" class="text w50p" required="required" maxlength="50"/>
<a href="#" class="btn btn_i_del" onclick="fncDel('1','1');"><span>삭제</span></a>
</td>
</tr>
</tbody>
</table>
문제는 innerHtml에 form:form 태그가 새용되면서 오류가 난 것.
- 변경 전 -
<form:select path="researchList[\${num}].reType" id="researchList[\${num}].reType" onchange="chageLangSelect('\${num}',this.value)" title="설문 타입" cssClass="w100">
<form:option value="0" label="라디오박스" selected="selected"/>
<form:option value="1" label="이미지"/>
<form:option value="2" label="체크박스"/>
</form:select>
- 변경 후 -
<select name="researchList[\${num}].reType" id="researchList[\${num}].reType" onchange="chageLangSelect('\${num}',this.value)" title="설문 타입" cssClass="w100">
<option value="0" label="라디오박스" selected="selected"/>
<option value="1" label="이미지"/>
<option value="2" label="체크박스"/>
</select>