Save from diferent component

Me again! :frowning:
I read a lot but don’t understand how can I save from different components to a different tables

my tables:

tblmaterial
-
idSerie
marca
modelo
descripcion
cantidad
estado
tipo

tblprestamo
-
idPrestamo
idRut
f_ini
f_fin
multa

nubprestamo
-
idSerie
idPrestamo
cantidad

gridPrestamo.php (i recieve from URL 3 vars, r n & t)

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1" />
    <title>Préstamo - Solicitante</title>
    <!-- dhtmlx.js contains all necessary dhtmlx library javascript code -->
    <script src="codebase/dhtmlx.js" type="text/javascript"></script>
    <script src="codebase/dhtmlxgrid_export.js" type="text/javascript"></script>
    <!-- dhtmlx.css contains styles definitions for all included components -->
    <link rel="STYLESHEET" type="text/css" href="codebase/dhtmlx.css">
    <style>
            /*these styles allow dhtmlxLayout to work in fullscreen mode in different browsers correctly*/
        html, body {
           width: 100%;
           height: 100%;
           margin: 0px;
           overflow: hidden;
           background-color:white;
        }
    </style>
    
    <div id="contenedor" style="width: 100%; height: 100%;"></div>
    
<script type="text/javascript">
    
function OnLoad(){
// variables rut nombre tipo    
var Url = location.href;
Url = Url.replace(/.*\?(.*?)/,"$1");
Url = Url.replace("%20"," ");
Variables = Url.split ("&");
for (i = 0; i < Variables.length; i++) {
       Separ = Variables[i].split("=");
       eval ('var '+Separ[0]+'="'+Separ[1]+'"');
}

var layout,toolbar,mateqGrid,mateqForm,mateqFormData;
var cTipo = 0; // 1 = Equipo prestado a alumno ( MAXIMO 1 POR ALUMNO )
var i = 0;
dhtmlx.image_path = "codebase/imgs/";
    
    //Layout   
    layout = new dhtmlXLayoutObject("contenedor","3E");    
    layout.cells("a").setText("Datos Préstamo");
    layout.cells("a").setHeight(150);
    layout.cells("b").setText("Lista Materiales");
    layout.cells("b").setHeight(200);
    layout.cells("c").setText("Materiales a Prestar");
     
    // Info Form
    
    formPrestamo = [
        {type: "settings",position:"label-right"},
        {type: "fieldset",  name: "mydata", label: t + " : " + n, width:800, list:[  
        {type: "input", name: "multa", label: "Multa"},
        {type: "calendar", name: "f_ini", label: "Fecha Préstamo", readonly:true},
		{type: "calendar", name: "f_fin", label: "Fecha Devolución", readonly:true},
        {type: "newcolumn"},
        {type: "hidden", name: "idRut", value: r},
        {type: "hidden", name: "idRut"},
        {type: "button", name: "save", value: "Generar Préstamo", command: "save"}
    ]}
    ];
    
    var newFormSol = layout.cells("a").attachForm(formPrestamo);
    
    // Grid Materiales
    mateqGrid2 = layout.cells("b").attachGrid();
    
    mateqGrid2.setHeader("IdSerie,Marca,Modelo,Descripcion,Tipo,Cantidad");
    mateqGrid2.setInitWidths("100,150,150,*,100,100");
    mateqGrid2.setColAlign("left,left,left,left,left,right");
    mateqGrid2.setColTypes("ro,ro,ro,ro,ro,ro");
    mateqGrid2.setColSorting("str,str,str,str,str,str");
    mateqGrid2.attachHeader("#text_filter,#text_filter,#text_filter,#text_filter,#select_filter,#text_filter");
    mateqGrid2.init();
    mateqGrid2.load("recursos/gridMaterial.php?e=2");
    
    // Grid Seleccionados
    
    mateqGrid3 = layout.cells("c").attachGrid();
    
    mateqGrid3.setHeader("IdSerie,Marca,Modelo,Descripcion,Tipo,Cantidad,rIdSel");
    mateqGrid3.setInitWidths("100,150,150,*,100,100,3");
    mateqGrid3.setColAlign("left,left,left,left,left,right,right");
    mateqGrid3.setColTypes("ro,ro,ro,ro,ro,ro,ro");
    mateqGrid3.setColSorting("str,str,str,str,str,str,str");
    mateqGrid3.attachHeader("#text_filter,#text_filter,#text_filter,#text_filter,#select_filter,#text_filter");
    mateqGrid3.init();
    
    
    //Grid Materiales Events
    
    mateqGrid2.attachEvent("onRowDblClicked", function(rId,cInd){
        var rCantidad = 0;
        var rCa = 0;
        var rIdSel = mateqGrid2.getRowIndex(rId);
        rTipo = mateqGrid2.cellById(rId,4).getValue();

        var rCantidad = prompt ("Ingresar Cantidad","1");
        rCantidad = parseInt(rCantidad);
        
        rCa = parseInt(mateqGrid2.cellById(rId,5).getValue());

        if(rCantidad > 0 && rCantidad <= rCa){
        rIdSerie = mateqGrid2.cellById(rId,0).getValue();
        rMarca = mateqGrid2.cellById(rId,1).getValue();
        rModelo = mateqGrid2.cellById(rId,2).getValue();
        rDesc = mateqGrid2.cellById(rId,3).getValue();
        
        rCantidad2 = rCa - rCantidad;
        
        if(rTipo == "Equipo" && t == "Alumno"){cTipo=1;}
        
        var newId=dhtmlx.uid()
        mateqGrid3.addRow(newId,[rIdSerie,rMarca,rModelo,rDesc,rTipo,rCantidad,rId],0);
        mateqGrid2.cellById(rId,5).setValue(rCantidad2);
        }else{
            alert('La cantidad ingresada debe ser igual o mayor al Stock');
        }
        
    });
    
    //Grid Materiales Sel Events
    
    mateqGrid3.attachEvent("onRowDblClicked", function(rId,cInd){
        var idGrid2 = mateqGrid3.cellById(rId,6).getValue();
        drCa1 = parseInt(mateqGrid2.cellById(idGrid2,5).getValue());
        drCa2 = parseInt(mateqGrid3.cellById(rId,5).getValue());
        drCa3 = drCa1+drCa2;
        mateqGrid2.cellById(idGrid2,5).setValue(drCa3);
        mateqGrid3.deleteRow(rId);
        
    });
    
    var dpfs = new dataProcessor("recursos/gridMaterial.php?e=3");
        dpfs.init(mateqGrid2);
        
    newFormSol.attachEvent("onButtonClick", function(name, command){
            mateqGrid2.save();
    });
   
}  
</script>
</head>
<body onload="OnLoad()" >
</body>
</html>

mateqGrid2 ← tblmateriales
mateqGrid3 ← materiales selected

When I submit the form+grids should do
Save mateqGrid2 with the changes in tblmateriales
Save mateqGrid3 all items selected in nubprestamo (prestamo 1, itemsselected, amount)
Save Form in tblprestamo

and thaaankkks agaiiin!!!


You have dataprocessor attached to the mateqGrid2, so all changes in it must be automatically saved to the database. But it will save only edit operations which done by direct interactions with grid and will not save ones, which was done through API.

So if you are changing some cell value through API, you need to instruct dataprocessor to save such data.

For example

mateqGrid2.cellById(rId,5).setValue(rCantidad2); //line from existing code dpfs.setUpdated(rId); //force data saving

Hi Stanislav, thanks for your answer
i tried to do this

mateqGrid2.forEachRow(function(id){
      dpfs.setUpdated(id);
});

but doesn’t work ¿?

i tried inside mateqGrid2.attachEvent(“onRowDblClicked”, function(rId,cInd) and nothing happens

I activated the debugger and the window is clear :confused:

Current state
 Log:

what is wrong??! :frowning:

I forgot to add the line

but still not working

ok i’m doing ALL AGAIN
my dataprocessor is working good
i tried to setUpdated(row,true); before the row change and its ok, work.

but, i need to save all rows when i submit the form, so I trying with dataprocessor.sendData();

debugger says “Initiating data sending for all rows”, but nothing change in the DB

what is wrong now? :frowning:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1" />
    <title>Ingreso MaterialEquipo</title>
    <!-- dhtmlx.js contains all necessary dhtmlx library javascript code -->
    <script src="codebase/dhtmlx.js" type="text/javascript"></script>
    <script src="codebase/connector/connector.js" type="text/javascript"></script>
    <script src="codebase/dhtmlxdataprocessor_debug.js" type="text/javascript"></script>
    <!--  
    -->
    <script src="codebase/dhtmlxgrid_export.js" type="text/javascript"></script>
    <!-- dhtmlx.css contains styles definitions for all included components -->
    <link rel="STYLESHEET" type="text/css" href="codebase/dhtmlx.css">
    <style>
            /*these styles allow dhtmlxLayout to work in fullscreen mode in different browsers correctly*/
        html, body {
           width: 100%;
           height: 100%;
           margin: 0px;
           overflow: hidden;
           background-color:white;
        }
    </style>
    
    <div id="contenedor" style="width: 100%; height: 100%;"></div>
    
<script type="text/javascript">
    
function OnLoad(){

var Url = location.href;
Url = Url.replace(/.*\?(.*?)/,"$1");
Url = Url.replace("%20"," ");
Variables = Url.split ("&");
for (i = 0; i < Variables.length; i++) {
       Separ = Variables[i].split("=");
       eval ('var '+Separ[0]+'="'+Separ[1]+'"');
}
var layout,toolbar,mateqGrid,mateqForm,mateqFormData;
var mateqArray = new Array();
var i = 0;
dhtmlx.image_path = "codebase/imgs/";
    

    //Layout
    layout = new dhtmlXLayoutObject("contenedor","3E");
    
    layout.cells("a").setText("Form");
    layout.cells("a").setHeight(150);
    layout.cells("b").setText("Materiales");
    layout.cells("b").setHeight(200);
    layout.cells("c").setText("Materiales Seleccionados");
    
    
    //Grid Materiales
    mateqGrid = layout.cells("b").attachGrid();
    
    mateqGrid.setHeader("IdSerie,Marca,Modelo,Descripcion,Tipo,Cantidad,Estado");
    mateqGrid.setInitWidths("100,150,150,*,100,100,150");
    mateqGrid.setColAlign("left,left,left,left,left,right,left");
    mateqGrid.setColTypes("ed,ed,ed,ed,ed,ed,ed");
    mateqGrid.setColSorting("str,str,str,str,str,str,str");
    mateqGrid.attachHeader("#text_filter,#text_filter,#text_filter,#text_filter,#select_filter,#text_filter,#select_filter");
    mateqGrid.init();
    mateqGrid.load("recursos/gridMaterial.php",function(){
        mateqGrid.forEachRow(function(id){
        if ((mateqGrid.cellById(id,6).getValue()=="Baja"))
        {
            mateqGrid.setRowColor(id, "FF9966");
        }
        //Color Material <=30 o Equipo <=4
        if ((mateqGrid.cellById(id,4).getValue()=="Material" && mateqGrid.cellById(id,5).getValue()<=30) || (mateqGrid.cellById(id,4).getValue()=="Equipo" && mateqGrid.cellById(id,5).getValue()<=4)){    
            mateqGrid.setCellTextStyle(id,5,"color: red");
        }else{
            mateqGrid.setCellTextStyle(id,5,"color: green");
        }

        });   
        
    });
    
    //DataProcessor para Grid
    var dpg = new dataProcessor ("recursos/gridMaterial.php");
    dpg.setUpdateMode("off");
    dpg.init(mateqGrid);
    
    //Grid2 Seleccionados
    mateqGrid2 = layout.cells("c").attachGrid();
    
    mateqGrid2.setHeader("IdSerie,Marca,Modelo,Descripcion,Tipo,Cantidad,Estado");
    mateqGrid2.setInitWidths("100,150,150,*,100,100,150");
    mateqGrid2.setColAlign("left,left,left,left,left,right,left");
    mateqGrid2.setColTypes("ro,ro,ro,ro,ro,ro,ro");
    mateqGrid2.setColSorting("str,str,str,str,str,str,str");
    mateqGrid2.attachHeader("#text_filter,#text_filter,#text_filter,#text_filter,#select_filter,#text_filter,#select_filter");
    mateqGrid2.init();


    //Grid2 Materiales Events
    
    mateqGrid.attachEvent("onRowDblClicked", function(rId,cInd){
        StockPrestar = prompt ("Ingresar Cantidad","1");
        StockPrestar = parseInt(StockPrestar);
        StockActual = parseInt(mateqGrid.cellById(rId,5).getValue());
        if(StockPrestar <= StockActual){
            CantidadRestada = parseInt(StockActual - StockPrestar);
            var newId=dhtmlx.uid();
            mateqGrid2.addRow(newId,[mateqGrid.cellById(rId,0).getValue(),mateqGrid.cellById(rId,1).getValue(),mateqGrid.cellById(rId,2).getValue(),mateqGrid.cellById(rId,3).getValue(),mateqGrid.cellById(rId,4).getValue(),StockPrestar],0);
            mateqGrid.cellById(rId,5).setValue(CantidadRestada);
        }else{
            alert('La cantidad ingresada debe ser igual o mayor al Stock');
        } 
    });
    
    
    // Info Form
    
    formPrestamo = [
        {type: "settings",position:"label-right"},
        {type: "fieldset",  name: "mydata", label: t + " : " + n, width:800, list:[
        {type: "hidden", name: "idRut", value: r},  
        {type: "input", name: "multa", label: "Multa"},
        {type: "calendar", name: "f_ini", label: "Fecha Préstamo", readonly:true},
		{type: "calendar", name: "f_fin", label: "Fecha Devolución", readonly:true},
        {type: "newcolumn"},
        {type: "button", value: "Generar Préstamo", xcommand: "save"}
    ]}
    ];
    
    var newFormSol = layout.cells("a").attachForm(formPrestamo);
    //Generar Prestamo
    
    newFormSol.attachEvent("onButtonClick", function(name, command){
        dpg.sendData();
    });                
}  
 </script>
</head>
<body onload="OnLoad()" >
</body>
</html>

dataprocessor will send only changed rows, if none was changed through UI or marked as changed by setUpdated API - dataprocessor will not send any data to the server side.

If you need to send all rows - you need to mark them all as changed and trigger sendData after that.