Results 1 to 7 of 7

Thread: add a button with a JSON.....

  1. #1

    Default add a button with a JSON.....

    Hi,

    I have a problem with this:

    1. i want to create a buttons from a JSON, so i have this:
    Code:
    var ob = Ext.decode(Ext.get('json_string').getValue()); //this is OK!
    alert('ob:'+ob); // ob:[object Object],[object Object],[object Object] to create 3 buttons
    			
    for (var i=0; i<objeto.length; i++){
      mytoolbar.add(ob[i]);
      mytoolbar.add('-');
    }//create succesfull 3 buttons in mytoolbar
    to create JSON ob i have this in PHP:
    [CODE]
    $buttons= array();
    $buttons[] = array(
    "cls"=>"x-btn-icon mod1",
    "id"=>"Modulo1",
    "title"=>utf8_encode("Modulo1ise

  2. #2

    Default

    Have you tried to remove this in "this.onItemToggle"?

  3. #3

    Default dont work

    Quote Originally Posted by liggett78 View Post
    Have you tried to remove this in "this.onItemToggle"?
    liggett78, dont work.

    i have this in my toolbar:
    Code:
    var MyToolbar = function() {
    var mytoolbar;
    return {
     init : function() {
       mytoolbar= new Ext.Toolbar('div_tb');
       //BUTTONS
       var ob = Ext.decode(Ext.get('json_string').getValue()); //this is OK!
       alert('ob:'+ob); // ob:[object Object],[object Object],[object Object] to create 3 buttons
    			
       for (var i=0; i<objeto.length; i++){
         mytoolbar.add(ob[i]);
         mytoolbar.add('-');
       }//create succesfull 3 buttons in mytoolbar
     }, //close init
    
     onItemToggle : function(item, pressed){
       if(pressed){
          alert('HELLO WORLD!!!');
       }
     }
    };
    }();
    Ext.onReady(MyToolbar.init, MyToolbar);

  4. #4

    Default

    Oh, I see, try MyToolbar.onItemToggle. Is MyToolbar a global variable?

    Otherwise try to take the onItemToggle function out of your singleton.

  5. #5

    Default i get nothing.....

    hi,

    so i have this:
    Code:
    var MyToolbar = function() {
    var mytoolbar;
    
    var onItemToggle = function(){
       alert('HELLO WORLD!!!!');
    };
    
    return {
     init : function() {
       ....
     } //close init
    };
    }();
    Ext.onReady(MyToolbar.init, MyToolbar);
    and my JSON in PHP:
    Code:
    ....
    "toggleHandler"=>"MyToolbar.onItemToggle",
    ....
    and nothing...

  6. #6

    Default

    No, now you declared your handler as private, because it's var inside the function.

    The problem with your code is that your function name comes as string. So Ext throws an error "Not a function", when it tries to handle the click:
    Code:
    this.toggleHandler.call(...)
    toggleHandler is a string and of course it can't be called. What I meant is try to declare toggleHandler as normal function outside MyToolbar, like this:
    Code:
    function onToggleItem(...) 
    {
       alert(...);
    }
    When you create your buttons, the browser (or its js engine) must be able to find the right function declaration and bind to it, that is the whole point.

    I just tried to do it, albeit without json or PHP, just onToggleItem declaration + your button array and other MyToolbar stuff and it did work.
    Code:
    <html>
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
    <title>Untitled Document</title>
    <link rel="stylesheet" type="text/css" href="ext/resources/css/ext-all.css" />
    </head>
    <body>
    
    <script type="text/javascript" src="ext/adapter/yui/yui-utilities.js"></script>
    <script type="text/javascript" src="ext/adapter/yui/ext-yui-adapter.js"></script>
    <script type="text/javascript" src="ext/ext-all.js"></script>
    <script type="text/javascript" src="ext/ext-all-debug.js"></script>
    <script type="text/javascript">
    
      function onItemToggle(item, pressed){
       if(pressed){
          alert('HELLO WORLD!!!');
       }
      }
    
    var json = [{"cls":"x-btn-icon mod1","id":"Modulo1","title":"Modulo1: Dise\u00f1o","url":"index.php?action=CmdDefaultMain_menutree","enableToggle":true,"toggleHandler":onItemToggle,"disabled":false,"toggleGroup":"modulos"},{"cls":"x-btn-icon mod2","id":"Modulo2","title":"Modulo2: Ficha T\u00e9cnica","url":"index.php?action=CmdDefaultMain_menutree","enableToggle":true,"toggleHandler":onItemToggle,"disabled":false,"toggleGroup":"modulos"},{"cls":"x-btn-icon mod3","id":"Modulo3","title":"Modulo3: Pedidos","url":"index.php?action=CmdDefaultMain_menutree","enableToggle":true,"toggleHandler":onItemToggle,"disabled":false,"toggleGroup":"modulos"}];
    
    
    var MyToolbar = function() {
    var mytoolbar;
    return {
     init : function() {
       mytoolbar= new Ext.Toolbar('div_tb');
    
       //var ob = Ext.decode(json); //this is OK!
    	var ob = json;
    
       for (var i=0; i<ob.length; i++){
         mytoolbar.add(ob[i]);
         mytoolbar.add('-');
       }//create succesfull 3 buttons in mytoolbar
     }
    
    
    };
    }();
    Ext.onReady(MyToolbar.init, MyToolbar);
    </script>
    <div id='div_tb'></div>
    </body>
    </html>
    So maybe it might work even if you somehow dynamically retrieve config object for the buttons.

  7. #7
    Sencha - Community Support Team jsakalos's Avatar
    Join Date
    Apr 2007
    Location
    Slovakia
    Posts
    27,664

    Default

    Look with FB what is the type of variable toggleHandler after you've created buttons. I guess it's string and should be function to work. Maybe you can try

    PHP Code:
    btn.toggleHandler = eval(btn.toggleHandler); 
    but this is just shot in the dark. The problem is that you deliver string in json, not function.

    BTW, what's rationale behind creating UI components on server?

    Hi,
    Jozef Sakalos, aka Saki

    Education, extensions and services for developers at new http://extjs.eu
    News: Grid MultiSearch Plugin, Grid MultiSort Plugin, Configuring ViewModel Hierarchy


Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •