[Proto-Scripty] get html fragment by Ajax.Request but no css applied by Web Browser

[santino83]

Hello,

I'm trying to load an xhtml fragment inside a div. I'm using
Ajax.Request to do this. so I have two pages:

1) Main.html

2) Ajax_Called.html

in Main.html I have all the css needed by my code, and all works ok.
When I load the Ajax_Called.html page, the source code of this page
(only an html snippet) is correctly insert into my div, but browsers
don't apply css rules on the new elements (I tested it with Safari and
Opera, both up to date).

the code is pretty simple:

$('myButton').on('click',function(){

new Ajax.Request('/Ajax_Called.html',{
onComplete:function(response){
$('myTargetDiv').update(response.responseText);
}
});


I looked for an help in the docs, but I've found nothing... Googling
the same... Any helps?

Thank You.

G.Santini

[Walter Lee Davis]

On Jun 12, 2012, at 12:20 PM, santino83 wrote:

> Hello,
>
> I'm trying to load an xhtml fragment inside a div. I'm using
> Ajax.Request to do this. so I have two pages:
>
> 1) Main.html
>
> 2) Ajax_Called.html
>
> in Main.html I have all the css needed by my code, and all works ok.
> When I load the Ajax_Called.html page, the source code of this page
> (only an html snippet) is correctly insert into my div, but browsers
> don't apply css rules on the new elements (I tested it with Safari and
> Opera, both up to date).
>
> the code is pretty simple:
>
> $('myButton').on('click',function(){
>
> new Ajax.Request('/Ajax_Called.html',{
> onComplete:function(response){
> $('myTargetDiv').update(response.responseText);
> }
> });
>

You could make it much simpler:

$('myButton').on('click', function(evt){
new Ajax.Updater('myTargetDiv', 'Ajax_Called.html', {method: 'get'});

});

>
> I looked for an help in the docs, but I've found nothing... Googling
> the same... Any helps?

Try manually constructing what you expect the final page to be (view source on the original, copy, paste into a new editor, copy the entire source of Ajax_Called.html and paste it into myTargetDiv. Then validate the whole lot at http://validator.w3.org

One thing that occurs to me is that you may have a complete HTML document in Ajax_Called.html, rather than just a fragment. It has to be the latter.

Walter

>
> Thank You.
>
> G.Santini
>
> --
> You received this message because you are subscribed to the Google Groups "Prototype & script.aculo.us" group.
> To post to this group, send email to prototype-s...@googlegroups.com.
> To unsubscribe from this group, send email to prototype-scripta...@googlegroups.com.
> For more options, visit this group at http://groups.google.com/group/prototype-scriptaculous?hl=en.
>

[santino83]

Walter

On Tuesday, June 12, 2012 6:36:35 PM UTC+2, Walter Lee Davis wrote:

Try manually constructing what you expect the final page to be (view source on the original, copy, paste into a new editor, copy the entire source of Ajax_Called.html and paste it into myTargetDiv.

 Thank you so much!!! it was a css problem of mine: the container when I put the loaded html fragment had a style who changed the inherited object appearance and there was my "losing css" problem. Now everything works fine!

Thank you!

Giorgio.