從Java-Bean / Servlet和Ajax處理工作變量數據的首選方法？

Question

我有一個應用程序，可以根據我選擇的菜單項在屏幕上顯示多種形狀。 就像我在標題中提到的那樣，這意味着我來自bean的所有數據都是可變的。

即

項目1：5個正方形，3個矩形和8個三角形。

項目2：2個正方形，3個矩形和2個三角形。

我要做的就是用ajax將數據發布到我的servlet中。 我的servlet知道它是“ item”之后，將在我的bean中調用一個方法，該方法隨后將讀取服務器上的文件，然后返回數據。

我現在的問題是，將數據作為響應發送回去的最佳方法是什么？

由於我是ajax的新手，所以我不確定正確的方法，但這是我想過的兩種方法。

1. 我認為最簡單的方法是設置一個頂級div，每次將填充所有數據。 在這種情況下，我將通過Java編寫所有html代碼，然后將響應字符串傳遞給ajax進行響應，然后將其替換div的內容。 但是，我發現這種方法有點特別，尤其是如果我只想更改一部分數據（有時形狀是彩色的，有時它們有圖像）。

2. 下一個方法是我將使用JSON傳遞所有數據，然后必須遍歷每個形狀，創建新的var和div，並根據需要進行更新。 這似乎對小事情和部分更新很有用，但是似乎有些工作。

我不確定是否還有其他方法，或者我的方法是否能起作用，但是我很好奇人們的想法。

編輯：我確實從Netbeans的“我的Ajax應用程序”中找到了這個示例，這是我從中學到的。 這是上述兩種之間的混合體。

https://netbeans.org/kb/docs/web/ajax-quickstart.html

function appendComposer(firstName,lastName,composerId) {

var row;
var cell;
var linkElement;

if (isIE) {
    completeTable.style.display = 'block';
    row = completeTable.insertRow(completeTable.rows.length);
    cell = row.insertCell(0);
} else {
    completeTable.style.display = 'table';
    row = document.createElement("tr");
    cell = document.createElement("td");
    row.appendChild(cell);
    completeTable.appendChild(row);
}

cell.className = "popupCell";

linkElement = document.createElement("a");
linkElement.className = "popupItem";
linkElement.setAttribute("href", "autocomplete?action=lookup&id=" + composerId);
linkElement.appendChild(document.createTextNode(firstName + " " + lastName));
cell.appendChild(linkElement);
}
enter code here
function parseMessages(responseXML) {

// no matches returned
if (responseXML == null) {
    return false;
} else {

    var composers = responseXML.getElementsByTagName("composers")[0];

    if (composers.childNodes.length > 0) {
        completeTable.setAttribute("bordercolor", "black");
        completeTable.setAttribute("border", "1");

        for (loop = 0; loop < composers.childNodes.length; loop++) {
            var composer = composers.childNodes[loop];
            var firstName = composer.getElementsByTagName("firstName")[0];
            var lastName = composer.getElementsByTagName("lastName")[0];
            var composerId = composer.getElementsByTagName("id")[0];
            appendComposer(firstName.childNodes[0].nodeValue,
                lastName.childNodes[0].nodeValue,
                composerId.childNodes[0].nodeValue);
        }
    }
}
}

當然，我現在正在使用jquery ajax，這只是一個例子。

此示例說明，我可以使用數據創建字符串緩沖區，然后使用javascript對其進行操作。 看來他們只是重用var並在循環中創建新元素...

似乎使用JSON會更容易，所以我想我也會這樣做，但是我歡迎其他意見。

嗯...也許我將不得不進一步研究，但是如果有人有其他意見，我將不勝感激...

感謝您的時間，

〜烤寬面條

Answer 1

我認為方法2是可行的。 理想情況下，您只想從業務層返回數據。 讓演示層處理演示。 因此，您的Servlet將以JSON形式返回數據，並且您的JSP / HTML /將對其進行適當的處​​理和顯示。

這也為您提供了靈活性。 假設您決定將來開發一個Android應用。 在這種情況下，您無需更改Servlet中的任何內容。 您的應用程序將向Servlet發出請求，並獲取相同的JSON數據。 該應用程序將處理並顯示適當的數據。