Can't Get Form to Load

Suite and Optimus Suite 5
#1

Hello Everyone,
I’m been struggling with loading data into a form. Grids seem to work find. The problem is that no matter what I do I can’t get any data into the form. I added a dhtmlx.message command to confirm that my event is being triggered correctly and then I called the php file directly and I get what looks like good data to me. Since I’m new to dhtmlx I’m sure I’m missing something simple I just haven’t been able to find it on my own. I’m hoping someone here can point me in the right direction.

Here is my page

<code javascript>
<!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=utf-8" />
    <title>UISE Goals Application</title>
    <!-- dhtmlx.js contains all necessary dhtmlx library javascript code -->
    <script src="codebase/dhtmlx.js" type="text/javascript"></script>
    <!-- dhtmlx.css contains styles definitions for all use components -->
    <link rel="STYLESHEET" type="text/css" href="codebase/dhtmlx.css">
    <script src="codebase/connector/connector.js"></script>
    <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;
        }
        &lt</style>

<script type="text/javascript">


        dhtmlx.image_path='./codebase/imgs/';

        var main_layout = new dhtmlXLayoutObject(document.body, '2U');

        var a = main_layout.cells('a');
        var grid_1 = a.attachGrid();
        grid_1.setIconsPath('./codebase/imgs/');
        grid_1.setHeader(["Column 1","Column 2","Column 3","Column 4"]);
        grid_1.setColTypes("ro,ro,ro,ro");
        grid_1.setColSorting('str,str,str,str');
        grid_1.init();
        grid_1.load('./data/simple_grid.php');
        
        var b = main_layout.cells('b');
        var str = [
                { type:"input" , name:"form_input_1", label:"Input", position:""  },
                { type:"input" , name:"form_input_2", label:"Input", position:""  },
                { type:"input" , name:"form_input_3", label:"Input", position:""  },
                { type:"button" , name:"form_button_1", value:"Button", position:""  }
        ];
        var form_1 = b.attachForm(str);

        grid_1.attachEvent("onRowSelect",function(rID,cInd){
                dhtmlx.message("Goals Set ID: "+rID);
                form_1.load("./data/simple_form.php?id="+rID);
        });

</script>
</head>

<body>

</body>
</html>
</code>

What I’m struggling with is loading form_1. As you can see I’m using simple_form.php to load data from a MySQL database. Here are the contents of simple_form.php

<?php
require("../codebase/connector/form_connector.php");
$res=mysql_connect("localhost","cygoals","");
mysql_select_db("cygoals");
$formConn = new FormConnector($res,"MySQL");
$formConn->render_sql("Select * from projects",
	"id",
	"id,code,code,description");
?>

If I call the php file directly I get the following

<?xml version='1.0' encoding='utf-8' ?><data><id><![CDATA[4]]></id><code><![CDATA[PBAT]]></code><code><![CDATA[PBAT]]></code><description><![CDATA[PBATS v1.x Project Goals File]]></description>
</data>

Thanks,
Eric

#2

Hello Eric,

I had the same problem until I noticed that I had to ‘bind’ the retrieved data to an item.

Just look closely at the example form, and you will see that the item has a bind attribute.
If I leave it out, the data is not shown on the form.

Hope it helps,
ALex

#3

You need to define names of fields, like next

{ type:"input" , name:"code", label:"Input", position:"" }, { type:"input" , name:"description", label:"Input", position:"" }

#4

Hello Stanislav and Alex,

Thank you for your help. The binding, or making the MySQL field names match the form names, makes perfect sense. Now that I’ve modified my html file the form is working as expected.

HTML

        var str = [
                { type:"input" , name:"id", label:"Input", position:""  },
                { type:"input" , name:"code", label:"Input", position:""  },
                { type:"input" , name:"description", label:"Input", position:""  },
                { type:"button" , name:"form_button_1", value:"Button", position:""  }
        ];

PHP

$formConn->render_sql("Select * from projects",
        "id",
        "id,code,code,description");
?>

Thank you again,
Eric