Ah, good idea, I didn't even consider that. If you don't mind, I think I'll add that in.Originally Posted by devnull
Ah, good idea, I didn't even consider that. If you don't mind, I think I'll add that in.
Have at it
If you can think of a better way to implement it than my quick hack, more power to ya!
Here is what I added:
This way, it allows you to still force a reset manually (as opposed to a form reset) by passing 'true', if the 'disableReset' option is set.Code:/** * Resets the current field value to the originally-loaded value * @param {Boolean} force Force a reset even if the option disableReset is true */ reset : function(force){ if(!this.disableReset || force === true){ this.setRawValue(this.originalValue); } },
Like so:
Code:miscfield.reset(true);
A small question.
Hello Nullity, just taking a look at your extension and have a question about the setSize method.
In this there is a minor error (gives a Javascript warning) in that the input parameter "h" is redeclared as "variable h" at the end. I assume that either the "var" part could be removed, or it could be changed to "var h2" and still have the same effect.PHP Code:/**
* Sets the height and width of the field
* @param {Number} width The new field width in pixels
* @param {Number} height The new field height in pixels
*/
setSize : function(w, h){
if(!this.rendered || !this.el){
this.width = w;
this.height = h;
return;
}
if(w){
this.el.setWidth(w);
}
if(h){
this.el.setHeight(h);
}
var h = this.el.dom.offsetHeight; // force browser recalc
},
Can you expand a bit on what the comment for this line means? I assume that just having the line causes the browser (all of them, or is this browser specific?) to recalculate the height?
Thanks,
Max
That 'setSize' method was actually ripped straight from Field.js from Ext 1.0. I just updated the first post with totally refactored code based off of Ext 1.1.1, so this should no longer be a problem.
1.1.1 update
I've tried out the new version, seems to work fine for me.
In one case, I have labels aligned at the top and I'm using this code to create a MiscField:
The additional CSS is:PHP Code:f.column(
{width: 54, labelSeparator: ""},
new Ext.form.MiscField(
{
fieldLabel: " ",
value: "From:",
id: "t-date-from-title",
cls: "x-form-miscfield-text",
width: 50
}
)
);
This column is followed by another column that contains a standard ComboBox.PHP Code:.x-form-miscfield-text {
padding: 3px 0;
}
With the simple CSS I've given above the "From:" text lines up vertically with the ComboBox text in Fx2, but is 1px too high in IE.
Has anyone got their head round making the alignment perfect in both IE and Fx?
Admittedly, the difference is very hard to spot (jpg attached of IE7 screen capture) and I'm happy to let it stay as it is, but if anyone has a better solution that would be even better.
Thanks,
Max
Hi Nullity,
Does your extension be compatible with Ext 2.0 ?
I have the following source that give me the error :
this.el has no properties
http://localhost/conference/js/ext/ext-all.js
Line 58
Best regardsCode:<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>Untitled Document</title> <!-- GC --> <!-- LIBS --> <link rel="stylesheet" type="text/css" href="../js/ext/resources/css/ext-all.css"/> <script type="text/javascript" src="../js/ext/adapter/ext/ext-base.js"></script> <script type="text/javascript" src="../js/ext/ext-all.js"></script> <script type="text/javascript" src="../js/ext-extension/MiscField.js"></script> <link rel="stylesheet" type="text/css" href="../js/ext-extension/MiscField.css"/> <!-- ENDLIBS --> <script type="text/javascript"> Ext.onReady(init); function init() { var myForm = new Ext.FormPanel({ url:'save-form.php', frame:true, title: 'Simple Form', bodyStyle:'padding:5px 5px 0; ', width: 600, height : 500, defaultType: 'textfield', collapsible : true, waitMsgTarget: true }); myForm.add(new Ext.form.TextField({ name : 'first' ,fieldLabel : 'Firstname' ,labelSeparator : '' ,id : 'first' ,width : 150 })); myForm.add(new Ext.form.MiscField({ fieldLabel: 'MiscField', id : 'fieldLabel', value: 'Test value' })); myForm.render(Ext.get('myElem')); } </script> </head> <body> <div id="myElem"></div> </body> </html>
Roger
MiscField for 2.0
I don't think it is compatible with Ext 2.0.
A similar extension is Ext.ux.StaticTextField:
http://extjs.com/forum/showthread.php?t=20992
Has the advantage that you can choose to add a hidden field to submit the field. However, it does some things differently, like automatically encoding the value when you call setValue. Not so sure this is a good idea.
I found a bug with MiscField in that getName doesn't work. Here is my workaround.
PHP Code:/**
* Returns the name attribute of the field if available, otherwise the hiddenName if
* available. Returns a null string if neither are available.
*
* @return {String} name The field name or hiddenName.
*/
getName: function(){
//return this.rendered && this.el.dom.name ? this.el.dom.name : (this.hiddenName || '');
// NB: "name" is applied to a div, hence you must use hasAttribute and getAttribute.
// Can't access it as el.dom.name as you would for an input element.
var n = '';
if ( this.rendered && this.el.dom.hasAttribute("name") ) {
n = this.el.dom.getAttribute("name");
} else if (this.hiddenName) {
n = this.hiddenName;
}
return n;
},
C is NULL
I have gotten a JS error saying C is NULL. I have added both the css file and the js file in the order specified.
Please help.
Thanks
Removing the "applyTo" - Method from Nullity's SourceCode made this cool little thing work for me on Ext 2.2
Not totally sure if that won't break anything though.
Posting Permissions
