Dynamic content being overwritten

[eluser]bill19[/eluser]
Hi everyone,

I have recently asked http://ellislab.com/forums/viewthread/221757/ , but perhaps it is too specific. I'm going to try to rephrase it in a more general way:

I have 2 views, lets call them A and B , which I would like to load sequentially to form a single html page.

View 'A' has a static HTML component followed by a dynamic component in a table format that is created dynamically by javascript. View 'B' has a static HTML component only.

When I do:

Code:

$this->load->view('A'); //

view 'A' loads normally.

When I do:

Code:

$this->load->view('A');
$this->load->view('B');

The static part of A , followed by B ( also static ) is displayed, but the dynamic part of A is missing

When I do:

Code:

$this->load->view('B');
$this->load->view('A');

view 'B' and view 'A' load normally.

Why is this happening? Is there anything I can do to get all of A followed by all of B displayed.

Thanks in advance,

Bill

[eluser]CroNiX[/eluser]
Are you sure all of your javascript is loading? I see you are using relative paths, which is not really the best thing to do...

Code:

<skript src="blueimp/js/jquery.fileupload.js"></skript>

I'd check in your js console to see if you are getting 404 for all of those js files you load like that.

[eluser]bill19[/eluser]
Hi Cronix,

Thanks for looking at it. You were partially right.

I am using the the bootstrap toolkit and am trying to make self contained views inside bootstrap container tags. The way I have it set up is:

header
view A: <container> HTML goes here </container> css and js
view B: <container> HTML goes here </container> css and js
footer

when I concatenated the 2 views , I had a duplicate jquery script, causing in my case the following error in firebug:

$("#fileupload").fileupload is not a function
[Break On This Error]

$('#fileupload').fileupload();

I still don't understand what it means, given my poor JS skills at present, but once I commented out the second script the whole page started working as expected.

Thank you, that's a big help,

Bill

[eluser]CroNiX[/eluser]
Your javascript should really all be in the head of your document, not mixed within HTML. I'm thinking the problem with what you are seeing is you are using fileupload() before it gets loaded, so it's undefined. The order things load is important.

&lt;head&gt;
1. Load js frameworks, such as jQuery
2. Load js plugins, such as fileupload
3. Load your custom js that uses anything from #1/#2
&lt;/head&gt;

[eluser]bill19[/eluser]
Thank you. That's good to know.

I recognize that what I have been doing is not ideal as far as mixing js and html, but I like the idea of having self contained 'widgets' (containing html , js, css) that can be assembled quickly to make pages.

Is there a better approach than mine?

Best regards,

Bill