Create a control with expandable subcontrol
Hello all,
I am trying to develop a small app for a shop which lists down products. It is needed to list down each product in its own box (visible). This box is to show the basic specifications of a product but must contain another box with detailed specs, availability, price, offers, etc.
If would look like this when not expanded:
----------------------------------
| SOME BASIC INFO |
| |
| [Details button] |
----------------------------------
and when expanded:
----------------------------------
| SOME BASIC INFO |
| |
| [Hide Details button] |
+---------------------------------+
| |
| SOME DETAILED INFO (QTabs) |
| |
| |
----------------------------------
So I created a custom control for the box with a div to show the upper part and the lower part was a QTabs.
Now, it is needed that when the [Details] button is clicked, an Ajax call is made to server, and the QTabs be generated and presented on client screen. And here is the list of problems I am facing:
1. Ajax calls are not working (blank window popup after a "AJAX parse error" dialog box popup).
2. I tried to use ToggleDisplay but it does not seem to work when the QTabs is initially hidden!
3. I tried to create a subcontrol but no use. The problem persists.
Kindly suggest what can be done here? I do not think a QPanel can be used there either because that, too is failing!
Regards.
I have done something similar. I put the "details" into a separate QPanel and then used an AjaxAction to set the "Visible" property (true or false) on the QPanel. You could do the same, using javascript, which would eliminate the server call.
So what classes did you use to contain the two panels? Were those a custom control?
I am utterly confused between the various classes - Controls, Forms, Panels!! Can someone help me understand the differences, internally?
Yes, I created my own class, which extends QPanel. So, it looks something like this:
Main class:
...
$this->pnlMyPanel = new MyPanelClass($this);
...
MyPanelClass:
class MyPanelClass extends QPanel {
...
public function __construct($objParentObject, $strControlId = null) {
parent::__construct($objParentObject, $strControlId);
...
Then, in your main class, you might have a button or set the AjaxAction, so when the user takes that action (i.e. presses the button) the AjaxAction function being called would set the visible property on the panel:
protected function somefunction(){
$this->pnlMyPanel->Visible = true;
...
}
Something like that. You cloud even check the value of the property and do your own "toggle", by setting the Visible property to false, to "collapse" it. Of course, you'll need to add an entry in your "prepend.inc.php" so your custom class will autoload.
Edit:
You should read Grossini's guide, if you're really new to QCubed. I think it will help you a lot.
Well, Thanks a lot for that help. I really needed it. So what exactly is the difference among these classes: Qcontrol, Qpanel and QForm.
One difference which I know is that QForm would contain most of the other things, most of the times. But apart from that, almost anything which does not need to Post anything back to the server could utilize the either of the two. So what is the difference? Getting to know the difference might help me a lot selecting the right class for anything else which I create in the future.
I strongly recommend you download and read Grosinni's guide, for which I provided a link in my last post. It explains just about everything you need to know about QCubed and provides lots of examples. I couldn't possibly cover what you obviously need to learn. There is also a link on the QCubed home page for several excellent screencasts. I would start there, but definitely get Grosinni's guide. That guide will "turn the light's on" for you!
Basically, QForm is where the root of your program is. QPanels are children of QForms or other QPanels. QControl is the base for all controls in QCubed. The contents of all your controls will post back to the sever, whether they're parent is the QForm or a QPanel.