CSS does not load on .load & about accessing loaded cont
Hi,
I am trying to dynamically load content into a container "frame" when the user clicks on a menu link.
I can get the content to load but it doesn't comply to the CSS that i have loaded earlier. How do i get it to comply? I know I must be doing something wrong, or not doing something im supposed to do, coz i cant find a similar problem on the net...
the second problem is that in the loaded content, is another ID i want to reference in Jquery, but i cant seem to reference it. so i have to "refresh" the selector list? live events is not my solution as its not bound to an event, i just want to animate it differently when it loads.
the rest works well....i think
snip:
main.php:
-
<head>
<!--load css-->
<!--load jQuery-->
$("#document").ready(function() {
$("a#menuLink").click (function(e) {
$("#Container").load('content.html').hide( function() {
$("#message").fadeIn(400);
$("#textarea").slideToggle();
});
});
$("#formsubmit").live ("click", function (e) {
e.preventDefault();
$.post ("process.php", {newmessage: $(#newmessage).val(), function () {
$("#Container").load('content.html').hide( function() {
$("#message").fadeIn(400);
$("#textarea").slideToggle();
});
});
});
});
</head>
<body>
<table>
<tr>
<td><a id='menuLink1'>Link 1</a></td>
<td id='Container'></td>
</tr>
</table>
</body>
content.html:
-
<table>
<form>
<tr><td id='message'>Old message is Old</td></td>
<tr><td id='textarea'><textarea name='newmessage' onfocus='this.select()'>New message here</textarea></td></tr>
<tr><td><input type='submit' id='formsubmit' value='Submit/></td></tr>
</form>
</table>
I know the different animation thing is only making things complicated for myself, but i want to learn, so in the future if i need anything like this, i know how to do it (like refreshing the selector list??)
edit: i just realised that the form submitted doens;t work also. $("#newmessage").val() returns nothing. so nothing is submitted to process.php