Friday, 16 February 2018

Sencha ExtJS how to select Grid First row

In ExtJs Grid we can select the first row when the grid is loaded.

Sencha Extjs grid. we can do it  as store load callback like this.

Now am getting the grid from my view.

  var myGridstore = this.getViewModel().getStore('myStore');
     var myGrid = this.getView().down('grid');
                    callback: function(records, operation, success, response) {
                    //Grid row index start from Zero.

Thursday, 15 February 2018

Sencha Extjs What is the use of Ext.beforeLoad in index.html

In Extjs we have  Ext.beforeLoad  method in sencha cmd generated file index.html.

We have to know what is the purpose of Ext.beforeLoad.

This function is called by the Microloader after it has performed basic device detection. The results are provides in the tags object are.

android: 0

androidstock: 11

bada: 0

blackberry: 0

chrome: 0

chromeios: 0

chromemobile: 0

chromeos: 0

cordova: false

desktop: true

dolfin: 0

edge: 0

firefox: 0

ie: 0

ie8: 0

ie8m: 0

ie8p: 0

ie9: 0

ie9m: 0

ie9p: 0

ie10: 0

ie10m: 0

ie10p: 0

ie11: 0

ie11m: 0

ie11p: 0

ie12: 0

ie12m: 0

ie12p: 0

ios: 0

ipad: 0

iphone: 0

ipod: 0

linux: 0

mac: true

opera: 0

phone: false

phonegap: false

rimtablet: 0

safari: 11

silk: 0

tablet: false

tizen: 0

touch: undefined

webos: 0

webosbrowser: 0

webview: false

windows: 0

windowsphone: 0

         use these tags here or even add custom tags. These can be used by platform
        filters in your manifest or by platformConfig expressions in your app.

Ext.beforeLoad = function (tags) {
            var s =,
            if (s.match(/\bclassic\b/)) {
                profile = 'classic';
            else if (s.match(/\bmodern\b/)) {
                profile = 'modern';
            else {
                profile = tags.desktop ? 'classic' : 'modern';
                //profile = ? 'modern' : 'classic';

            Ext.manifest = profile;


Tuesday, 13 February 2018

Sencha Extjs how to find deviceType

This is very useful while working on responsive applications, some places we need to know the what is DeviceType and operating system like that.

Extjs came with os singleton class  Ext.os

Provides information about the current operating system environment.

Like below:

    1. deviceType
    2. name:"Android"
    3. version:Version
      1. build:0
      2. major:5
      3. minor:0
      4. pad:0
      5. patch:0
      6. releaseValue:0
      7. shortVersion:"50"
      8. version:"5.0"

Sencha Extjs How to make textfield as password field

Today am going to tell basic thing how to make textfield like as a password field.

We have predefind component for modern but not for classic  so we have to make with inputType config.

writing at the time of field declaration. using inputType config.

        xtype: 'textfield',
        name: 'password',
        msgTarget: 'under',
        allowBlank: false,
        labelSeparator: '',
        fieldLabel: 'Password',
        maxLength: 16,
        enforceMaxLength: true,
        reference: 'password',
        inputType: 'password'

Monday, 22 January 2018

ngHyderabad February Chapter

Saturday, February 3, 2018

ngHyderabad February Chapter


NativeScript Angular by Shiva Prasad, an Angular evangelist and Native Script contributor.

Writing cross-platform mobile apps is not as easy as it may seem. On one hand, it can save money to use a JavaScript-based cross-platform mobile framework. But on the other hand, we'd like to be able to give app users the speed and elegance of a native app.

NativeScript is one such cross platform framework which let's us have the best of both worlds. The UI will be converted to truly native mobile UI, on Android and iOS, while still letting us seamlessly access native API using JavaScript / TypeScript. NativeScript provides day 0 access to 100% of the NativeAPI. What's more, you can even do code sharing between your Web and Mobile application.

Join us as we'll uncover more of the awesomeness of NativeScript.

More about the presenter here

Talk 2 - Boost Angular Application Performance by Pankaj Parkar. Discuss considerations and best practices for better performing Angular applications. Pankaj is one of the top contributor on Stack Overflow. Currently, he is top 5th user for AngularJS and top 10th user Angular 2+ tags on Stackoverflow. He is a Microsoft MVP and a tech enthusiast.

Saturday, February 3, 2018
11:00 AM
 to 3:00 PM

3rd Floor, Apurupa Silpi, Beside H.P. Petrol Bunk, KFC Building, Rajiv Gandhi Nagar, Gachibowli, Hyderabad, Telangana · Hyderabad.

Friday, 19 January 2018

Facebook's India Innovation Hub

Hi everyone, join us on 23rd February for the launch of Facebook's India Innovation Hub Accelerator Program, in collaboration with T-Hub. Stay tuned for more amazing work happening in AR/VR space. 

Register here:

Tuesday, 16 January 2018

What is Vue.js


Today we are going to learn New JavaScript framework as Vue.js.

What is Vue.js?

Vue (pronounced /vjuː/, like view) is a progressive framework for building user interfaces. Unlike other monolithic frameworks, Vue is designed from the ground up to be incrementally adoptable. The core library is focused on the view layer only, and is easy to pick up and integrate with other libraries or existing projects. On the other hand, Vue is also perfectly capable of powering sophisticated Single-Page Applications when used in combination with modern tooling and supporting libraries.
If you’d like to learn more about Vue before diving in, we created a video walking through the core principles and a sample project.
If you are an experienced frontend developer and want to know how Vue compares to other libraries/frameworks, check out the Comparison with Other Frameworks.

Vue.js is an MIT licensed open source project and completely free to use. However, the amount of effort needed to maintain and develop new features.

Source from Vue

Show Hide Password field using Extjs


Today,  I would like to write a small example of How to show or hide the password filed using Sencha Extjs.

It is very simple just we have to write make the input type changes like a password to text or text to the password.



Ext.create('Ext.form.Panel', {

    items: {
        xtype: 'fieldcontainer',
        width: '100%',
        layout: {
            type: 'hbox'
        items: [{
            width: '90%',
            xtype: 'textfield',
            name: 'password',
            msgTarget: 'under',
            allowBlank: false,
            fieldLabel: 'Password' + '<span style="color:red">*</span>',
            inputType: 'password'
        }, {
            xtype: 'button',
            iconCls: 'fa fa-eye',
            tooltip: 'Show password',
            handler: function (button) {
                var isShowPassword = this.iconCls==='fa fa-eye';
                this.setTooltip(isShowPassword?'Hide password':'Show password');
                this.setIconCls(isShowPassword?'fa fa-eye-slash':'fa fa-eye');
                this.prev().getEl().query('input', false)[0].set({'type':isShowPassword?'text':'password'})

renderTo: Ext.getBody()


Wednesday, 20 December 2017

Angular 5 has been released

Angular 5 has been released

Angular 5 has been released
Angular 5 was finally released after several delays, November 1, 2017. It was also accompanied by Angular CLI 1.5. This is a major release and in line with Angular team promise of major releases twice a year. It focusses on making Angular application smaller, faster and easier to use.

Monday, 11 December 2017

React 101


Women Techmaker, Hyderabad and GDG Hyderabad is collaborating for the 1st time with THub and Coderplex community to provide a platform for all the developers in Hyderabad to learn, share and network. This platform is for developers who are interested in Google's developer technology; everything from the Android, Chrome, Drive, and Google Cloud platforms, to product APIs like the Cast API, Maps API, and YouTube API.

About this event :

This event is primarily on React Js. React is a front-end library used for handling the view layer for web and mobile apps. ReactJS allows us to create reusable UI components. It is currently one of the most popular JavaScript libraries.

Session will be followed by showcasing some of the work the community members have done this year.

Who is eligible for this event:

This event is open to all but a confirmation we will sent to the selected members. Even thought it doesn't use HTML we still recommend basic understanding of Javascript, HTML5, CSS3. Knowledge of these will make this session more useful to you.

Monday, 6 November 2017

Join Us Virtually at CodeRage XII - November 7-9

Join Us at CodeRage XII
Join us at Embarcadero’s 12th annual virtual developer conference, CodeRage XII, November 7-9 from 6am - 5pm CST. This completely free, three day conference is your source for the latest on development tools and technical deep dives, best practices from industry thought leaders, emerging technologies and platforms. 
Our very own Sandeep Adwankar, Product Manager at Sencha, will lead an Introduction to Sencha Products session, focusing on Ext JS, Tools, Test, ExtReact and GXT on Wednesday, November 8th at 12:00pm CST. Additionally, Marco Cantu, author of the Mastering Delphi series, will lead an Introduction to Ext JS for Delphi Developers session on Tuesday, November 7th at 11:00am CST.
We hope you will join Sandeep and Marco to learn more about Sencha! If you're interested in learning more about Embarcadero's RAD Studio products, you can see the full list of sessions here. Here's a few other notable standouts speaking at CodeRage XII we thought you might find interesting: 
  • Robert C. "Uncle Bob" Martin, author of Clean Code: A Handbook of Agile Software Craftsmanship, is speaking on, "The Clean Coder - An Introduction to Software Professionalism"
  • Steven McConnell, author of "Code Complete", is speaking on "Managing Technical Debt"
  • Ray Konopka, author of "Developing Custom Delphi Components", shares his "IDE Productivity Tips & Tricks"
  • Cary Jensen, author of "Delphi in Depth: FireDAC", speaks on "FireDAC in Depth: Creating and Using Indexes"
We hope you'll join us virtually this week  register for free today to save your seat!
  The Sencha Team

Join Us at CodeRage XII November 7-9, 2017

This webinar meets 3 times.
  1. Wed, Nov 8, 2017 5:30 PM - Thu, Nov 9, 2017 5:30 AM IST
  2. Thu, Nov 9, 2017 5:30 PM - Fri, Nov 10, 2017 5:30 AM IST

It is time for your favorite online developer conference: CodeRage. This year for CodeRage XII we are adding more platforms, more technology, and more learning. Join us for 3 full days November 7th through 9th. This email is for room 1. You will be automatically registered for Room 2 as well. To join it, use this link: (You only need to register for once and you are registered for everything!) More information: Less

Thursday, 2 November 2017

Install Android Studio

Step by step to Install Android Studio.

To Install Android Studion on your Mac as below.

1. Launch the Android Studio DMG file.
2. Drag and drop Android Studio into the Application folder then click on the Android Studio.

3. Select Whether you want to import previous Andriod studio settings, then click on Ok.
4. Click on next to install.

5. Choose the type of setup you want to install.

6. Following are the steps to complete the installation.


Tuesday, 24 October 2017

Building Search Engine Friendly applications using Angular Universal

Building Search Engine Friendly applications using Angular Universal

  • InnoMinds - Kondapur

    Kala Jyothi Building, Survey 185, Masjid Banda, Kondapur, Hyderabad(map)
  • We are hosting a meetup session on building SEO friendly applications using Angular Universal at Innominds. Though front-end applications provide rich and interactive UI to our clients, the content presented on these sites is hard to read for most of the search engines. It is hard to share these sites on social media, as they don't generate good previews. To solve these problems, Angular team added the support to render the applications built using Angular from a server.
    This session will cover the following topics:
    1. Introduction
    2. Front-end applications and Search engines
    3. What is Angular Universal?
    4. Setting up Angular Universal with Angular CLI
    5. Adding Angular Universal to an application with multiple routes

    About Innominds
    Innominds provides product engineering services and digital solutions and is a Top 50 Best Companies to Work for in IT/ ITES in 2016. Innominds has a UI practice that provides consulting, design, engineering, implementation and support services on several UI technologies including AngularJS1, Angular, React and Vue. 
    Rabi Kiran (Ravi) – UI developer, working as Principal Engineer at Innominds and organizes the ngHyderabad meetup