Extjs 4.1 beta release

ArticleDirectory

• Layout

Http://www.sencha.com/forum/showthread.php? 164313-ext-js-4.1-beta-1-now-available

We are very happy thatCommunityRelease ext js4.1.0 Beta 1! This version has fixed hundreds of errors. As the first test version, there are several issues that we want to solve, but we finally decided that they are not a key issue, enough to delay the release of the new version. These are known issues recorded in the release notes.

You can download extjs 4.1 beta: http://cdn.sencha.io/ext-4.1.0-beta-1.zip here

I want to spend some time talking about the changed content. Some of them are newer than 4.1 PR1, while others are introduced but not involved in 4.1 PR1.

ForOther details,PleaseSeeMy blog posts: Http://www.sencha.com/blog/whats-new-in-ext-js-4-1)

Layout failed

4.1 of the layout engine design may cause layout operation failure to complete all its calculations due to improper configuration or errors. In this case, the layout will simply stop and some results will be refreshed to the Dom. In some cases, only 99% of calculations are completed, resulting in undiscovered errors or slight visual exceptions. In other cases, failure may occur too early, resulting in a broken UI (like the yieldjs error generated during layout in previous versions ).

(Note: This is a serious problem)

Diagnosis

If you suspect that the layout fails, the first step is to diagnose the layout. To do this, replace ext-all-dev.js with ext-all.js and add two additional script files,CodeAs follows:

<SCRIPT type = "text/JavaScript" src = "/extjs41/ext-all-dev.js"> </SCRIPT> <br/> <SCRIPT type = "text/JavaScript" src = "/extjs41 /src/diag/layout/context. JS "> </SCRIPT> <br/> <SCRIPT type =" text/JavaScript "src ="/extjs41/src/diag/layout/contextitem. JS "> </SCRIPT>

Obviously, the path of extjs 4.1 varies depending on your environment. You can see the diagnostic log in the firebug or Web Inspector console. For IE, logs are stored in the memory. After loading the page, enter the following command in the address to display the logs:

Javascript: void (ext. log. Show ())
This allows you to create a "bookmarks ". The log is limited to 750 lines. You can modify it according to the following code:

<SCRIPT type = "text/JavaScript" src = "/extjs41/ext-all-dev.js"> </SCRIPT> <br/> <SCRIPT type = "text/JavaScript"> <br/> ext. log. max = 1500; <br/> </SCRIPT>

Model and idproperty

A common configuration error of the model means that no appropriate "idproperty" is specified ". This attribute is used to identify the primary key of the model, but it is easy to forget. Because the default value of "idproperty" is "ID ". In 4.0, if the model does not have fields with the same name, JS errors may occur in some cases. This error was fixed in 4.1. If this field is not defined, the field is automatically defined as a string attribute.

The repair of this error also produces another problem. You will find that the model has an additional "ID" attribute. The best solution is to correctly configure the value of the "idproperty" attribute.

Fields and their layout

In extjs 4.1 PR1 and now Beta 1, the field and field layout have been modified internally several times. Before proceeding, I will first introduce several new configuration items related to field rendering. We discussed with several customers that the Field Rendering logic needs to be replaced (such as "rendertpl", "fieldsubtpl", or "labelablerendertpl") to achieve basic adjustments in their applications. During this period, since 4.0, these attributes have been overwritten and modified several times internally. We want to provide a more stable way to add fields instead of continuing this cycle.

In Beta 1, we added several "micro" rendering templates to decorate fields. Generally, these are simple tag strings, but they fully support xtemplates. These decorations are as follows:

Fields: inputattrtpl
Labelable: beforelabeltpl, afterlabeltpl, beforesubtpl, aftersubtpl, beforelabeltexttpl, afterlabeltexttpl and labelattrtpl
Checkbox: beforeboxlabeltpl, afterboxlabeltpl, beforeboxlabeltexttpl, afterboxlabeltexttpl, boxlabelattrtpl
Htmleditor: beforetextareatpl, aftertextareatpl, beforeiframetpl, afteriframetpl, iframeattrtpl

The examples at/examples/form/dynamic.html and/examples/form/contact-form.html demonstrate how to use "afterlabeltexttpl" to render a simple "mandatory field ". Their role in rendering can be seen from the name. For more information, see fieldsubtpl or labelablerender. If you need other useful decorations, please let us know.

In 4.0 and 4.1 PR1, the positioning, floating, and dimensional balancing of field la s and the subtle timing dependencies are quite complex. In Beta 1, the Field Layout has been extensively modified. A table is used to support IE6. This has always had some computing requirements, such as the height. This method eliminates a large number of calculations and measurements previously performed in each field, which quickly increases the speed.

Panel collapse

In 4.1 PR1, the Panel folding is completely uniform. In 4.0, the Panel is folded according to different situations. For example, in accordion or border la s, these la s make the folding process extremely complex. These changes apply to most applicationsProgramIt has little impact, but it is important for animation or custom folding attributes.

Masking

Masking is currently only used for shared modal windows. Non-floating or non-modal components now need to create their own masks. When Ext. loadmask is used in an element, we recommend that you use the mask and unmask methods of Ext. Dom. element. This method can be used all the time.

Masking management has been improved when components are adjusted and hidden.

Drag and Drop

In 4.1 beta 1, dragdropmanager now queries the Z-index to identify the top-level drag target. This can solve the overlapping problem of multiple drag targets, but this will affect the processing of custom drag and drop.

Neptune

There are many questions about Neptune topic preview in the blog. Here I want to clarify that Neptune in extjs 4.1 only supports modern browsers (non-ie ). If you need to support IE, Neptune is not a proper choice.

Summary

We want to hear any questions about your use of Beta. At this point, we really need to hear about compatibility issues. Our goal is to provide backward compatibility with 4.0 as much as possible.

Remember that when a problem or error is published, a test effort will always help speed up this process. See http://www.sencha.com/forum/showthread.php? 138165-how-to-report-a-bug