Sencha Blog

top video

Is it possible to use the browser's native scrolling behavior, in certain areas of a ST app?

For example, I have a div with "overflow-x: scroll", and overflowing contents. On a mobile device, you can scroll it, with or without Sencha Touch loaded.

But as soon as you call Ext.setup, it does something to prevent this. Is there any way to restore the native scrolling to that div?

(I don't think I can use Sencha's scrolling, because I want the div's contents to determine its height. See my other question about that.)

I'm using Android 4.4 with Chrome, and ST 2.3.1. Sample page:

Code:


<head>
  [ Sencha Touch JS/CSS ]
  <script type="text/javascript">
    Ext.setup({});
  </head>
<body>

<pre class="foo" style="overflow-x: scroll">
  this is a test this is a test this is a test this is a test this is a test this is a test this is a test this is a test
  this is a test this is a test this is a test this is a test this is a test this is a test this is a test this is a test
  this is a test this is a test this is a test this is a test this is a test this is a test this is a test this is a test
  this is a test this is a test this is a test this is a test this is a test this is a test this is a test this is a test
</pre>

Using native browser scrolling

top video

Is it possible to make a container scroll horizontally, but have its height defined by its contents, rather than having a specific height, or having its height defined by its container?

For example, something like:

Code:


{
    xtype: 'container'
    layout: 'hbox',
    scrollable: 'vertical',
    items: [{
        html: 'some text'
    }, {
        xtype: 'container',
        scrollable: 'horizontal', 
        html: 'some longer text, which may wrap into multiple lines, '
            + 'and its height can't be predicted'
    }, {
        html: 'some text'
    }]
}

In this example, I only want the middle element to scroll horizontally. But I want its contents to determine its height.

Horizontal scroll with auto height?

top video

Hi, I have a problem with a facebook like button.

In the facebook developer, facebook give us 3 differents methods to integrate the like button in our app. In this example I use all the 3 methods.

I have created 3 buttons in sencha architect touch (Ext.Button). After I have created a basic function where I pass to the HTML buttons config the 3 methods

Code:


var me = this,
    htmlStrBase,
    htmlStr,
    htmlStrBase1,
    htmlStr1,
    htmlStrBase2,
    htmlStr2;

htmlStrBase = '<div class="fb-like" data-href="http://ift.tt/1tsyVFJ" data-layout="button" data-action="like" data-show-faces="false" data-share="false"></div>';
htmlStrBase1 = '<iframe src="//www.facebook.com/plugins/like.php?href=https://www.facebook.com/tecnitalia?ref=ts&fref=ts&amp;width&amp;layout=button&amp;action=like&amp;show_faces=false&amp;share=false&amp;height=35&amp;appId=838403862859130" scrolling="no" frameborder="0" style="border:none; overflow:hidden; height:35px;" allowTransparency="true"></iframe>';
htmlStrBase2 = '<html xmlns:fb="http://ogp.me/ns/fb#"><fb:like href="http://ift.tt/1tsyVFJ" layout="button" action="like" show_faces="false" share="false"></fb:like>';

me.getLikebutton().setHtml(htmlStrBase);
me.getLikebutton1().setHtml(htmlStrBase1);
me.getLikebutton2().setHtml(htmlStrBase2);

naturally first I have launched the FB.Init (for the desktop and for the App):

Code:


if(Ext.os.is.Android || Ext.os.is.iOS) {

    FB.init({
        appId      : 'xxxxxxxxxxxxx',
        status     : true,
        nativeInterface: CDV.FB,
        useCachedDialog: false,
        xfbml      : true
    });

    //alert('dopo FB.init');
    FB.Event.subscribe('auth.statusChange', function(response) {
        //alert('status changed');
    });

(function(d, s, id) {
  var js, fjs = d.getElementsByTagName(s)[0];
  if (d.getElementById(id)) return;
  js = d.createElement(s); js.id = id;
  js.src = "//connect.facebook.net/it_IT/sdk.js#xfbml=1&appId=XXXXXXXXX&version=v2.0";
  fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));

}
//Otherwise let's use the the web version
else
    {
        //Wait for sdk to load
        //alert('eseguo fbAsyncInit');
        window.fbAsyncInit = function() {

            FB.init({
                appId      : 'XXXXXXXXXX',
                status     : true,
                xfbml      : true
            });

            FB.Event.subscribe('auth.statusChange', function(response) {
                //alert('status changed');
            });
        };

        //alert(' after fbAsyncInit e now include SDK');
        //Include SDK

        (function(d, s, id){
            var js, fjs = d.getElementsByTagName(s)[0];
            if (d.getElementById(id)) {return;}
            js = d.createElement(s); js.id = id;
            js.src = "//connect.facebook.net/en_US/all.js";
            fjs.parentNode.insertBefore(js, fjs);
        }(document, 'script', 'facebook-jssdk'));
    }

the final result is that on the desktop, it functions perfectly but on my android App not yet...I Don't see any like button.

I say you last thing....if I copy one of this 3 methods directly in the html button config I can see the like button on my App. But I cannot copy directly this methods in the HTML config button because I need to change the facebook address each time a user logged in my App.

Somebody can help me and knows a method to integrate in my app the like button dinamically?

thank you

Carlo

Facebook like button

top video

I have a problem with my combobox. Combobox load when i open my form panel and he get a query send by database. But when i click a trigger icon, he do the same query. I would to disable the query when i click a trigger icon.

My combobox code:

HTML Code:


xtype: 'combobox',
fieldLabel: 'Operation',
id: 'combotypeoperation',
store: 'TypeOperations',
queryMode: 'remote',
displayField: 'libelle',
editable: false,
valueField: 'idTypeOperation',
listConfig: {
         loadMask: false
},
listeners: {
         render: function() {
                 this.store.load();
        }
}

TypeOperations store code:

HTML Code:


Ext.define(
        'SecureDT.store.TypeOperations',
        {
              extend: 'Ext.data.Store',
              requires: [
                'SecureDT.model.TypeOperation'
              ],
              model: 'SecureDT.model.TypeOperation',
            
              proxy: {
                       type: 'ajax',
                       timeout: 120000,
                      url: 'secureDT/typeOperation/findAll.json',
                      reader: {
                            type: 'json',
                            root: 'data'
                     }
             },
             listeners: {
                load: function() {
                    var combo = Ext.getCmp('combotypeoperation');
                    var recordSelected = combo.getStore().getAt(0).get('idTypeOperation');
                    combo.setValue(recordSelected);
                }
            }
        }
);

Extjs Combobox remote query double loading

top video

[unable to retrieve full-text content]When trying to add an empty route in controller (right click on Ext.app.Route url config and select Set to empty string) will result in adding just a...

Add empty route not working

top video

Thank you for reporting this bug. We will make it our priority to review this report.

Sencha User

Join Date

Oct 2014

Posts

1

Vote Rating

0

Display a list below the list item on Itemtap

top video

Hello,

we are a small Startup(only 1 developer) and would like to use ExtJS for our world changing project. Are you flexible enough to offer startups like we are a single developer license, since we really cannot afford to pay $3000+ for a 5 developer licence, that we also dont need until our product shows some traction...

Have a nice day,

Mike

Licenses for a Startup

samedi 1 novembre 2014