Urlfield working, innerHtml doesn't

[izak18]

Hi everybody, I have a problem, when I try to use a urlfield, this is my component:

xtype: 'urlfield',
label: 'Telephone',
//name: 'TEL_NUMBER',
readOnly: true,
listeners: {
	'painted': function(ele) {
		var record = solicitanteOC.getRecord();
		if (record.data.TEL_NUMBER != '') {
			//ele.setValue('<a href="tel:' + record.data.TEL_NUMBER + '"></a>');
			ele.setHtml('<a href="tel:' + record.data.TEL_NUMBER + '">' + record.data.TEL_NUMBER + '</a>');                                
		}
	}
}

Url is working, but when I see it in my page, I don't know what happen but it looks like this:

bb90563ba0b24b60bfacb89.png

2 lines in the field? one in blank and the other with the url ... what do i have to do?

thanks in advance!

[sword-it]

Hi!
Actually, it is not an empty space , it is an input field.

The Url field creates an HTML5 url input or you may say, the url field is just a normal text field.

Because url field inherits from textfield it gains all of the functionality that text fields provide, including getting and setting the value at runtime, validations and various events that are fired as the user interacts with the component.

Sample:-

{
       xtype: 'urlfield',
       label: 'Url'  ,
       html:'<a href="#">Sample Anchor</a>'
 }

urlField.png

For More info on urlField, check this:-
http://docs.sencha.com/touch/2-0/#!/api/Ext.field.Url

[izak18]

Yeah, urlfield is just a type of textfield, so that not works for me.
I resolve this "issue" "making up" the field with a css and adding focus() in the listener of the field:
I hope it can be useful to others.

.x-input-url
{
    color:Blue;
    text-decoration:underline;
    font-size:16px;
    cursor:pointer;
}

xtype: 'urlfield',
label: 'Teléfono',
readOnly: true,
name: 'TEL_NUMBER',
listeners: {
	'focus': function(ele) {
		var nombre = solicitanteOC.getRecord().data.NAME_TEXT;
		var nro = solicitanteOC.getRecord().data.TEL_NUMBER;
		if (nro) {
			Ext.Msg.confirm('Contacto', 'Llamar a ' + nombre + "?", function(res) {
				if (res == 'si') {
					window.location = 'tel:' + nro;
				}
			}, this);
		}
	}
}

Thanks anyway!