MainElement and DetailElement 情境 1：
有時我想要設計/實作 MainElement and DetailElement 的畫面/UI，大概的程式碼如下--
<html>
<head>
</head>
<script language="javascript">
/**決定 iMessage01(MainElement) 是否顯示**/
var isDetailElementExist = false; //DetailElement
alert("Data : ajaxData.iMessage01 = " + JSON.stringify(ajaxData.iMessage01));
$.each(ajaxData.iMessage01, function (index,iMessage01) {
if(ajaxData.iMessage02[iMessage01.itemId].length > 0){
isDetailElementExist = true;
}
$('div[id=ELEMENT_'+iMessage01.elementId+']').show();
$('div[id=ELEMENT_'+iMessage01.elementId+']').find("input[name$='Status'][value='Y']").prop('checked',true);
$('div[id=ELEMENT_'+iMessage01.elementId+']').find("input[name$='Status'][value='N']").prop('disabled',true);
});
$('input[name="iMessage01"]').val(JSON.stringify(ajaxData.iMessage01));
alert("Data : ajaxData.iMessage02 = " + JSON.stringify(ajaxData.iMessage02));
if(isDetailElementExist==false){
$('input[name="iMessage02"]').val(JSON.stringify(ajaxData.iMessage02));
alert('ERR1');
$("[name='btn1']").prop('disabled',true);
$("[name='btn2']").prop('disabled',true);
$("[name='btn3']").prop('disabled',true);
}else{
$('input[name="iMessage02"]').val(JSON.stringify(ajaxData.iMessage02));
}
</script>
<form>
<%
List<GetMainElementForm> mainElements = form.getMainElements();
int len = mainElements.size();
for( int i = 0 ; i< len ; i++){
GetMainElementForm mainElement = mainElements.get(i);
String[] meds = mainElement.getMedInfo();
List<String> medList = new ArrayList<String>();
if (meds != null) {
medList = Arrays.asList(meds);
}
%>
<% if ( mainElement.getMainElementId() > 0L ) { %>
<div id = "ELEMENT_<%=mainElement.getElementId()%>" style="display:none;">
<% } else { %>
<div id = "NULL_ELEMENT" style="display:none;">
<% } %>
<table class="css_table_head" cellspacing="0" border="0">
<tr class="css_table_head_tr" >
<td class="css_table_head_td" colspan = "4" aliagn="left">
<input type="radio" name="mainelemens[<%=i %>].Status" value="Y" <%if ("Y".equals(mainElement.getStatus())) { %>checked<%}%> />
<Field:codeTable name="yes" tableName="T_YES_NO" style="label" value="Y"/>
<input type="radio" name="mainelemens[<%=i %>].Status" value="N" <%if (!"Y".equals(mainElement.getStatus())) { %>checked<%}%> />
<Field:codeTable name="no" tableName="T_YES_NO" style="label" value="N"/>
<input type="hidden" name="mainelemens[<%=i %>].listId" value="<%=mainElement.getListId() %>" />
<input type="hidden" name="mainelemens[<%=i %>].mainElementId" value="<%=mainElement.getMainElementId() %>" />
</td>
</tr>
</table>
</div>
<% } %>
</form>
</html>
有時我想要設計/實作 MainElement and DetailElement 的畫面/UI，大概的程式碼如下--
<html>
<head>
</head>
<script language="javascript">
/**決定 iMessage01(MainElement) 是否顯示**/
var isDetailElementExist = false; //DetailElement
alert("Data : ajaxData.iMessage01 = " + JSON.stringify(ajaxData.iMessage01));
$.each(ajaxData.iMessage01, function (index,iMessage01) {
if(ajaxData.iMessage02[iMessage01.itemId].length > 0){
isDetailElementExist = true;
}
$('div[id=ELEMENT_'+iMessage01.elementId+']').show();
$('div[id=ELEMENT_'+iMessage01.elementId+']').find("input[name$='Status'][value='Y']").prop('checked',true);
$('div[id=ELEMENT_'+iMessage01.elementId+']').find("input[name$='Status'][value='N']").prop('disabled',true);
});
$('input[name="iMessage01"]').val(JSON.stringify(ajaxData.iMessage01));
alert("Data : ajaxData.iMessage02 = " + JSON.stringify(ajaxData.iMessage02));
if(isDetailElementExist==false){
$('input[name="iMessage02"]').val(JSON.stringify(ajaxData.iMessage02));
alert('ERR1');
$("[name='btn1']").prop('disabled',true);
$("[name='btn2']").prop('disabled',true);
$("[name='btn3']").prop('disabled',true);
}else{
$('input[name="iMessage02"]').val(JSON.stringify(ajaxData.iMessage02));
}
</script>
<form>
<%
List<GetMainElementForm> mainElements = form.getMainElements();
int len = mainElements.size();
for( int i = 0 ; i< len ; i++){
GetMainElementForm mainElement = mainElements.get(i);
String[] meds = mainElement.getMedInfo();
List<String> medList = new ArrayList<String>();
if (meds != null) {
medList = Arrays.asList(meds);
}
%>
<% if ( mainElement.getMainElementId() > 0L ) { %>
<div id = "ELEMENT_<%=mainElement.getElementId()%>" style="display:none;">
<% } else { %>
<div id = "NULL_ELEMENT" style="display:none;">
<% } %>
<table class="css_table_head" cellspacing="0" border="0">
<tr class="css_table_head_tr" >
<td class="css_table_head_td" colspan = "4" aliagn="left">
<input type="radio" name="mainelemens[<%=i %>].Status" value="Y" <%if ("Y".equals(mainElement.getStatus())) { %>checked<%}%> />
<Field:codeTable name="yes" tableName="T_YES_NO" style="label" value="Y"/>
<input type="radio" name="mainelemens[<%=i %>].Status" value="N" <%if (!"Y".equals(mainElement.getStatus())) { %>checked<%}%> />
<Field:codeTable name="no" tableName="T_YES_NO" style="label" value="N"/>
<input type="hidden" name="mainelemens[<%=i %>].listId" value="<%=mainElement.getListId() %>" />
<input type="hidden" name="mainelemens[<%=i %>].mainElementId" value="<%=mainElement.getMainElementId() %>" />
</td>
</tr>
</table>
</div>
<% } %>
</form>
</html>
發表文章
