Tengo una mesa que A está hecha de dojo y yonecesidad de poblar a otro la tabla B otra vez usando dojo. Aquí tengo que hacer clic en la fila de la tabla A y basado en esa fila, necesito hacer una llamada a mi controlador de primavera junto con voy a enviar la identificación de la fila o algún valor de la fila al controlador y el controlador, debe devolver los datos JSON de un modelo que necesito volver al dojo para que sea como la tabla B.
Aquí abajo les muestro lo que tengo.
Botón para llenar una tabla que obtuve en la búsqueda de 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>
Esta es la tabla A que se va a completar al hacer clic en el botón
<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>
Esta es la tabla B que se completará en el clic de fila de la tabla anterior, que es la Tabla 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>
Y debajo está la secuencia de comandos dojo que utilicé
<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>
En la secuencia de comandos anterior se puede encontrar que no lo hicellenó la tabla B porque aquí está el problema para escribirla. Tengo un script en internet que hace una solicitud ajax para enviar y recibir datos JSON. Pero no hay explicación para URL. Probé el mismo nombre que está mapeado en la solicitud. Pero no llamó a la solicitud. Pasaré el guión que utilicé.
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);
}
});
});
Intenté esta función dentro de populateTableB en lugar de for, que se encuentra dentro del script.
A continuación te doy el controlador de primavera
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;
}
}
Sé que este controlador no está completo y necesito ayuda para completar este controlador y convertir el bean a JSON.
Entonces las cosas que necesito es
Dojo debe llamar a este controlador y enviar algunos datos, por ejemplo, id de la fila de la tabla A, entonces debería recuperar los datos como JSON y poblar la tabla B.
Respuestas
0 para la respuesta № 1Para devolver JSON en Spring MVC, asegúrese de tener las bibliotecas de Jackson y hacer algo como:
@RequestMapping("myHandler")
public @ResponseBody MyBean myHandlerToGetBean() {
// Do some stuff...
return myBean; // return instance of MyBean
}
Spring verá que se devuelve el objeto, MyBean, y auto-mágicamente convertirlo usando Jackson. Puede usar las anotaciones de Jackson para facilitar el control sobre cómo MyBean se serializa / mapea si no necesitas algo demasiado elegante. Si necesitas algo que te dé más control, puedes renunciar a devolver tu MyBean directamente, y en su lugar devuelve un String y utiliza un serializador personalizado Jackson. Es posible que también desee configurar su Content-Type para indicar que estás regresando a JSON.
En su lado del cliente, puede usar algo comojQuery, o lo que sea, para hacer una llamada AJAX a su servicio, y usar el objeto devuelve directamente en el JavaScript (el navegador debe convertir el JSON en un objeto JavaScript, de nuevo "auto-mágicamente". Lo que haga con él depende entonces de su implementación, pero parece que quisiera modificar el DOM de su tabla o algo así. También puede estar demandando algún tipo de complemento de tabla, y si es así, necesitará leer la documentación para ver exactamente qué formato debería tener el JSON. estar en y cómo hacer las actualizaciones.