jessite框架前臺顯示資料的幾種方法
阿新 • • 發佈:2018-12-12
1.自定義標籤獲取字典資料,即在js指令碼中通過jstl自定義標籤引入,並根據獲取的資料動態顯示出自己需要的資料,如下程式碼紅色部分,當前場景沒有用到,但是可以作為一種方法去了解。
gridComplete: function () var ids = jQuery("#grid-table").jqGrid('getDataIDs'); for (var i = 0; i < ids.length; i++) { var id = ids[i]; var rowData = $("#grid-table").getRowData(id); var materialType = getDictLabel(${fns:toJson(fns:getDictList("material_type"))}, type); var type = rowData ['status']; var str; switch (type) { case "0": str = "class=\"label label-info\"><p style=\"margin-top:2px\">未解決"; break; case "1": str = "class=\"label label-warning\"><p style=\"margin-top:2px\">已解決"; break; } str = "<span style=\"border-radius:4px;\" " + str + "<\p><\span>"; $(grid_selector).jqGrid('setRowData', ids[i], { status:str }); } $(grid_selector).find('[data-action=makePlan]').on('click', function (event) { var id = $(this).attr('data-id'); //超連結跳到計劃制定頁面 alert("超連結跳到訂單頁面"); }); }
2.後臺返回到前臺具體地址時攜帶一個list資料,通過‘c’標籤迴圈遍歷顯示出資料。value代表實際值,option中的代表顯示的值,當前item.orderNumber可以改成item.id,這樣不影響前端顯示結果,只是傳給後臺資料進行查詢時,會將通過編號查詢的方式換成通過id方式查詢,因為你此時傳的值實際是id的值。(通常用於查詢條件)
<label class="control-label col-xs-12 col-sm-2 no-padding-right" for="orderNumber">訂單編號: </label> <div class="col-xs-12 col-sm-3"> <select id="orderNumber" name="orderNumber" class="chosen-select form-control" data-placeholder="點選選擇訂單編號..."> <option value=""></option> <c:forEach items="${orderRecorderNumberList}" var="item" varStatus="idxStatus"> <option value="${item.orderNumber}" htmlEscape="false"> ${item.orderNumber} </option> </c:forEach> </select> </div>
3.spring form和“c”標籤相結合接收後臺傳來的list並且進行標籤迴圈輸出。
<form:select path="orderNumber" class="chosen-select form-control width-100" data-placeholder="點選選擇..."> <form:option value="" htmlEscape="false"/> <c:forEach items="${orderFormList}" var="item" varStatus="idxStatus"> <form:option value="${item.orderNumber}" htmlEscape="false"/> </c:forEach> </form:select>
4..在Spring form和資料字典的方式的方式,form:options,form:select格式選擇加字典的方式獲取所有list資料(單一實體類),label表示當前頁面所顯示的,value代表實際的值。(通常用於編輯表中某一行欄位),當然,也可以引入相應標籤作為邏輯判斷.
<label class="control-label col-xs-12 col-sm-2 no-padding-right" for="status">訂單狀態:</label>
<div class="col-xs-12 col-sm-3">
<form:select path="status" class="chosen-select form-control width-100" data-placeholder=" 點選選擇...">
<form:option value="" htmlEscape="false"/>
<form:options items="${fns:getDictList('hy_order_form_record_status')}" itemLabel="label" itemValue="value" htmlEscape="false" />
</form:select>
</div>
<c:choose>
<c:when test="${office.type == 1}">
<input type="text" id="officetype" readonly="" class="form-control" name="officetype" value="${fns:getDictLabel(office.type, 'sys_office_type', '')}"/>
<input type="hidden" id="type" class="form-control" name="type" value="${office.type}"/>
</c:when>
<c:otherwise>
<form:select path="type" class="chosen-select form-control width-100" data-placeholder="點選選擇...">
<form:options items="${fns:getDictList('sys_office_type')}" itemLabel="label" itemValue="value" htmlEscape="false" />
</form:select>
</c:otherwise>
</c:choose>
</div>