/**
* @class Roo.bootstrap.Link
* @extends Roo.bootstrap.Component
- * Bootstrap Link Class
+ * @children Roo.bootstrap.Component
+ * Bootstrap Link Class (eg. '<a href>')
+
* @cfg {String} alt image alternative text
* @cfg {String} href a tag href
* @cfg {String} target (_self|_blank|_parent|_top) target for a href.
* @cfg {String} html the content of the link.
+ * @cfg {String} anchor name for the anchor link
+ * @cfg {String} fa - favicon
+
+ * @cfg {Boolean} preventDefault (true | false) default false
*
* @constructor
href: false,
target: false,
+ preventDefault: false,
+ anchor : false,
+ alt : false,
+ fa: false,
+
- getAutoCreate : function(){
+ getAutoCreate : function()
+ {
+ var html = this.html || '';
- var cfg = {
- tag: 'img',
- cls: (this.imgResponsive) ? 'img-responsive' : '',
- html : null
+ if (this.fa !== false) {
+ html = '<i class="fa fa-' + this.fa + '"></i>';
}
-
- cfg.html = this.html || cfg.html;
-
- cfg.src = this.src || cfg.src;
-
- if (['rounded','circle','thumbnail'].indexOf(this.border)>-1) {
- cfg.cls += ' img-' + this.border;
+ var cfg = {
+ tag: 'a'
+ };
+ // anchor's do not require html/href...
+ if (this.anchor === false) {
+ cfg.html = html;
+ cfg.href = this.href || '#';
+ } else {
+ cfg.name = this.anchor;
+ if (this.html !== false || this.fa !== false) {
+ cfg.html = html;
+ }
+ if (this.href !== false) {
+ cfg.href = this.href;
+ }
}
- if(this.alt){
+ if(this.alt !== false){
cfg.alt = this.alt;
}
- if(this.href){
- var a = {
- tag: 'a',
- href: this.href,
- cn: [
- cfg
- ]
- }
-
- if(this.target){
- a.target = this.target;
- }
-
- }
+ if(this.target !== false) {
+ cfg.target = this.target;
+ }
- return (this.href) ? a : cfg;
+ return cfg;
},
initEvents: function() {
- if(!this.href){
+ if(!this.href || this.preventDefault){
this.el.on('click', this.onClick, this);
}
},
onClick : function(e)
{
- Roo.log('img onclick');
+ if(this.preventDefault){
+ e.preventDefault();
+ }
+ //Roo.log('img onclick');
this.fireEvent('click', this, e);
}