Start Building Professional
Web Apps Today

Tabbar: Why do Javascript update/innerHTML not work?

I am trying to use the Javascript function update (or innerHTML alternatively) to replace some content of a div tag within a tab of dhtmlxtabbar (tabbar operating in ajax-html mode).

This works only if the string to be inserted does not contain any HTML tags, otherwise not. The same is true if I use innerHTML instead of update. Why is this the case? How can the problem be solved? Outside dhtmlxTabbar everything works fine...

******** Replacement string without any tags works fine: *******

<div id="uploaded_image_box">Not yet replaced...</div>
<script type="text/javascript">
    var replacement_string_for_div = 'now replaced';
    document.getElementById("uploaded_image_box").update(replacement_string_for_div);
</script>


******** Replacement string with tags does not work!!! ******
<div id="uploaded_image_box">Not yet replaced...</div>
<script type="text/javascript">
    var replacement_string_for_div = '<b>now replaced</b>';
    document.getElementById("uploaded_image_box").update(replacement_string_for_div);
</script>

Actually there must not be any difference, while you working on native HTML level, tabbar must not affect HTML in any way.
Please be sure that
- uploaded_image_box is unique ID ( all tabs of tabbar exists in same namespace )
- container is loaded
        because you are using ajax mode, the content of tab may be not available directly after tab selection, it requires some time to load content. Tabbar provides special event         to catch moment when content of tab loaded and can be operable - tabbar.setOnTabContentLoaded(...