Treegrid loading

Develop and Deploy Cross-Browser Web Apps .

Treegrid loading

Postby tomy300 » Mon Nov 25, 2013 12:42 am

Hello I would like to load my data but I got problem, the function "returndata" return json encode data but does't show ... here the console.log info

[{"id":"1","nom":"Gallerie photo","desc":"Gallerie photo pour le site quebec en affaires","id_client":"1","heureeval":"30","heurereel":"13","datedue":"2013-11-30"},{"id":"2","nom":"Construire site QEAFF","desc":"Reconstruire le site Le Quebec en affaires","id_client":"1","heureeval":"587","heurereel":"587","datedue":"2014-04-28"}]

I don't know if the data is correct but I need the header to be the same right? to make it work.
what if I want to remove particuliar column because it's a FK ?

here my code
Code: Select all
// The default code is a com class (inherited from xui.Com)
Class('App', 'xui.Com',{
    // Ensure that all the value of "key/value pair" does not refer to external variables
    Instance:{
        // To initialize instance(e.g. properties)
        initialize : function(){
            // To determine whether or not the com will be destroyed, when the first UI control be destroyed
            this.autoDestroy = true;
            // To initialize properties
            this.properties = {};
        },
        // To initialize internal components (mostly UI controls)
        // *** If you're not a skilled, dont modify this function manually ***
        iniComponents : function(){
            // [[Code created by CrossUI RAD Tools
            var host=this, children=[], append=function(child){children.push(child.get(0));};
           
            append((new xui.UI.Stacks())
            .setHost(host,"stactcontainer")
            .setItems([{"id":"a", "caption":"Contrat", "image":"img/demo.gif"}, {"id":"c", "caption":"Comtabilité", "image":"img/demo.gif"}])
            .setDock("left")
            .setValue("a")
            );
           
            host.stactcontainer.append((new xui.UI.Panel())
            .setHost(host,"pan_client")
            .setZIndex(1)
            .setCaption("Clients")
            , "a");
           
            host.pan_client.append((new xui.UI.List())
            .setHost(host,"lstclient")
            .setDock("fill")
            .setValue("a")
            .afterClick("_lstclient_afterclick")
            );
           
            append((new xui.UI.Panel())
            .setHost(host,"pan_lstfac")
            .setZIndex(1)
            .setCaption("Factures")
            );
           
            host.pan_lstfac.append((new xui.UI.TreeGrid())
            .setHost(host,"tg")
            .setDock("top")
            .setRowNumbered(true)
            .setHeader([{"id":"col1", "width":80, "type":"input", "caption":"Id"}, {"id":"col2", "width":80, "type":"input", "caption":"nom"}, {"id":"col3", "width":80, "type":"input", "caption":"desc"}, {"id":"col4", "width":80, "type":"input", "caption":"heureeval"}, {"id":"col5", "width":80, "type":"input", "caption":"heurereel"}, {"id":"col6", "width":80, "type":"input", "caption":"datedue"}])
            .setRows([{"cells":[{"value":"row1 col1", "id":"c_a"}, {"value":"row1 col2", "id":"c_b"}, {"value":"row1 col3", "id":"c_c"}, {"value":"row1 col4", "id":"c_d"}, {"id":"c_e", "value":""}, {"id":"c_f", "value":""}], "id":"d"}, {"cells":[{"value":"row2 col1", "id":"c_e"}, {"value":"row2 col2", "id":"c_f"}, {"value":"row2 col3", "id":"c_g"}, {"value":"row2 col4", "id":"c_h"}, {"id":"c_k", "value":""}, {"id":"c_l", "value":""}], "id":"e"}, {"cells":[{"value":"row3 col1", "id":"c_i"}, {"value":"row3 col2", "id":"c_j"}, {"value":"row3 col3", "id":"c_k"}, {"value":"row3 col4", "id":"c_l"}, {"id":"c_q", "value":""}, {"id":"c_r", "value":""}], "sub":[["sub1", "sub2", "sub3", "sub4"]], "id":"f"}])
            );
           
            host.pan_lstfac.append((new xui.UI.Input())
            .setHost(host,"ctl_input4")
            .setLeft(-50)
            .setTop(220)
            .setWidth(310)
            .setLabelSize(120)
            .setLabelCaption("Nom")
            );
           
            host.pan_lstfac.append((new xui.UI.Input())
            .setHost(host,"ctl_input5")
            .setLeft(-50)
            .setTop(246)
            .setWidth(310)
            .setLabelSize(120)
            .setLabelCaption("Prenom")
            );
           
            host.pan_lstfac.append((new xui.UI.Input())
            .setHost(host,"ctl_input6")
            .setLeft(-40)
            .setTop(271)
            .setWidth(310)
            .setLabelSize(120)
            .setLabelCaption("Contrat #")
            );
           
            return children;
            // ]]Code created by CrossUI RAD Tools
        },
        // Give a chance to load other com
        iniExComs : function(com, threadid){
            main=this;
        },
        // Give a chance to determine which UI controls will be appended to parent container
        customAppend : function(parent, subId, left, top){
            // "return false" will cause all the internal UI controls will be added to the parent panel
            return false;
        },
        onOK:function(response){
          console.log(response[0]["nom"]);
          for(i=0;i< response.length;i++)
          {
             var clientname =  response[i]["prenom"] + " " + response[i]["nom"];
             var clientid = response[i]["id"];
             
             
              var stroka=[{"value":"isv", "caption":clientname, "id":clientid}];

              main.lstclient.insertItems(stroka);

          }

        },
        onFail:function(response){
          alert(response); 
        },
        events:{"onRender":"_com_onrender"},
        _com_onrender:function (com,threadid){
            ns = this;
             var data={
                   "functionname": "getclientlist",
                   "insite": true
             };
             xui.Thread.observableRun(function(threadid){
                   xui.Ajax('formexe.php',data, ns.onOK, ns.onFail,threadid,{method:'POST'}).start();
             });
        },
        _lstclient_afterclick:function (profile,item,e,src){
            var ns = this, uictrl = profile.boxing();
            console.log(item);
            main.peuplegrid(item.id);
               
         },
        peuplegrid:function(id){
            ns = this;
                   var data={
                     "functionname": "getgridclientinfo",   
                     "clientid": id,
                     "insite": true
             };
           
            xui.Thread.observableRun(function(threadid){
                   xui.Ajax('formexe.php',data, ns.returndata, ns.onFail,threadid,{method:'POST'}).start();
             });
           
        },
  [b]     returndata:function(sdata){
                   var data =sdata;
                    if(!data)alert("no data");
                    else{
                        if(data.header)
                            main.tg.setHeader(data.header);
                        if(data.rows)
                            main.tg.setRows(data.rows);
                    }
           //alert(sdata[0]["nom"]);
        }[/b]
    }
});


Here the php file

Code: Select all
<?php
$bContinuer = false;

if(isset($_POST['insite'])){
   if($_POST['insite'] == true){
      define('IN_SITE',true);

   }
}

require_once("sys/utility.php");
require_once("mysql/config.php");
require_once("mysql/db.mysql.class.php");
require_once("mysql/db.class.php");

if(isset($_POST['functionname'])){
  $getfunction = $_POST['functionname'];
  if($getfunction != ""){
     $bContinuer = true;
     switch($getfunction){
      case "getclientlist":
         func_getclientlist();
      break;
      case "getgridclientinfo":
          func_getgridclientinfo();
      break;

     }


  }
}

function func_getclientlist(){
    $sqlCLIENT = "SELECT * FROM clients";
    $rows = array();
     $resultCLIENT= mysql_query($sqlCLIENT);
      if(mysql_num_rows($resultCLIENT) > 0){
      while($r = mysql_fetch_assoc($resultCLIENT)) {
      $rows[] = $r;
      }
         echo json_encode($rows);
      }else{
        echo "fail";
      }
}

function func_getgridclientinfo()
{
if(isset($_POST['clientid'])){
  $idclient = $_POST['clientid'];
 $sqlCLIENT = "SELECT * FROM contrat where id_client=".$idclient;
    $rows = array();
     $resultCLIENT= mysql_query($sqlCLIENT);
      if(mysql_num_rows($resultCLIENT) > 0){
      while($r = mysql_fetch_assoc($resultCLIENT)) {
      $rows[] = $r;
      }
         print json_encode($rows);
      }else{
        print "fail";
      }
   }
}


?>


any help.

thanks
tomy300
 
Posts: 70
Joined: Sat Nov 09, 2013 12:27 am

Re: Treegrid loading

Postby support » Mon Nov 25, 2013 5:28 am

You can learn it from our Examplesor CodeSnap:

In you case, adjust your data to :

[{"id":"1", cells:["Gallerie photo", Gallerie photo pour le site quebec en affaires", "1", "30", "13", "2013-11-30"]},{"id":"2", cells:["Construire site QEAFF","Reconstruire le site Le Quebec en affaires", "1", "587", "587", "2014-04-28"]}]
support
 
Posts: 352
Joined: Sat Apr 27, 2013 9:22 am


Return to CrossUI for Web Apps

Who is online

Users browsing this forum: No registered users and 2 guests

cron