Can't locate layout, form, grid and combo on the page

I found that i can’t locate on the same page layout, form, grid and combo. Why?

Unfortunately the issue is cannot be reconstructed localy
PLease provide any kind of sample to reconstruct an issue

Thanks for answer. I prefer to not use layout in my clien-side code and i lost my old code, but i try to restore its.

My code

[code]

<script src="../dhtmlxSuite/dhtmlxGrid/codebase/dhtmlxgrid.js" type="text/javascript" charset="windows-1251"></script>
<script src="../dhtmlxSuite/dhtmlxGrid/codebase/dhtmlxgridcell.js" type="text/javascript" charset="windows-1251"></script>
  <script src="../dhtmlxSuite/dhtmlxGrid/codebase/ext/dhtmlxgrid_nxml.js" type="text/javascript" charset="windows-1251"></script>
<script src="../dhtmlxSuite/dhtmlxGrid/codebase/ext/dhtmlxgrid_selection.js" type="text/javascript" charset="windows-1251"></script>
<script src="../dhtmlxSuite/dhtmlxCombo/codebase/dhtmlxcombo.js" type="text/javascript" charset="windows-1251"></script>
<script src="../dhtmlxSuite/dhtmlxForm/codebase/dhtmlxform.js" type="text/javascript" charset="windows-1251"></script>
Фильтр
Check
Disable
Количество строк
      <div id="form_container" style="background-color:white;overflow:hidden"></div>
      </td>
     <td height="550" colspan="3" valign="top"><div id="gridbox" height="100%" width="100%" style="background-color:white;overflow:hidden"></div>
      </td>
    </tr>
   <tr>
     <td colspan="3" rowspan="2" valign="top"><textarea rows="5" cols="45" id="sql_query"> </textarea></td>
    </tr>
      <tr>
        <td width="180" valign="top"><div>
          <button type="button" onclick="create_grid()">select</button>
       </div>
          <div>
            <button type="button" onclick="deleteRows()">Delete selected rows</button>
        </div>
          <div>
            <button type="button" onclick="addRow()">Paste row from clipboard</button>
        </div>
          <div>
            <button type="button" onclick="sync()">Sync with DB</button>
        </div></td>
        </tr>
<script>

var formStructure, dhxLayout, mygrid;
var row_count = document.getElementById(‘row_count’);
var sql_query = document.getElementById(‘sql_query’);
var query = {
TComm:"",
Code:"",
Price:"",
PriceL:"",
Datetime_Enbl:"",
Datetime_Dsbl:"",
TCurr:"",
fTax:"",
Region:"",
Act:"",
Exb:"",
Dir_name:""
};

formStructure =
[
{
type: “settings”,
position: “label-left”,
labelWidth: 180,
inputWidth: 180,
labelAlign: “left”
},
{
type: “input”,
label: “TComm”,
name: “TComm”
},
{
type: “input”,
label: “Code”,
name: “Code”
},
{
type: “input”,
label: “Price”,
name: “Price”
},
{
type: “input”,
label: “PriceL”,
name: “PriceL”
},
{
type: “input”,
label: “Datetime_Enable(yyyy.mm.dd)”,
name: “Datetime_Enbl”
},
{
type: “input”,
label: “Datetime_Disable(yyyy.mm.dd)”,
name: “Datetime_Dsbl”,
value: “is null”
},
{
type: “input”,
label: “TCurr”,
name: “TCurr”
},
{
type: “input”,
label: “fTax”,
name: “fTax”
},
{
type: “input”,
label: “Region”,
name: “Region”
},
{
type: “input”,
label: “Act”,
name: “Act”
},
{
type: “input”,
label: “Exb”,
name: “Exb”
},
{
type: “input”,
label: “Dir_name”,
name: “Dir_name”
}
];

mygrid = new dhtmlXGridObject(‘gridbox’);

mygrid.setImagePath("…/dhtmlxSuite/dhtmlxGrid/codebase/imgs/");
mygrid.setHeader(“TComm, Code, Dir_name, Price, PriceL, Datetime_Enbl, Datetime_Dsbl, TCurr, fTax, Act, Exb”);
mygrid.setColTypes(“ed,ed,ed,ed,ed,ed,ed,ed,ch,ch,ch”);
mygrid.setColSorting(“int,str,str,server,server,date,date,int,int,int,int”);
mygrid.attachEvent(“onKeyPress”, onKeyPressed);
mygrid.setSkin(“dhx_skyblue”);
mygrid.init();
mygrid.enableMultiselect(true);
mygrid.enableBlockSelection(true);
mygrid.setCSVDelimiter("\t");
mygrid.enableSmartRendering(true,200);

mycombo_plans = new dhtmlXCombo(“combo”, “combo_source”, ‘180px’);
mycombo_plans.loadXML(“clientplans_combo.php”);

var query_str = “”;
var data_url = “”;
var value_plan = null;

var dp = new dataProcessor(“tariffs_grid.php”);
dp.setUpdateMode(“off”);
dp.setTransactionMode(“POST”, true);
dp.init(mygrid);

mycombo_plans.attachEvent(“onChange”,function(){
value_plan = this.getActualValue();
create_grid();
});

var dhxLayout = new dhtmlXLayoutObject(“form_container”);
var a = dhxLayout.cells(‘a’);
myForm = a.attachForm(formStructure);
myForm.forEachItem(function(id){
query[id] = myForm.getItemValue(id);
query_str = “”;
for(var key in query) {
if ((query[key] != null) && (typeof query[key] != ‘undefined’) && (query[key] != ‘undefined’) && (query[key] != “”)) {
if (query_str.length > 0) query_str = query_str +" and “+ key+” “+query[key];
else query_str = key+” "+query[key];
}
}
return true;
});

myForm.attachEvent(“onBeforeChange”,function(id, old_value, new_value){
query[id] = new_value;
query_str = “”;
for(var key in query) {
if ((query[key] != null) && (typeof query[key] != ‘undefined’) && (query[key] != ‘undefined’) && (query[key] != “”)) {
if (query_str.length > 0) query_str = query_str +" and “+ key+” “+query[key];
else query_str = key+” "+query[key];
}
}
return true;
});

function create_grid(){

  query_grid = "";
  query_grid_add = "";
  data_url = "";
  mygrid.clearAll();
  if ((value_plan*1) != 0) {
     query_grid = "Tariffs.idPlan="+value_plan;
     query_grid_add="&idPlan="+value_plan;
  }
  else {row_count.value = 0; return;}
  if (query_str.length > 0) data_url = "tariffs_grid.php?condition= and ("+query_grid+") and ("+query_str+")"+query_grid_add;
  else if (query_str.length <= 0) data_url = "tariffs_grid.php?condition= and ("+query_grid+")"+query_grid_add;
  sql_query.value = data_url;
  data_url = encodeURI(data_url);
  dp.serverProcessor = data_url;
  mygrid.loadXML(data_url);
  
  dhtmlxAjax.get(data_url,function (loader){
     try{
        row_count.value = loader.xmlDoc.responseXML.getElementsByTagName("rows")[0].getAttribute("total_count");
     }
     catch(e){ alert (e.name);}
  });

}

function check(){
data_url = “”;
data_url = “tariffs_grid.php?action=check”
data_url = encodeURI(data_url);
mygrid.loadXML(data_url);
dp.serverProcessor = data_url;
}
function disable(){
data_url = “”;
data_url = “tariffs_grid.php?action=disable”
data_url = encodeURI(data_url);
mygrid.loadXML(data_url);
dp.serverProcessor = data_url;
}

function onKeyPressed(code, ctrl, shift)
{
if (code == 67 && ctrl) {
if (!mygrid._selectionArea)
return alert(“You need to select a block area in grid first”);
mygrid.copyBlockToClipboard();
mygrid._HideSelection();
}
if (code == 86 && ctrl) {
mygrid.setCSVDelimiter("\t");
mygrid.pasteBlockFromClipboard();
}
return true;
}

function sync_with_DB() {

}
function addRow() {
mygrid.addRowFromClipboard();
}
function sync(){
dp.sendData();
create_grid();
}
function deleteRows(){
mygrid.deleteSelectedRows();
}

[/code]

I don’t see in browser dhtmlxlayout and dhtmlxform. But when i use only dhtmlxform all are ok.

I resolved this. In declaration of div block, where is placed layout, need to include size of block - width and height.

But i don’t find any example where described how to attach combo with datasource to form. Can anybody explain me?

You can find example at your dhtmlxForm package dhtmlxForm\samples\02_items\08_combo.html

Ol’ga, thanks for your reply. But it’s not that i want. In this example user must fill combo not from datasource. But i resolved this by using atachObject method where i determine parameter as div block where my combo is placed.

How did you do that greendraw?

I did something like this
Place some div-block

[code]




Тарифный план


[/code]

and something like this

[code] dhxLayout = new dhtmlXLayoutObject(document.body, “4I”);
myForm = dhxLayout.cells(‘b’).attachForm(formStructure);
myButtonsForm = dhxLayout.cells(‘d’).attachForm(formButtonsStructure);
mygrid = dhxLayout.cells(‘c’).attachGrid();
dhxEditor = dhxLayout.cells(“a”).attachObject(“info_block”);

dhxLayout.cells("a").setHeight(130);
dhxLayout.cells("b").setWidth(220);	
dhxLayout.cells("d").setHeight(100);

dhxLayout.cells("a").hideHeader();
dhxLayout.cells("b").hideHeader();
dhxLayout.cells("c").hideHeader();
dhxLayout.cells("d").hideHeader();[/code]

Good luck!