What Is ExtJS ExtJS 4+ Extensions Examples Tutorials

31Jul/140

shrinkWrap in ExtJS 4 and 5 Containers

ExtJS Containers and Panels are typically sized by their parent container's layout. Traveling up the layout chain typically leads to a Viewport, which occupies the available screen space; i.e. (view in Sencha Fiddle):

sample viewport

Now what about those times when you want to use these beautiful panels as the actual content, rather than as holders of other content? In other words, how can we make the Panels size based on their content (rather than as dictated by their parent's layout)? The end result might look something like this:

sample panel shrinkWrap

Read on to find out how its done and what caveats exist...

VN:F [1.9.22_1171]
Rating: 9.3/10 (6 votes cast)
18Apr/140

ExtJS5 vs ExtJS4 Config System

With ExtJS5 beta announced last week there were clear efforts on behalf of ExtJS 5 to behave closer to Sencha Touch in regards to utilizing the unique and powerful config system. Last year I wrote ExtJS vs. Touch Config System article to highlight some important differences. Today I'd like to explore this topic in the context of different versions of ExtJS 4 and ExtJS 5 beta.

ExtJS5 config

VN:F [1.9.22_1171]
Rating: 9.7/10 (3 votes cast)
9Apr/122

ExtJS4 Combo & ASP.NET MVC3

First see basic ExtJS4 & ASP.NET MVC3 setup tutorial

In this example I will demonstrate just how easy it is to implement a type-ahead dropdown that will ping the server over AJAX every time a user types something in, and show a list of results with rich markup. It's amazing just how easy it is to do this with ASP.NET MVC3 and ExtJS4 data stores.

The end result looks something like this:

VN:F [1.9.22_1171]
Rating: 7.5/10 (8 votes cast)
2Apr/120

ExtJS4 & ASP.NET MVC3 Dictionary

See my previous example on getting ExtJS4 working with ASP.NET MVC3

Back when I used to work with ASP.NET AJAX Extensions 1.0 (5 year old tech), I used to do the following all the time:

JavaScript

Ext.Ajax.request({
	url: ...
	, jsonData: { data: form.getForm().getValues() }
	...
}); // eo Ajax

ASP.NET AJAX Extensions 1.0

[WebMethod(EnableSession = true)]
public static void MyWebMethod( Dictionary<string,object> data )
{
	...
}

...ASP.NET AJAX Extensions 1.0 handled the conversion of data from JSON to C# Dictionary, which is a pleasure to work with. To my great disappointment, I discovered that ASP.NET MVC3, the latest and greatest, won't do that for you! I had to find a solution...

VN:F [1.9.22_1171]
Rating: 9.1/10 (7 votes cast)
20Mar/124

ASP.NET MVC3 & ExtJS4 Errors

In my previous post I presented an example of a basic ASP.NET MVC3 controller connecting to an ExtJS4 data store and passing some data in XML format via store's load method.

So far I've run into just one issue with this setup - clean error handling. By default, ASP.NET MVC will spit out any exceptions in clear text (with <html> tags and everything), which is not very useful when building a quality web application. Here's what I want on my errors:

VN:F [1.9.22_1171]
Rating: 9.4/10 (7 votes cast)
Page 2 of 41234