1. #1
    Ext JS Premium Member
    Join Date
    Jul 2008
    Posts
    15
    Vote Rating
    0
    courtneyt is on a distinguished road

      0  

    Question Air DateField (AIR runtime security violation for JavaScript code in sandbox)

    Air DateField (AIR runtime security violation for JavaScript code in sandbox)


    I am developing an Air application using ExtJS and have a datefield on a form. The form displays fine but when I click on the calendar dropdown I get the following error:

    Error: Adobe AIR runtime security violation for JavaScript code in the application security sandbox (Function constructor)

    I've read other posts that say to put the templates outside of the onReady() function but don't know how to do this. Here is a simple example of a form with a datefield. Can you send me an example of what I need to do to fix it. Like I've said, I don't understand the posts that are already in the forum.

    Here is the code:
    Code:
    <html>
    <head>
    <title>Test</title>
        <link rel="stylesheet" type="text/css" href="./ext-3.0.0/resources/css/ext-all.css" />
        <link rel="stylesheet" type="text/css" href="./ext-3.0.0/air/resources/ext-air.css" />
        <script type="text/javascript" src="./ext-3.0.0/air/AIRIntrospector.js"></script>
        <script type="text/javascript" src="./ext-3.0.0/air/AIRAliases.js"></script>
      <script type="text/javascript" src="./ext-3.0.0/adapter/ext/ext-base.js"></script>
        <script type="text/javascript" src="./ext-3.0.0/ext-all-debug.js"></script>
        <script type="text/javascript" src="./ext-3.0.0/air/ext-air-debug.js"></script>
        <script>
    Ext.BLANK_IMAGE_URL = './ext-3.0.0/resources/images/default/s.gif';
    Ext.ns('Application');
    Ext.onReady(function() {
        var form01 = new Ext.FormPanel({
      border: true,
      height: 500,
      width: 500,
      items: [new Ext.form.DateField({
          fieldLabel: 'Date',
          name: 'lastsyncdate',
          id: 'lastsyncdate',
          value: Ext.util.Format.date("Wed Jan 1 00:00:00 GMT-0600 1997",'m/d/Y') 
          })
        ],
            renderTo:'here'
        });
    
    });
    </script>
    </head>
    <body>
        <div id="here">
        </div>
    </body>
    </html>

  2. #2
    Ext JS Premium Member
    Join Date
    Jul 2008
    Posts
    15
    Vote Rating
    0
    courtneyt is on a distinguished road

      0  

    Default


    I tested the example using Ext 2.3.0 and it works fine. When I use Ext 3.0.0 or Ext 3.0.2 it does not work.

  3. #3
    Ext User
    Join Date
    Jan 2009
    Posts
    44
    Vote Rating
    0
    wmazza is on a distinguished road

      0  

    Default


    I don't recall ext-3.0.0 being bundled with and ext-air.js file...then again, I don't have my premium member account yet and I don't know if maybe it's bundled with the new 3.0.1 build?

    Anywho, basically AIR doesn't really allow most eval functions to run after the page header's have been loaded. This means many XTemplates, eval, string.format calls have to be "pre-rendered" (which is usually addressed by the ext-air file)

    So in summary, I would first check your ext-air file.

    If that doesn't work, I heard that you can also use the ext-2.3.0 ext-air.js file but I have not verified this since I put my AIR project on hold for the time being.

    EDIT: after some looking into this (because I remember having this issue with 2.3.0 and I just had to look for it :P), I found this thread:http://www.extjs.com/forum/showthread.php?t=79029

    Basically, just place this before your Ext.onReady

    Code:
    
    Date.createFormat('m/d/y');
    
    Let me/us know how this works!

  4. #4
    Ext JS Premium Member
    Join Date
    Jul 2008
    Posts
    15
    Vote Rating
    0
    courtneyt is on a distinguished road

      0  

    Default


    I changed the Ext libraries for ExtJS from ext-3.0.0 to ExtJS ext-2.3.0 and left the Air libraries at Ext-air-0.30. Using ext-3.0.0 and Ext-air-0.30 I get the error but using ext-2.3.0 and Ext-air-0.30 everything works.

  5. #5
    Ext JS Premium Member
    Join Date
    Jul 2008
    Posts
    15
    Vote Rating
    0
    courtneyt is on a distinguished road

      0  

    Default


    There stack trace of the error shows line 50170 right before the error on line 12226. It clearly shows that a template is involved. The datefield must use some type of menu layout to drop down the date picker. Has anyone come up with a solution to this problem. Is there a way to put the template for this before the onready function like we do with combo boxes?

    Code:
        renderItem : function(c, position, target){
            if (!this.itemTpl) {
                this.itemTpl = Ext.layout.MenuLayout.prototype.itemTpl = new Ext.XTemplate(
                    '<li id="{itemId}" class="{itemCls}">',
                        '<tpl if="needsIcon">',
                            '<img src="{icon}" class="{iconCls}"/>',
                        '</tpl>',
                    '</li>'
                );
            }

  6. #6
    Ext JS Premium Member
    Join Date
    Jul 2008
    Posts
    15
    Vote Rating
    0
    courtneyt is on a distinguished road

      0  

    Smile


    The datefield and menu items use XTemplates, so these too must be pre-compiled.


    Place the following code before the onReady to fix the problem.

    Code:
    Ext.layout.MenuLayout.itemTpl=Ext.layout.MenuLayout.prototype.itemTpl=new Ext.XTemplate
    (
        '<li id="{itemId}" class="{itemCls}">',
            '<tpl if="needsIcon">',
                '<img src="{icon}" class="{iconCls}">',
            '</tpl>',
        '</li>'
    );

  7. #7
    Sencha User
    Join Date
    Dec 2008
    Posts
    105
    Vote Rating
    0
    piroman is on a distinguished road

      0  

    Thumbs up


    if u want to use xtemplates in adobe air u just create a js file that includes all templates that u want

    for example

    Code:
    MyApp.Templates = {
        timeField: new Ext.XTemplate('<tpl for="."><div class="x-combo-list-item">{text}</div></tpl>')
    }
    this file needs to be included in ur main html and u can safe use it into ur application that starts in domready event

  8. #8
    Sencha - Senior Forum Manager mitchellsimoens's Avatar
    Join Date
    Mar 2007
    Location
    Gainesville, FL
    Posts
    37,395
    Vote Rating
    849
    mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute

      0  

    Default


    In the new air-3.1.0, the datefield displays correctly but the timefield does not.