You are viewing a plain text version of this content. The canonical link for it is here.
Posted to users@wicket.apache.org by Michael M <ge...@gmail.com> on 2012/08/09 11:58:08 UTC

Javascript in HTML -ta not working when Panel is used within a Wicket ModalWindow

I have several panels that I'm displaying in a ModalWindow. In the html
files of those panels I have script-tags in the body, e.g. for
SyntaxHighlighter or a JW Player. Those tags work if I embed the panel into
its own page. However, they are NOT working when the panel is embedded into
a ModalWindow.

Example for a panel (html-file) that displays text which is supposed to be
processed by SyntaxHighlighter (this is in the body-tag):

<wicket:panel>
  <pre wicket:id="syntaxHighlighterContent"></pre>
  <script type="text/javascript">
    SyntaxHighlighter.all();
  </script>
 </wicket:panel>

I've added all the required JS and CSS references in the overridden
*renderHead(IHeaderResponse
response)* method, by *
response.renderJavaScriptReferences("/media/js/shCore.js")* for example.
After googling, I also tried the same in an AbstractAjaxBehavior added to
the panel instead of adding the references in the Panel-header. I just
can't get it to work.

When I check the source-code in the browser, the required JS and CSS files
are referenced (at least in the parent-page of the ModalWindow). Also not
JavaScript errors as far as I see them.

It's working if I embed the panel into a page and put that page into the
ModalWindow instead of the panel, but I want to avoid that because it's not
necessary and results in scrolling issues. Any help is appreciated, thank
you!

Re: Javascript in HTML -ta not working when Panel is used within a Wicket ModalWindow

Posted by Michael M <ge...@gmail.com>.
That really is working! I don't get it, I've seen that nowhere documented,
so I guess it's more a problem of SyntaxHighlighter than Wicket at all (in
combination with Ajax).

Thanks for your help, I appreciate it! I guess if everything is working as
expected with JavaScript inside panels I also won't have trouble with other
content.

2012/8/9 Andrea Del Bene <an...@gmail.com>

> On 08/09/2012 04:20 PM, Michael M wrote:
>
>> Hmm I really just tried this several times.. how can it be that different
>> people get a different quick-start behavior? I created that quick start
>> form scratch, added the wicket-extensions dependency, my classes, the
>> 'media' folder with all the CSS and JS files and ran it. I'm confused..
>>
>> 2012/8/9 Michael M <ge...@gmail.com>
>>
>>
>>  The different behavior should be due to a different version of Jetty:
> inside Eclipse I was using ver 6.1.26 while running your quickstart via
> Maven it uses ver 7.5 and I get your behavior.
> That said, I've found a solution replacing all() with highlight() (see
> here: http://stackoverflow.com/**questions/6471526/use-syntax-**
> highlighter-on-ajax-loaded-**content<http://stackoverflow.com/questions/6471526/use-syntax-highlighter-on-ajax-loaded-content>).
> I'm not an expert of Syntax Highlighterlibrary, so I can't say why
> highlight() works while all() doesn't...
>
>
> ------------------------------**------------------------------**---------
> To unsubscribe, e-mail: users-unsubscribe@wicket.**apache.org<us...@wicket.apache.org>
> For additional commands, e-mail: users-help@wicket.apache.org
>
>

Re: Javascript in HTML -ta not working when Panel is used within a Wicket ModalWindow

Posted by Andrea Del Bene <an...@gmail.com>.
On 08/09/2012 04:20 PM, Michael M wrote:
> Hmm I really just tried this several times.. how can it be that different
> people get a different quick-start behavior? I created that quick start
> form scratch, added the wicket-extensions dependency, my classes, the
> 'media' folder with all the CSS and JS files and ran it. I'm confused..
>
> 2012/8/9 Michael M <ge...@gmail.com>
>
>
The different behavior should be due to a different version of Jetty: 
inside Eclipse I was using ver 6.1.26 while running your quickstart via 
Maven it uses ver 7.5 and I get your behavior.
That said, I've found a solution replacing all() with highlight() (see 
here: 
http://stackoverflow.com/questions/6471526/use-syntax-highlighter-on-ajax-loaded-content). 
I'm not an expert of Syntax Highlighterlibrary, so I can't say why 
highlight() works while all() doesn't...

---------------------------------------------------------------------
To unsubscribe, e-mail: users-unsubscribe@wicket.apache.org
For additional commands, e-mail: users-help@wicket.apache.org


Re: Javascript in HTML -ta not working when Panel is used within a Wicket ModalWindow

Posted by Michael M <ge...@gmail.com>.
Hmm I really just tried this several times.. how can it be that different
people get a different quick-start behavior? I created that quick start
form scratch, added the wicket-extensions dependency, my classes, the
'media' folder with all the CSS and JS files and ran it. I'm confused..

2012/8/9 Michael M <ge...@gmail.com>

> That's weird. When I run the quick start, both links open a ModalWindow.
> But only the second one displays with SyntaxHighlighter.
>
> When I remove the slash to make the url relative, nothing changes for me..
>
>
> 2012/8/9 Andrea Del Bene <an...@gmail.com>
>
>> The first link doesn't even open the modal window, right? Anyway, with
>> firebug I see that the references to JS and CSS files are wrong and they
>> are not loaded. To make your code work you have  to remove the first slash
>> on the left, like this:
>>
>>  response.renderCSSReference("**media/css/shCore.css", "screen");
>>  response.renderCSSReference("**media/css/shThemeDefault.css", "screen");
>>  response.**renderJavaScriptReference("**media/js/shCore.js");
>>  response.**renderJavaScriptReference("**media/js/shBrushPlain.js");
>>
>> I've tried it and it works.
>>
>>  Ok, I just did, thank you! I narrowed it down to the essential stuff,
>>> you will see what's going on, there are two links:
>>>
>>> The first one its what does not work, just the panel.
>>> The second one shows you how it should be, but I do not want pages for
>>> the because of scrolling issues and various other reasons.
>>>
>>> Michael
>>>
>>> 2012/8/9 Martin Grigorov <mgrigorov@apache.org <mailto:
>>> mgrigorov@apache.org>>
>>>
>>>
>>>     Hi,
>>>
>>>     Please create a quickstart app and someone will try to debug it
>>>     and help you.
>>>
>>>     On Thu, Aug 9, 2012 at 12:58 PM, Michael M <generic4x@gmail.com
>>>     <ma...@gmail.com>> wrote:
>>>     > I have several panels that I'm displaying in a ModalWindow. In
>>>     the html
>>>     > files of those panels I have script-tags in the body, e.g. for
>>>     > SyntaxHighlighter or a JW Player. Those tags work if I embed the
>>>     panel into
>>>     > its own page. However, they are NOT working when the panel is
>>>     embedded into
>>>     > a ModalWindow.
>>>     >
>>>     > Example for a panel (html-file) that displays text which is
>>>     supposed to be
>>>     > processed by SyntaxHighlighter (this is in the body-tag):
>>>     >
>>>     > <wicket:panel>
>>>     >   <pre wicket:id="**syntaxHighlighterContent"></**pre>
>>>     >   <script type="text/javascript">
>>>     >     SyntaxHighlighter.all();
>>>     >   </script>
>>>     >  </wicket:panel>
>>>     >
>>>     > I've added all the required JS and CSS references in the overridden
>>>     > *renderHead(IHeaderResponse
>>>     > response)* method, by *
>>>     > response.**renderJavaScriptReferences("/**media/js/shCore.js")*
>>> for
>>>     example.
>>>     > After googling, I also tried the same in an AbstractAjaxBehavior
>>>     added to
>>>     > the panel instead of adding the references in the Panel-header.
>>>     I just
>>>     > can't get it to work.
>>>     >
>>>     > When I check the source-code in the browser, the required JS and
>>>     CSS files
>>>     > are referenced (at least in the parent-page of the ModalWindow).
>>>     Also not
>>>     > JavaScript errors as far as I see them.
>>>     >
>>>     > It's working if I embed the panel into a page and put that page
>>>     into the
>>>     > ModalWindow instead of the panel, but I want to avoid that
>>>     because it's not
>>>     > necessary and results in scrolling issues. Any help is
>>>     appreciated, thank
>>>     > you!
>>>
>>>
>>>
>>>     --
>>>     Martin Grigorov
>>>     jWeekend
>>>     Training, Consulting, Development
>>>     http://jWeekend.com
>>>
>>>     ------------------------------**------------------------------**
>>> ---------
>>>     To unsubscribe, e-mail: users-unsubscribe@wicket.**apache.org<us...@wicket.apache.org>
>>>     <ma...@wicket.apache.org>
>>> >
>>>
>>>     For additional commands, e-mail: users-help@wicket.apache.org
>>>     <ma...@wicket.apache.org>
>>> >
>>>
>>>
>>>
>>>
>>>
>>> ------------------------------**------------------------------**
>>> ---------
>>> To unsubscribe, e-mail: users-unsubscribe@wicket.**apache.org<us...@wicket.apache.org>
>>> For additional commands, e-mail: users-help@wicket.apache.org
>>>
>>
>>
>

Re: Javascript in HTML -ta not working when Panel is used within a Wicket ModalWindow

Posted by Michael M <ge...@gmail.com>.
That's weird. When I run the quick start, both links open a ModalWindow.
But only the second one displays with SyntaxHighlighter.

When I remove the slash to make the url relative, nothing changes for me..

2012/8/9 Andrea Del Bene <an...@gmail.com>

> The first link doesn't even open the modal window, right? Anyway, with
> firebug I see that the references to JS and CSS files are wrong and they
> are not loaded. To make your code work you have  to remove the first slash
> on the left, like this:
>
>  response.renderCSSReference("**media/css/shCore.css", "screen");
>  response.renderCSSReference("**media/css/shThemeDefault.css", "screen");
>  response.**renderJavaScriptReference("**media/js/shCore.js");
>  response.**renderJavaScriptReference("**media/js/shBrushPlain.js");
>
> I've tried it and it works.
>
>  Ok, I just did, thank you! I narrowed it down to the essential stuff, you
>> will see what's going on, there are two links:
>>
>> The first one its what does not work, just the panel.
>> The second one shows you how it should be, but I do not want pages for
>> the because of scrolling issues and various other reasons.
>>
>> Michael
>>
>> 2012/8/9 Martin Grigorov <mgrigorov@apache.org <mailto:
>> mgrigorov@apache.org>>
>>
>>
>>     Hi,
>>
>>     Please create a quickstart app and someone will try to debug it
>>     and help you.
>>
>>     On Thu, Aug 9, 2012 at 12:58 PM, Michael M <generic4x@gmail.com
>>     <ma...@gmail.com>> wrote:
>>     > I have several panels that I'm displaying in a ModalWindow. In
>>     the html
>>     > files of those panels I have script-tags in the body, e.g. for
>>     > SyntaxHighlighter or a JW Player. Those tags work if I embed the
>>     panel into
>>     > its own page. However, they are NOT working when the panel is
>>     embedded into
>>     > a ModalWindow.
>>     >
>>     > Example for a panel (html-file) that displays text which is
>>     supposed to be
>>     > processed by SyntaxHighlighter (this is in the body-tag):
>>     >
>>     > <wicket:panel>
>>     >   <pre wicket:id="**syntaxHighlighterContent"></**pre>
>>     >   <script type="text/javascript">
>>     >     SyntaxHighlighter.all();
>>     >   </script>
>>     >  </wicket:panel>
>>     >
>>     > I've added all the required JS and CSS references in the overridden
>>     > *renderHead(IHeaderResponse
>>     > response)* method, by *
>>     > response.**renderJavaScriptReferences("/**media/js/shCore.js")* for
>>     example.
>>     > After googling, I also tried the same in an AbstractAjaxBehavior
>>     added to
>>     > the panel instead of adding the references in the Panel-header.
>>     I just
>>     > can't get it to work.
>>     >
>>     > When I check the source-code in the browser, the required JS and
>>     CSS files
>>     > are referenced (at least in the parent-page of the ModalWindow).
>>     Also not
>>     > JavaScript errors as far as I see them.
>>     >
>>     > It's working if I embed the panel into a page and put that page
>>     into the
>>     > ModalWindow instead of the panel, but I want to avoid that
>>     because it's not
>>     > necessary and results in scrolling issues. Any help is
>>     appreciated, thank
>>     > you!
>>
>>
>>
>>     --
>>     Martin Grigorov
>>     jWeekend
>>     Training, Consulting, Development
>>     http://jWeekend.com
>>
>>     ------------------------------**------------------------------**
>> ---------
>>     To unsubscribe, e-mail: users-unsubscribe@wicket.**apache.org<us...@wicket.apache.org>
>>     <ma...@wicket.apache.org>
>> >
>>
>>     For additional commands, e-mail: users-help@wicket.apache.org
>>     <mailto:users-help@wicket.**apache.org <us...@wicket.apache.org>
>> >
>>
>>
>>
>>
>>
>> ------------------------------**------------------------------**---------
>> To unsubscribe, e-mail: users-unsubscribe@wicket.**apache.org<us...@wicket.apache.org>
>> For additional commands, e-mail: users-help@wicket.apache.org
>>
>
>

Re: Javascript in HTML -ta not working when Panel is used within a Wicket ModalWindow

Posted by Andrea Del Bene <an...@gmail.com>.
The first link doesn't even open the modal window, right? Anyway, with 
firebug I see that the references to JS and CSS files are wrong and they 
are not loaded. To make your code work you have  to remove the first 
slash on the left, like this:

  response.renderCSSReference("media/css/shCore.css", "screen");
  response.renderCSSReference("media/css/shThemeDefault.css", "screen");
  response.renderJavaScriptReference("media/js/shCore.js");
  response.renderJavaScriptReference("media/js/shBrushPlain.js");

I've tried it and it works.

> Ok, I just did, thank you! I narrowed it down to the essential stuff, 
> you will see what's going on, there are two links:
>
> The first one its what does not work, just the panel.
> The second one shows you how it should be, but I do not want pages for 
> the because of scrolling issues and various other reasons.
>
> Michael
>
> 2012/8/9 Martin Grigorov <mgrigorov@apache.org 
> <ma...@apache.org>>
>
>     Hi,
>
>     Please create a quickstart app and someone will try to debug it
>     and help you.
>
>     On Thu, Aug 9, 2012 at 12:58 PM, Michael M <generic4x@gmail.com
>     <ma...@gmail.com>> wrote:
>     > I have several panels that I'm displaying in a ModalWindow. In
>     the html
>     > files of those panels I have script-tags in the body, e.g. for
>     > SyntaxHighlighter or a JW Player. Those tags work if I embed the
>     panel into
>     > its own page. However, they are NOT working when the panel is
>     embedded into
>     > a ModalWindow.
>     >
>     > Example for a panel (html-file) that displays text which is
>     supposed to be
>     > processed by SyntaxHighlighter (this is in the body-tag):
>     >
>     > <wicket:panel>
>     >   <pre wicket:id="syntaxHighlighterContent"></pre>
>     >   <script type="text/javascript">
>     >     SyntaxHighlighter.all();
>     >   </script>
>     >  </wicket:panel>
>     >
>     > I've added all the required JS and CSS references in the overridden
>     > *renderHead(IHeaderResponse
>     > response)* method, by *
>     > response.renderJavaScriptReferences("/media/js/shCore.js")* for
>     example.
>     > After googling, I also tried the same in an AbstractAjaxBehavior
>     added to
>     > the panel instead of adding the references in the Panel-header.
>     I just
>     > can't get it to work.
>     >
>     > When I check the source-code in the browser, the required JS and
>     CSS files
>     > are referenced (at least in the parent-page of the ModalWindow).
>     Also not
>     > JavaScript errors as far as I see them.
>     >
>     > It's working if I embed the panel into a page and put that page
>     into the
>     > ModalWindow instead of the panel, but I want to avoid that
>     because it's not
>     > necessary and results in scrolling issues. Any help is
>     appreciated, thank
>     > you!
>
>
>
>     --
>     Martin Grigorov
>     jWeekend
>     Training, Consulting, Development
>     http://jWeekend.com
>
>     ---------------------------------------------------------------------
>     To unsubscribe, e-mail: users-unsubscribe@wicket.apache.org
>     <ma...@wicket.apache.org>
>     For additional commands, e-mail: users-help@wicket.apache.org
>     <ma...@wicket.apache.org>
>
>
>
>
> ---------------------------------------------------------------------
> To unsubscribe, e-mail: users-unsubscribe@wicket.apache.org
> For additional commands, e-mail: users-help@wicket.apache.org


Re: Javascript in HTML -ta not working when Panel is used within a Wicket ModalWindow

Posted by Michael M <ge...@gmail.com>.
Ok, I just did, thank you! I narrowed it down to the essential stuff, you
will see what's going on, there are two links:

The first one its what does not work, just the panel.
The second one shows you how it should be, but I do not want pages for the
because of scrolling issues and various other reasons.

Michael

2012/8/9 Martin Grigorov <mg...@apache.org>

> Hi,
>
> Please create a quickstart app and someone will try to debug it and help
> you.
>
> On Thu, Aug 9, 2012 at 12:58 PM, Michael M <ge...@gmail.com> wrote:
> > I have several panels that I'm displaying in a ModalWindow. In the html
> > files of those panels I have script-tags in the body, e.g. for
> > SyntaxHighlighter or a JW Player. Those tags work if I embed the panel
> into
> > its own page. However, they are NOT working when the panel is embedded
> into
> > a ModalWindow.
> >
> > Example for a panel (html-file) that displays text which is supposed to
> be
> > processed by SyntaxHighlighter (this is in the body-tag):
> >
> > <wicket:panel>
> >   <pre wicket:id="syntaxHighlighterContent"></pre>
> >   <script type="text/javascript">
> >     SyntaxHighlighter.all();
> >   </script>
> >  </wicket:panel>
> >
> > I've added all the required JS and CSS references in the overridden
> > *renderHead(IHeaderResponse
> > response)* method, by *
> > response.renderJavaScriptReferences("/media/js/shCore.js")* for example.
> > After googling, I also tried the same in an AbstractAjaxBehavior added to
> > the panel instead of adding the references in the Panel-header. I just
> > can't get it to work.
> >
> > When I check the source-code in the browser, the required JS and CSS
> files
> > are referenced (at least in the parent-page of the ModalWindow). Also not
> > JavaScript errors as far as I see them.
> >
> > It's working if I embed the panel into a page and put that page into the
> > ModalWindow instead of the panel, but I want to avoid that because it's
> not
> > necessary and results in scrolling issues. Any help is appreciated, thank
> > you!
>
>
>
> --
> Martin Grigorov
> jWeekend
> Training, Consulting, Development
> http://jWeekend.com
>
> ---------------------------------------------------------------------
> To unsubscribe, e-mail: users-unsubscribe@wicket.apache.org
> For additional commands, e-mail: users-help@wicket.apache.org
>
>

Re: Javascript in HTML -ta not working when Panel is used within a Wicket ModalWindow

Posted by Martin Grigorov <mg...@apache.org>.
Hi,

Please create a quickstart app and someone will try to debug it and help you.

On Thu, Aug 9, 2012 at 12:58 PM, Michael M <ge...@gmail.com> wrote:
> I have several panels that I'm displaying in a ModalWindow. In the html
> files of those panels I have script-tags in the body, e.g. for
> SyntaxHighlighter or a JW Player. Those tags work if I embed the panel into
> its own page. However, they are NOT working when the panel is embedded into
> a ModalWindow.
>
> Example for a panel (html-file) that displays text which is supposed to be
> processed by SyntaxHighlighter (this is in the body-tag):
>
> <wicket:panel>
>   <pre wicket:id="syntaxHighlighterContent"></pre>
>   <script type="text/javascript">
>     SyntaxHighlighter.all();
>   </script>
>  </wicket:panel>
>
> I've added all the required JS and CSS references in the overridden
> *renderHead(IHeaderResponse
> response)* method, by *
> response.renderJavaScriptReferences("/media/js/shCore.js")* for example.
> After googling, I also tried the same in an AbstractAjaxBehavior added to
> the panel instead of adding the references in the Panel-header. I just
> can't get it to work.
>
> When I check the source-code in the browser, the required JS and CSS files
> are referenced (at least in the parent-page of the ModalWindow). Also not
> JavaScript errors as far as I see them.
>
> It's working if I embed the panel into a page and put that page into the
> ModalWindow instead of the panel, but I want to avoid that because it's not
> necessary and results in scrolling issues. Any help is appreciated, thank
> you!



-- 
Martin Grigorov
jWeekend
Training, Consulting, Development
http://jWeekend.com

---------------------------------------------------------------------
To unsubscribe, e-mail: users-unsubscribe@wicket.apache.org
For additional commands, e-mail: users-help@wicket.apache.org