Hi, how do I autoresize tabbars set to hrefmode=“iframe”? I don’t want to have to scroll through the long content of one of the tabs. Thanks!
Hello,
tabbar doesn’t provide any functionality that allows to resize the tabbar in case of iframe-based initialization.
If you load content from the same domain, you can use “ajax-html” mode to load pages. That mode allows to use enableAutoSize method. Please, see the sample: dhtmlxTabbar/samples/loading_creating_tabs_content/tab_ajax_html.html
In case of different domains, you can use only iframe-based loading mode and the security rules don’t allow to get the page property. In common case the tabbar size can be changed by setSize(width,height) method.
I tried using ajax-html hrefmode but it doesn’t load my scripts inside the loaded html. Isn’t it supposed to load the process the scripts?
Tabbar executes javascript that is defined in tab content. The sample dhtmlxTabbar/samples/loading_creating_tabs_content/tab_ajax_html.html demonstrates that. Here the second tab contains dhtmlxgrid (the grid initialization code was defined in the tab content).
Regarding using iframes mode - as it was written in the previous answer you can use setSize method to change tabbar size. You can call this method from iframe when its content is loaded:
function doOnLoad(){
parent.tabbar.setSize(document.body.scrollWidth,document.body.scrollHeight,true);
}
Okay, I tried tab_ajax_html.html again. This time I’m getting the ErrorType: LoadXML one. I assume that this code here:
<?xml version="1.0"?>is the one referred to as tabs7.xml, right? If yes, then probably I’m on the right track. The tab tag inside the xml has an href attribute. What’s supposed to be the value of that attribute? I’m assuming that it’s the html that I want to load which contains html and JavaScript. What could be the problem? When I remove the href’s value, the error doesn’t appear so I assume that the problem really stems from the content of that href.
<tabbar hrefmode=“ajax”>
<row>
<tab id=“b1” width=‘100px’ selected=“1” href=“slow_ajax.php?num=0”>Google</tab>
<tab id=“b2” width=‘100px’ href=“slow_ajax.php?num=1”>Yahoo</tab>
</row>
</tabbar>
This sample is referred to tabs7a.xml - dhtmlx.com/docs/products/dhtmlxT … tabs7a.xml
The xml that you provided uses “ajax” mode.
Now I’m getting an Invalid Request. I wish there were better examples.
Could you please explain what’s wrong with these examples ? This information can be useful for us.
For example, in my case, I simply want to load an html with a javascript inside it asynchronously whenever I click a tab. Obviously, I would need at least 2 html pages, right? The first one is where I will load the second html. What should be the content of the first html: load the dhtmlxtabbar js, a div where to load it, etc. The document here: dhtmlx.com/docs/products/doc … tmlxtabbar doesn’t do that. Under Loading Content with AJAX, only the XML is shown. How about the rest of the stuff that will make it work? The rest of the examples above it won’t really work with that XML.
I tried it again. The regular text in the html I’m loading is being rendered but not the JavaScript part.
Probably you’re right. There should be also the example for “ajax-html” loading mode.
Thank you for the information.
In case of “ajax-html” the tabbar requires html content. In case of “ajax” mode the paths that are defined in href attributes are xml files. If you use “ajax-html”, the path to html. Please, take a look dhtmlx.com/docs/products/dhtmlxT … tabs7a.xml
If the issue still perists, please, provide the sample to re-create the issue.
And by the way, I tried both Loading Content with AJAX and the Mixed loading mode. Neither executed the script inside the tab content.
Please, take a look at the ready sample in the suite package dhtmlxTabbar/samples/loading_creating_tabs_content/tab_ajax_html.html - it demonstrates that javascript, that is called in the content, is executed when the tab is loaded.
Please, provide the sample if the issue is still actual.
Also you can use iframes mode as we described in one of the answers (setSize method).
I’m having a hard time isolating the problem with the ajax-html. I guess I’ll use the resizing of the iframe for now. Thanks Alex!
I’m also trying to get my tab content to auto-resize. I’m using an XML file to load my tab definitions with mode set.
I couldn’t really make clear what was being suggested. I have my main page as index.html. That in turn loads an xml file which has hrefmode set to “iframe”. So where is it that I have to place the javascript function that was suggested:
function doOnLoad(){
parent.tabbar.setSize(document.body.scrollWidth,document.body.scrollHeight,true);
}
Does this go into the section of my index.html file and then get called by each iframe script that is specfied in my XML file using or does the script and the body onload call both go into each iframe script ?
Would be really helpful if you could explain it again, I really appreciate the time you guys take answering questions but in this particular case I’m just not clear as to what you’re suggesting.
This method can be called from the page (from each page) loaded inside iframe in body onload event:
Yes but where is the javascript function doOnLoad placed?
It doesn’t matter. For example in the header part of the page where it’s called.
OK, well I tried putting the function and the “body onload” statement into one of the tab content scripts and all that happens is that all my tabs disappear and I’m still left with a scrollbar on the tab content section.
This is what I have:
The main program, index.html which contains:
<script src=“dhtmlxcommon.js”>
<script src=“dhtmlxtabbar.js”>
|
|
The XML loader file:
<?xml version="1.0"?>
1
2
3
4
5
6
7
8
9
10
Then, for example, in the script which is loaded by the second tab I have in the head section:
and also:
When I click on the tab to load this script all that happens is that all the tabs disappear and ther is no resizing. Do you have a working example showing this working anywhere?
You can use own approach to get content size. The possible solution is attached.
1250085799.zip (84.7 KB)