1. #1
    Ext User
    Join Date
    Feb 2009
    Posts
    13
    Vote Rating
    0
    yusaku is on a distinguished road

      0  

    Question How can I use the variable for values option of Template.overwrite

    How can I use the variable for values option of Template.overwrite


    Hi!

    I can't use the variable for values option of Template.overwrite method.

    I could display without using the variable but I want to use the variable.

    Thanks for your help.

    Code:
    <html>
    <head>
    <meta http-equiv="content-type" content="text/html; charset=UTF-8">
    <meta http-equiv="content-style-type" content="text/css">
    <meta http-equiv="content-script-type" content="text/javascript">
    <title>Panel Test</title>
    <!-- CSS -->
    <link rel="stylesheet" type="text/css" href="../../../ext/resources/css/ext-all.css" />
    <!-- JS -->
    <script type="text/javascript" src="../../../ext/adapter/ext/ext-base.js"></script>
    <script type="text/javascript" src="../../../ext/ext-all-debug.js"></script>
    <style type="text/css">
    body {
        font-family: helvetica, tahoma, verdana, sans-serif;
        padding: 20px;
        padding-top: 32px;
        font-size: 13px;
        background-color: #fff !important;
    }
    .x-panel-mc {
        font-size: 12px;
        line-height: 18px;
    }
    </style>
    <script>
    Ext.onReady(function(){
        var ct = new Ext.Panel({
            renderTo: 'grid-example',
            frame: true,
            title:'Panel Test',
            width: 600,
            height: 100,
            layout: 'border',
            items: [
              {
                id: 'detailPanel',
                region: 'center',
                bodyStyle: {
                  background: '#ffffff',
                  padding: '7px'
                },
                html: 'Please select a book to see additional details.'
              }
            ]
        })
     
        // define a template to use for the detail view
        var bookTplMarkup = [
            'id: {id}<br/>',
            'name: {name}<br/>',
        ];
        var bookTpl = new Ext.Template(bookTplMarkup);
        var detailPanel = Ext.getCmp('detailPanel');
     
        //NG
        //var testStr = "{\"id\":\"1\",\"name\":\"taro\"}";
        //NG 
        //var testStr = '{"id":"1","name":"taro"}';
     
       //NG (I want to use this way)
       bookTpl.overwrite(detailPanel.body, testStr);
     
       //OK (But I want to use variable)
       //bookTpl.overwrite(detailPanel.body, {"id":"1","name":"taro"});
    });
    </script>
    </head>
    <body>
    <div id="grid-example"></div>
    </body>
    </html>

  2. #2
    Ext User
    Join Date
    Feb 2009
    Posts
    13
    Vote Rating
    0
    yusaku is on a distinguished road

      0  

    Default


    I got it! I found Ext.util.JSON.decode(). But to be honest, I'm not sure why..

    (bad)
    bookTpl.overwrite(detailPanel.body, testStr);

    (good)
    bookTpl.overwrite(detailPanel.body, Ext.util.JSON.decode(testStr));

    thank you.

  3. #3
    Sencha - Ext JS Dev Team Animal's Avatar
    Join Date
    Mar 2007
    Location
    Notts/Redwood City
    Posts
    30,502
    Vote Rating
    48
    Animal has a spectacular aura about Animal has a spectacular aura about

      0  

    Default


    Because a string isn't an object containing named properties, but in fact... a string?

  4. #4
    Ext User
    Join Date
    Feb 2009
    Posts
    13
    Vote Rating
    0
    yusaku is on a distinguished road

      0  

    Default


    Thank you for reply. I could understand I have to set an Object into the values option.

Thread Participants: 1