PDA

View Full Version : tbar questions



elcid32
11 May 2009, 3:47 PM
Greetings:

I have been working on this small project for two days now. I haven't been able to find examples, documentation, etc. The examples I do see don't work properly when applied to the project I am working on and my frustration level is maxed. I am new to extjs and I have to say it is absolutely stunning stuff when you get it to work. I am having trouble with tbar:

My code is simple:



var cliGrid = new cliXG.GridPanel({
store : cliStore,
cm : cliColumnModel,
tbar :[{
text:'New',
tooltip:'New Client',
iconCls:'add'
}, '-', {
text:'Edit',
tooltip:'Edit Client',
iconCls:'option'
},'-',{
text:'Delete',
tooltip:'Delete Client',
iconCls:'remove'
}],
viewConfig:{forceFit:true,scrollOffset: 2},
plugins: cliExpander,
framed : true,
iconCls: 'icon-grid'
});

That's all there is to the grid panel. The following is the css:


/*
* CPS Common CSS
*/
DIV.cpsheader{
font-family: sans-serif;
font-weight: bold;
font-size: 110%;
color: #ffffff;
text-transform: capitalize;
text-align: left;
vertical-align: middle;
text-indent: 4px;
float: left;
height: 40px;
background-image:url("../images/slate/toolbar/bg.gif");
background-position:top;
}
DIV.cpsaddressdetail{
width: 200px;
margin:10px;
padding:10px;
border:1px dotted #999;
color:#0000FF;
font-weight: bold;
background: #f9f9f9;
}
.add{
background-image:url(../shared/icons/fam/add.gif) !important;
}
.option{
background-image:url(../shared/icons/fam/plugin.gif) !important;
}
.remove{
background-image:url(../shared/icons/fam/delete.gif) !important;
}
.save{
background-image:url(../shared/icons/save.gif) !important;
}
I attached a screen shot of the results.

I really, honestly don't know what else to do. Help, please.

file:///C:/DOCUME%7E1/Shawn/LOCALS%7E1/Temp/moz-screenshot.jpg

666ragez666
11 May 2009, 10:13 PM
it's a css problem. not 100 % sure but adding a background-repeat: no-repeat should solve it


DIV.cpsheader{
font-family: sans-serif;
font-weight: bold;
font-size: 110%;
color: #ffffff;
text-transform: capitalize;
text-align: left;
vertical-align: middle;
text-indent: 4px;
float: left;
height: 40px;
background-image:url("../images/slate/toolbar/bg.gif");
background-position:top;
background-repeat: no-repeat;
}

elcid32
12 May 2009, 3:25 AM
The DIV.cpsheader in the css does not apply to the tbar on the grid that I am working with. That is used to paint the title bar.

Animal
12 May 2009, 3:57 AM
What, you're saying you just have not been able to find ANY documentation? At all?

Animal
12 May 2009, 3:59 AM
Post decent sized screenshots. I have no idea what you are illustrating.

jimmyphp
12 May 2009, 4:32 AM
try add cls: 'x-btn-text-icon':



...
tooltip:'New Client',
iconCls:'add'
cls: 'x-btn-text-icon',
...

elcid32
12 May 2009, 6:01 AM
Animal:

Yes - that's what I am saying.

Animal
12 May 2009, 6:19 AM
So exporing the extjs.com website holds no interest for you? As far as you are concerned, you just know that they have no documentation, so you're not going to even look?

General info: http://extjs.com/learn/

Most excellent and complete API documents: http://extjs.com/deploy/ext-3.0-rc1.1/docs/

elcid32
12 May 2009, 6:24 AM
I've lived on this site for the past two days. I told you I was new to Extjs and I put forth my best effort to find a solution to a problem that I have before I posted it in a forum.

Perhaps I am not looking in the right place, but you can publicly chastise me or you can help me. One is more counter-productive than the other.

Animal
12 May 2009, 6:25 AM
I helped you. I posted the links. They are all there. DOn't you know how to use a website:

http://i131.photobucket.com/albums/p286/TimeTrialAnimal/look.jpg

elcid32
12 May 2009, 6:43 AM
You are pompous and arrogant and serve no other purpose other than to sit on your high horse and make new users of this technology out to be idiots. I am well aware of how to use a web browser and have been searching this site. OBVIOUSLY, I am not looking in the right area, genius.

If there is anyone ELSE out there willing to help, I would greatly appreciate it, this clown is doing nothing but wasting my time.

elishnevsky
12 May 2009, 6:54 AM
You are pompous and arrogant and serve no other purpose other than to sit on your high horse and make new users of this technology out to be idiots. I am well aware of how to use a web browser and have been searching this site. OBVIOUSLY, I am not looking in the right area, genius.

If there is anyone ELSE out there willing to help, I would greatly appreciate it, this clown is doing nothing but wasting my time.

You should be banned for this comment. You don't have any right to speak like this to someone, who contributed to this community more than one can imagine. Moreover, Animal doesn't even have to try to make new users like yourself look like idiots, it's the way you present yourself by saying that you were unable to find ANY documentation. And frankly, I got the same impression as Animal, that you don't know how to use a website.

Animal
12 May 2009, 6:58 AM
Have you actually been FOLLOWING the links to useful information that I have been posting in this thread?

elcid32
12 May 2009, 6:59 AM
Ban me if you wish. You just don't treat people like that. I offer no apologies.

Animal
12 May 2009, 7:07 AM
What "treat".

I was curious as to how you said that there was no documentation. I mean some people complain about "the wrong type" of documentation, or "too few examples".

But you said there was none whatsoever which I find ridiculous. Nobody has been "treated" at all.

elcid32
12 May 2009, 7:22 AM
I said I was not able to find documentation. I did not say there was none.

I came to this forum asking for help on a fuel injector and you give me the entire engine manual, which would have been fine had you not taken the opportunity to insult me when you gave it to me. And I notice you do that a lot on this forum.

You are obviously an extremely bright person with vast amounts of knowledge on this technology but I am not going to just sit back and let you insult me. If that's your MO, then I don't need your help.

elcid32
12 May 2009, 12:43 PM
Could someone please help me with this issue. I cannot seem to get the toolbar on the grod to render properly (See image attachment). Thanks for any input.



<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<link rel="stylesheet" type="text/css" href="resources/css/ext-all.css" />
<link rel="stylesheet" type="text/css" href="resources/css/xtheme-vista.css" />
<link rel="stylesheet" type="text/css" href="resources/css/cpsdef.css" />
<script type="text/javascript" src="adapter/ext/ext-base.js"></script>
<script type="text/javascript" src="ext-all-debug.js"></script>
<title id="page-title">CPS Client Management System</title>
<script type="text/javascript">var clidatastore='data/clidata.31551677.xml';</script>
<script type="text/javascript" src="scripts/rowexpander.js"></script>
<script type="text/javascript" src="scripts/simple.js"></script>
</head>
<body>
<div id="cpsheaderdiv" class="cpsheader">
CPS Client Information Manager
</div>
</body>
</html>



Ext.onReady(function(){
Ext.QuickTips.init();
//Build The Client Grid
var cliXG = Ext.grid;
var cliData = Ext.data.Record.create([
{name:'ASID'},
{name:'PRACTICENAME'},
{name:'CLIENTNAME'},
{name:'ADDRESS1'},
{name:'ADDRESS2'},
{name:'ADDRESS3'},
{name:'ADDRESS4'},
{name:'ADDRESS5'}
]);
var cliReader = new Ext.data.XmlReader({
id :'ASID',
record :'RECORD'
},cliData);
var cliStore = new Ext.data.Store({
url : clidatastore,
reader : cliReader
});
var cliExpander = new cliXG.RowExpander({
tpl : new Ext.Template(
'<div class="cpsaddressdetail">',
'<p>{CLIENTNAME}</p>',
'<p>{ADDRESS1}</p>',
'<p>{ADDRESS2}</p>',
'<p>{ADDRESS3}</p>',
'<p>{ADDRESS4}</p>',
'<p>{ADDRESS5}</p>',
'</div>')

});
var cliColumnModel = new cliXG.ColumnModel([
cliExpander,{header:'Client Name',dataIndex:'PRACTICENAME',sortable:false}
]);
var cliGridToolBar = new Ext.Toolbar({
height: 30,
items :[{
text :'New',
xtype : 'button',
tooltip:'New Client',
iconCls:'add',
}, '-', {
text :'Edit',
tooltip:'Edit Client',
iconCls:'option',
},'-',{
text :'Delete',
tooltip:'Delete Client',
iconCls:'remove',
}]
});
var cliGrid = new cliXG.GridPanel({
store : cliStore,
cm : cliColumnModel,
viewConfig:{forceFit:true,scrollOffset: 2},
plugins: cliExpander,
framed : true,
tbar : cliGridToolBar,
});
//Build The Panels
var headerPanel = new Ext.BoxComponent({
id :'header-panel',
region:'north',
el :'cpsheaderdiv',
height:26,
border:true
});
var clientPanel = {
id :'client-panel',
region :'west',
width :280,
collapsible:true,
items :[cliGrid],
layout : 'fit',
title :'CPS Clients',
split : true
}
var centerPanel = {
id :'center-panel',
region :'center',
items :
new Ext.TabPanel({
border :false,
activeTab :0,
items :[{
html :'<p>A TabPanel component can be a region.</p>',
title : 'Invoicing',
autoScroll:true
},{
html :'<h1>Another Tab</h1>',
title :'Collections',
autoScroll:true
},{
html :'<h1>Another Tab</h1>',
title :'A/R Management',
autoScroll:true
}]
})
}
var notesPanel = {
id :'notes-panel',
region:'south',
title :'Client Notes',
height:200,
border:true,
split :true
}
new Ext.Viewport({
layout :'border',
items :[clientPanel,centerPanel,notesPanel,headerPanel]
});
cliStore.load();
});
My CSS:


/*
* CPS Common CSS
*/
DIV.cpsheader{
font-family: sans-serif;
font-weight: bold;
font-size: 110%;
color: #ffffff;
text-transform: capitalize;
text-align: left;
vertical-align: middle;
text-indent: 4px;
float: left;
height: 40px;
background-image:url("../images/slate/toolbar/bg.gif");
background-position:top;
}
DIV.cpsaddressdetail{
width: 200px;
margin:10px;
padding:10px;
border:1px dotted #999;
color:#0000FF;
font-weight: bold;
background: #f9f9f9;
}
.add{
background-image:url(../shared/icons/fam/add.gif) !important;
}
.option{
background-image:url(../shared/icons/fam/plugin.gif) !important;
}
.remove{
background-image:url(../shared/icons/fam/delete.gif) !important;
}
.save{
background-image:url(../shared/icons/save.gif) !important;
}

saJoshua
15 Jul 2009, 5:20 AM
Ban me if you wish. You just don't treat people like that. I offer no apologies.

+1

Good attitude Elcid.

@Animal : Don't forget just how frustrating starting out with ExtJs can be. Yes, you have contributed a lot to community. And that on a "volunteer" basis. Well done. Don't spoil that now with chewing out someone that has asked a question on the forum. If you're too high and mighty to offer simple, helpful advise, why not just leave it to those that will?

saJoshua
15 Jul 2009, 5:22 AM
Apparently I can't "REPORT POST" because I'm not currently a "PREMIUM" subscriber. I'm sure it's an oversite and not the deliberate intention of ExtJS admins.

Animal
15 Jul 2009, 5:43 AM
I'm not totally sure why you are adding to the end of a 3 month dead thread.

saJoshua
15 Jul 2009, 5:43 AM
Attached example with west region containing a grid with a toolbar that has buttons showing icons. Perhaps it will help with your solution.

saJoshua
15 Jul 2009, 5:44 AM
People have resurrected it on twitter.

saJoshua
15 Jul 2009, 5:48 AM
http://twitter.com/StevenMcD/status/2649944580

By the way, perhaps its time to use 20/20 hindsight.

How many more posts did this novice post on the ExtJs forums? Who knows how much he may have contributed if he had been met with a warmer welcome.

Animal
15 Jul 2009, 6:06 AM
Drama queens.

saJoshua
15 Jul 2009, 6:20 AM
"Imperious, choleric, irascible, extreme in everything, with a dissolute imagination the like of which has never been seen, atheistic to the point of fanaticism, there you have me in a nutshell, and kill me again or take me as I am, for I shall not change."

~Marquis de Sade

Animal
15 Jul 2009, 6:21 AM
Great quote. I'm liking this guy. I'll have to google him. They put him in the Bastille didn't they?

saJoshua
15 Jul 2009, 6:23 AM
something like that.

wiki (http://en.wikipedia.org/wiki/Marquis_de_Sade) :
a French aristocrat, revolutionary and novelist. His novels were philosophical and sadomasochistic, exploring such controversial subjects as rape, bestiality and necrophilia. He was a proponent of extreme freedom (or at least licentiousness), unrestrained by morality, religion or law, with the pursuit of personal pleasure being the highest principle.