/ / заповнити таблицю B на основі рядка, натиснутого на таблицю A - json, spring-mvc, dojo, spring-roo, dojox.grid.datagrid

заповнити таблицю B на основі рядка, натиснутого на таблицю A - json, spring-mvc, dojo, spring-roo, dojox.grid.datagrid

У мене є стіл, що А з додзе та япотрібно заселити інший стіл B знову використовуючи додзьо. Тут я повинен натиснути рядок таблиці A. і на цьому рядку мені потрібно зателефонувати до мого контролера весни поряд з я відправив ідентифікатор рядка або деяке значення рядка до контролера і контролер, він повинен повернути дані Json моделі, яка мені потрібна повернутися до додзьо до того, як це як таблиця Б.

Нижче я покажу тобі те, що я маю.

Кнопка для заповнення таблиці, яку я отримав у пошуку Google.

<button data-dojo-type="dijit/form/Button" type="button" id="goBtn"  disabled="disabled" >GO
<script type="dojo/method" data-dojo-event="onClick" data-dojo-args="evt">

populateTable();
</script>

Це таблиця A, яка збирається заселити кнопкою миші

<div style="width: 800px; height: 200px;">
<div data-dojo-type="dojo/store/Memory" data-dojo-props="data:storeDataForTableA, idProperty:"tableAid"" data-dojo-id="tableADateStore">
</div>

<!-- Create the model bridging the store and the Tree -->
<div data-dojo-type="dojo/data/ObjectStore" data-dojo-id="tableADateStoreForGrid"
data-dojo-props="objectStore: tableADateStore"></div>

<div id="grid"
data-dojo-type="dojox/grid/DataGrid"
data-dojo-props="store:tableADateStoreForGrid,
structure:"layoutGridForTableA",
queryOptions:{deep:true},
query:{},
onRowClick: function(e) {
populateTableB();
},
rowsPerPage:5">
</div>
</div>

Це таблиця B, яку потрібно заповнити клацанням рядка над таблицею, тобто таблицею A

<div style="width: 800px; height: 200px;" class="left-div">
<div data-dojo-type="dojo/store/Memory" data-dojo-props="data:storeDataForTableB, idProperty:"tableBid"" data-dojo-id="tableBDateStore">
</div>
<!-- Create the model bridging the store and the Tree -->
<div data-dojo-type="dojo/data/ObjectStore" data-dojo-id="tableBDateStoreForGrid"
data-dojo-props="objectStore: tableBDateStore"></div>

<div id="dateGrid"
data-dojo-type="dojox/grid/DataGrid"
data-dojo-props="store:tableBDateStoreForGrid,
structure:"layoutGridForTableB",
queryOptions:{deep:true},
query:{},
rowsPerPage:5">
</div>
</div>

А нижче - це сценарій додзю, який я використав

<script>

require(["dojo/parser", "dijit/form/FilteringSelect", "dijit/form/Button", "dojox/data/HtmlTableStore", "dojox/grid/DataGrid"]);
require(["dojo/store/Memory", "dojo/data/ObjectStore", "dojox/grid/DataGrid", "dojo/_base/lang", "dojox/grid/DataGrid",
"dojo/data/ItemFileWriteStore", "dojox/grid/cells/dijit", "dojox/grid/cells/CheckBox", "dojo/dom", "dojo/domReady!"], function () {


layoutGridForTableA = [[
{ field: "nm", name: "Name", width: "auto" },
{ field: "Cod", name: "Code", width: "auto" },
{ field: "startDt", name: "Start Date", width: "auto" },
{ field: "endDt", name: "End Date", width: "auto" }
]];


layoutGridForTableB = [[
{ field: "day", name: "Day", width: "auto" },
{ field: "description", name: "Description", width: "auto" },
{ field: "event", name: "Event", width: "auto" },
{ field: "checkBoxTest", name: "Check Box Test", width: "auto", editable: true, type: dojox.grid.cells.Bool, formatter:formatCell, styles: "text-align: center;" },
{ field: "", name: "", width: "auto", formatter:editButton}

]];

storeDataForTableA = [];
storeDataForTableB = [];

var formatCell = function(){

var checked = val? "checked="checked";" : "<input type="checbox"" +checked+"disabled="disabled"/>";

return checked;

};


function editButton(){
return "<button onclick="" class="editbuttonicon"></button>";

}



});

function populateTableA(){

var addItemToTableA = { name:"Steve", Cod:"007", startDt:"any date", endDt:"any date"};
for (var i=0;i<4;i++)
{
tableADateStoreForGrid.newItem(addItemToTableA );
}
}

function populateTableB(){

var addItemToTableA = { name:"Steve", Cod:"007", startDt:"any date", endDt:"any date"};
for (var i=0;i<4;i++)
{
tableBDateStoreForGrid.newItem(addItemToTableA );
}
}

</script>

У наведеному вище скрипті можна дізнатись, що я цього не зробивзаповнив таблицю B, тому що тут є проблема писати її. Я отримав у інтернеті якийсь сценарій, який вимагає ajax, щоб надсилати та отримувати дані JSON. Але немає пояснення URL-адреси. Я спробував назвати те, що на карті запитується. Але це не викликало запит. Я пройду сценарій, який я використав.

      dojo.ready(function(){
dojo.xhrGet({
url  : "populateFromSpring",
handleAs: "json",
load: function(Beans) {
//I need to get the Beans object here and populate the Table B
alert("hi");
},
error: function(err) {
alert("err: "+err);
}
});
});

Я спробував цю внутрішню функцію заповнити TableB замість циклу, який знаходиться всередині скрипта, який можна помітити.

Нижче я даю вам контролер весни

import java.util.ArrayList;
import java.util.List;
import org.springframework.stereotype.Controller;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.RequestMethod;
import org.springframework.web.bind.annotation.RequestParam;
import org.springframework.web.bind.annotation.ResponseBody;


import com.model.TableBBean;
@Controller
@RequestMapping("/populateFromSpring")
public class PopulateFromSpringCtrl {

@RequestMapping(method = RequestMethod.POST)
public @ResponseBody List<TableBBean> tableBmth(@RequestParam String name) {

//            ModelAndView mv = new ModelAndView("loginsuccess");

List<TableBBean> Beans = new ArrayList<TableBBean>();

TableBBean B1 = new TableBBean();

B1.setDay(1);
B1.setDescription("Desc 1");
B1.setEvent("GS");
B1.setCheckBox("0");


TableBBean B2 = new TableBBean();

B2.setDay(2);
B2.setDescription("Desc 2");
B2.setEvent("GS");
B2.setCheckBox("1");


TableBBean B3 = new TableBBean();

B3.setDay(3);
B3.setDescription("Desc 3");
B3.setEvent("GS");
B3.setCheckBox("1");


Beans.add(B1);
Beans.add(B2);
Beans.add(B3);


//mv.addObject("Beans",Beans);
return Beans;
}

}

Я знаю, що цей контролер не повністю завершено, і мені потрібна допомога в заповненні цього контролера та перетворення біса в JSON.

Отже, все, що я потребую, - це

Додзё повинен викликати цей контролер і надіслати деякі дані, скажімо, наприклад, id від стовпчика таблиці ", то він повинен повернути дані як JSON і заповнити таблицю Б.

Відповіді:

0 для відповіді № 1

Щоб повернути JSON в Spring MVC, переконайтеся, що у вас є бібліотеки Jackson і виконайте щось на кшталт:

@RequestMapping("myHandler")
public @ResponseBody MyBean myHandlerToGetBean() {
// Do some stuff...
return myBean;  // return instance of MyBean
}

Весна побачить об'єкт, що повертається, MyBean, і автоматично магічно конвертувати його за допомогою Джексона. Ви можете використовувати анотації Джексона, щоб полегшити певний контроль над тим, як MyBean отримує серіал / маршал, якщо вам не потрібно нічого надто фантастичного. Якщо вам потрібне те, що дає більший контроль, ви можете відмовитися від повернення вашої MyBean безпосередньо, а замість цього повертає рядок і використовує спеціальний серіалізатор Jackson. Ви також можете налаштувати свій Content-Type щоб означати, що ви повертаєте JSON.

На вашій стороні клієнта можна використовувати щось на зразокjQuery або будь-що, щоб зробити AJAX дзвінок до вашої служби, і використовувати об'єкт повертає безпосередньо в JavaScript (браузер повинен перетворити JSON на об'єкт JavaScript, знову "автоматично магічно"). Що ви робите з цим, то залежить від ваша реалізація, але, схоже, ви хотіли б змінити DOM своєї таблиці чи щось. Ви також можете подати заяву на який-небудь вид табличного плагінгу, і якщо так, то вам потрібно буде прочитати документацію, щоб точно визначити, який формат JSON повинен бути і як робити оновлення.