We Keep Coding

How to pass an object in this case?

I have a page with a "left" div, that contains a menu, and a "right" div, which holds a content that changes, loaded using javascript as in:
document.getElementById("content").innerHTML='<object type="text/html" data="templates/login.htm"> </object>';
It works okay the first time I click a link on the left menu. Now, this new loaded content has also some inputs that should do the same thing. Only it seems that they can't see the "content" div as having this id, or something else. How do I accomplish this? (fixed menu on left, and on the right we would have changing content - which would have several inputs as well). Thanks.
ADDENDUM - The contents of the js function is just the line pasted above. Probably the flow will clarify?
Step 1 - load menu on left and initial content on right. No user intervention
Step 2 - click "login" on left menu. Login page (separate html) loaded on right side. All fine.
Step 3 - click "cancel" in newly loaded login menu on right side... nothing happens, despite that button having the exact same onclick that the left side menu had (the one used to load the login scren in step 2)
When tracing through parents of this "cancel" button, the trace never "saw" the div.
This was the output of "parent hunting"
object HTMLParagraphElement (button is in a )
object HTMLTableCellElement
object HTMLTableRowElement
object HTMLTableSectionElement
object HTMLTableElement (so far so good... this should be a table containing the button clicked)
object HTMLBodyElement (mmm shouldn't I have a div here?)
object HTMLhtmlElement
object HTMLDocument
null
(now... shouldn't I have a div between body and table elements?)
Seems the partial html loaded inside the div cannot see it?

If that code-sample is used in your project, the missing > might be the source of your troubles.
document.getElementById("content").innerHTML='<object type="text/html" data="templates/login.htm"></object>';

Okay...
Seems the loaded content can't intrinsically "see" the parent div or its id by default. The solution was to have:
parent.document.getElementById("content").innerHTML='<object type="text/html" data="templates/login.htm"></object>';
instead of
document.getElementById("content").innerHTML='<object type="text/html" data="templates/login.htm"></object>';

Reapply css style to a part of a view after binding list of data

Iam binding a toolbar with list of items on my page from database after opening a popup on the same page and when the binding is complete the css applied to that toolbar disappears. Please guide me how to keep the css applied to it even after binding as I am not reloading the page just binding data and the css style disappears.
js part:
var toolBox = new namespace.ToolboxData();
toolBox.initializeToolbox("Layout");
designerController.ToolBoxModel(toolBox.ToolBoxModel);
$('#accordion').multiAccordion().multiAccordion("option", "active", [0]);
html part:
<div class="scrollBar" id="accordianScroll">
<div id="accordion" data-bind="foreach:ToolBoxModel">
So here after binding is complete then the css called through class disappears.

This is for canvas, ignore otherwise:
If you are making your srcollbar in a canvas element....
Try something with .save() and .restore(). You can save the original state of your toolbar element say ....
var mytoolbar = document.getElementById('canvasToolBarId');
mytoolbar.save();
some code involving toolbar....
then
mytoolbar.restore();
Checkout refference.

how css class style change at run time of html page?

I have HTML, jQuery and CSS report.
In static way if wee see the 'view page source' from browser I can see is
<div id='report' class="test-reports-container"> but If I use FireBug in mozilla firefox it show something different like
<div id='report' class="test-reports-container mCustomScrollbar _mCS_1">
I don't understand how its changed.
The problem is I am creating dynamic contents so I need to remember className for which I append html content, but at run time className get changed so how would I append the html to some divs?
Can you say how its style get changed at runtime?

you can append html to test-reports-container class, even when FireBug shows <div id='report' class="test-reports-container mCustomScrollbar _mCS_1">
in this case class name hasn't changed but 2 new classes added to element
now your div element has 3 classes and that are test-reports-container, mCustomScrollbar & _mCS_1

How to append content into a twitter-bootstrap popover

How can I append a ne DOM element into a bootstrap popover. I have to render a small charts, using Highcharts, which should be displayed into popover, so I cant use just a string for content attribute.
So the main problem is, how to get the popover element after $el.popover() was called.

you have to enable the html option of the popover instance, for example,
$('.popover-with-html').popover({ html : true });

You can do it with
$el.popover({
content: $('.chart')
})
where .chart is your chart (or whatever) element.

How to replace a component in ExtJS

I have an ExtJS window, with a toolbar at the top, and loads with plain Panel at the bottom with plain HTML. This works fine. On a button click, I'd like to be able to replace the bottom panel (called content), with another panel. If tried this
var clickHandler = function(calendar){
// 'content' is the panel id
// calendar is also an Ext.Panel object
Ext.getCmp('content').update(calendar);
};
What am I missing?

Update replaces HTML content.
You want to remove the old panel and add the new. Try .remove()ing the old panel and .add()ing the new one, and don't forget .doLayout().