21⟩ Explain Ext JS UI elements?
The heart of the Ext JS framework is the multitude of rich UI elements provided. These elements include forms, dialog boxes, tabs, trees, and grids.
Ext JS
Home Client Side Scripting Ext JS
“Ext JS frequently Asked Questions in various Ext-JS job Interviews by interviewer. The set of questions here ensures that you offer a perfect answer posed to you. So get preparation for your new job hunting”
65 Ext JS Questions And Answers
22⟩ Explain how to access Dom element using EXTJS?
The Element API is fundamental to the entire Ext library.
Using traditional Javascript, selecting a DOM node by ID is done like this:
var myDiv = document.getElementById('myDiv');
Using Extjs:
Ext.onReady(function() {
var myDiv = Ext.get('myDiv');
});
23⟩ Tell me do you have any advice for developers using Ext for the first time?
Ext can be used by Web Application developers who are familiar with HTML but may have little or no experience with JavaScript application development. If you are starting to build a new web application, or you are revamping an existing application, then take your time to understand the basics of the library including.
24⟩ Explain Extjs Ajax implementation?
A typical Ext JS Ajax implementation: an HTML text field and button element that posts data in the text field to a Web server when the button is clicked.
25⟩ Explain integration of Web development server-side frameworks with Ext JS?
You can use Ext JS with other common Web development server-side frameworks, including PHP, the Java™ language, Microsoft® .NET, Ruby on Rails, and ColdFusion.
26⟩ Explain where Extjs extended from?
Ext JS as a project to extend the functionality that the YUI Library.A key aspect of the YUI Library is the cross-browser support.The Extjs framework is fully object oriented and extensible. Because it's written in the JavaScript language.
27⟩ Explain what is syntax for Extjs Button click event?
Ext.onReady(function() {
Ext.get('myButton').on('click', function(){
alert("You clicked the button");
});
});
28⟩ Tell me what is the purpose of Element Object in Extjs?
->Element wraps most of the DOM methods and properties that you'll need, providing a convenient, unified, cross-browser DOM interface (and you can still get direct access to the underlying DOM node when you need it via Element.dom)
->The Element.get() method provides internal caching, so multiple calls to retrieve the same object are incredibly fast
->The most common actions performed on DOM nodes are built into direct, cross-browser Element methods (add/remove CSS classes, add/remove event handlers, positioning, sizing, animation, drag/drop, etc.)
29⟩ Explain what is use of Ext.onReady() function?
Ext.onReady is probably the first method that you’ll use on every page. This method is automatically called once the DOM is fully loaded, guaranteeing that any page elements that you may want to reference will be available when the script runs
syntax:
Ext.onReady(function() {
alert(“Congratulations! You have Ext configured correctly!”);
});
30⟩ Suppose to show our message when any paragraph in our test page is clicked, what is the extjs code on paragraph click?
Ext.onReady(function() {
Ext.select('p').on('click', function() {
alert("You clicked a paragraph");
});
});
or
Ext.onReady(function() {
var paragraphClicked = function() {
alert("You clicked a paragraph");
}
Ext.select('p').on('click', paragraphClicked);
});
31⟩ What is a widget?
A widget is a tiny piece or component of functionality.
32⟩ Tell me what is method to Update the message box body text for MessageBox?
updateText( [String text] ) : Ext.MessageBox
33⟩ Please write syntax for MessageBox show() method?
Ext.MessageBox.show({
title: 'Paragraph Clicked',
msg: 'User clicked on Paragraph',
width:400,
buttons: Ext.MessageBox.OK,
animEl: paragraph
});
34⟩ Do you know what is purpose of MessageBox?
MessageBox is asynchronous.
MessageBox call, which demonstrates the readable message to user.
MessageBox used for multiple purpose like
Ext.Msg.alert()
Ext.Msg.prompt()
Ext.Msg.show({});
Ext.Msg.wait();
35⟩ Explain the css file required to apply Extjs Theme property?
xtheme-gray.css
ext-all.css
36⟩ Explain the extjs library files to include in JSP page?
ext-base.js
ext-all-debug.js or ext-all.js
ext-all.css
base.css or examples.css
37⟩ Tell me what is parent class for all stores in extjs? how many stores exists?
Ext.data.Store is parent class for all stores.
A Store object uses its configured implementation of DataProxy to access a data object unless you call loadData directly and pass in your data.
subclasses for Store:
GroupingStore, JsonStore, SimpleStore
38⟩ Explain how to handle exception while loading datastore?
using loadexception event.
syntax: store.loadexception() : Fires if an exception occurs in the Proxy during loading.
use beforeload : ( Store this, Object options ) : Fires before a request is made for a new data object. If the beforeload handler returns false the load action will be canceled.
syntax:
store.on('loadexception', function(event, options, response, error) {
alert("Handling the error");
event.stopEvent();
});
39⟩ Explain how to handle updates for store changes?
use store.commitChanges()
40⟩ Tell me how to handle event for a extjs component?
a. using listeners config object.
For ex for grid events : listeners: {rowclick: gridRowClickHandler,rowdblclick: gridRowDoubleClickHandler}
b. using addListener( String eventName, Function handler, [Object scope], [Object options] ) : void
Appends an event handler to this component
c. using on( String eventName, Function handler, [Object scope], [Object options] ) : void
Appends an event handler to this element (shorthand for addListener)
For ex: store.on( "datachanged", function( store ){ ..... });
