You are viewing a plain text version of this content. The canonical link for it is here.
Posted to users@tapestry.apache.org by akshay <ak...@gmail.com> on 2014/09/23 18:12:23 UTC
Problem in using Bootstrap Modal component
Hi,
I am trying to use bootstrap component modal.js. I intend to change to
content of the modal( i.e image in my case) for every execution of this
conditional block given below. But I see that , the content of the modal
("${imageUrl}") in the image tag, is only loaded once and I get to see the
same image for each and every input field, where this block is executed.
Code snippet :-
<t:if test="imageUrl">
<a href="#" class="btn btn-lg" data-toggle="modal"
data-target="#basicModal">Show Example</a>
<div class="modal fade" id="basicModal" tabindex="-1" role="dialog"
aria-labelledby="basicModal" aria-hidden="true">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-body">
<img src="${imageUrl}" style="float: none;" height="500px"
width="500px"></img>
</div>
</div>
</div>
</div>
</t:if>
I read over the internet that modal loads the content only once, and for
this didnt find any solution that would fit my need.
Any kind of help would be highly appreciated.
--
Cheers!!
Akshay
Re: Problem in using Bootstrap Modal component
Posted by George Christman <gc...@cardaddy.com>.
If your modal component is set to show on load, you can just wrap the modal
component with a zone.
On Tue, Sep 23, 2014 at 3:46 PM, Eugen <eu...@gmail.com> wrote:
> Hi,
> put in Your modal-body, around the image, a zone and attach js function to
> the 'show.bs.modal' event of modal. In the function refesh the zone.
>
> best regards
> Eugen
>
> 2014-09-23 19:31 GMT+02:00 akshay <ak...@gmail.com>:
>
> > Hi Sir,
> >
> > Thanks for your response,
> >
> > I believe post over a forum , expects a more polite response than yours.
> >
> > Coming to the point suggested by you, I tried using the remote option
> > before posting into the forum and it didnt work the way, it is supposed
> to
> > be.
> >
> > So rather than putting a complex code snippet, I jotted down the naive
> > approach, so that someone can really help me in knowing the feasible
> > solution.
> >
> > Regarding the effort, I tried the possibilities and has asked the
> question,
> > hoping to get a better response.
> >
> >
> > Thanks and Best Regards
> > Akshay
> >
> >
> >
> > On Tue, Sep 23, 2014 at 6:48 PM, Chris Poulsen <ma...@nesluop.dk>
> > wrote:
> >
> > > I doubt there is any magic going on. If your html output is correct
> then
> > it
> > > should work like advertised. You seem to be talking about the modal
> > remote
> > > option, but that is not used in your pasted code (which is close to
> > > absolutely useless anyway, please put in an effort if you expect others
> > to
> > > try and help you).
> > >
> > > I suggest you read the docs for bootstrap modal, and then make sure
> that
> > > your html is correct.
> > >
> > > --
> > > Chris
> > >
> > > On Tue, Sep 23, 2014 at 6:12 PM, akshay <ak...@gmail.com>
> > wrote:
> > >
> > > > Hi,
> > > >
> > > > I am trying to use bootstrap component modal.js. I intend to change
> to
> > > > content of the modal( i.e image in my case) for every execution of
> > this
> > > > conditional block given below. But I see that , the content of the
> > modal
> > > > ("${imageUrl}") in the image tag, is only loaded once and I get to
> see
> > > the
> > > > same image for each and every input field, where this block is
> > executed.
> > > >
> > > > Code snippet :-
> > > >
> > > > <t:if test="imageUrl">
> > > > <a href="#" class="btn btn-lg" data-toggle="modal"
> > > > data-target="#basicModal">Show Example</a>
> > > >
> > > > <div class="modal fade" id="basicModal" tabindex="-1" role="dialog"
> > > > aria-labelledby="basicModal" aria-hidden="true">
> > > > <div class="modal-dialog">
> > > > <div class="modal-content">
> > > >
> > > > <div class="modal-body">
> > > > <img src="${imageUrl}" style="float: none;" height="500px"
> > > > width="500px"></img>
> > > > </div>
> > > >
> > > > </div>
> > > > </div>
> > > > </div>
> > > > </t:if>
> > > >
> > > > I read over the internet that modal loads the content only once, and
> > for
> > > > this didnt find any solution that would fit my need.
> > > >
> > > > Any kind of help would be highly appreciated.
> > > >
> > > > --
> > > > Cheers!!
> > > > Akshay
> > > >
> > >
> >
> >
> >
> > --
> > Cheers!!
> > Akshay
> >
>
--
George Christman
www.CarDaddy.com
P.O. Box 735
Johnstown, New York
Re: Problem in using Bootstrap Modal component
Posted by Eugen <eu...@gmail.com>.
Hi,
put in Your modal-body, around the image, a zone and attach js function to
the 'show.bs.modal' event of modal. In the function refesh the zone.
best regards
Eugen
2014-09-23 19:31 GMT+02:00 akshay <ak...@gmail.com>:
> Hi Sir,
>
> Thanks for your response,
>
> I believe post over a forum , expects a more polite response than yours.
>
> Coming to the point suggested by you, I tried using the remote option
> before posting into the forum and it didnt work the way, it is supposed to
> be.
>
> So rather than putting a complex code snippet, I jotted down the naive
> approach, so that someone can really help me in knowing the feasible
> solution.
>
> Regarding the effort, I tried the possibilities and has asked the question,
> hoping to get a better response.
>
>
> Thanks and Best Regards
> Akshay
>
>
>
> On Tue, Sep 23, 2014 at 6:48 PM, Chris Poulsen <ma...@nesluop.dk>
> wrote:
>
> > I doubt there is any magic going on. If your html output is correct then
> it
> > should work like advertised. You seem to be talking about the modal
> remote
> > option, but that is not used in your pasted code (which is close to
> > absolutely useless anyway, please put in an effort if you expect others
> to
> > try and help you).
> >
> > I suggest you read the docs for bootstrap modal, and then make sure that
> > your html is correct.
> >
> > --
> > Chris
> >
> > On Tue, Sep 23, 2014 at 6:12 PM, akshay <ak...@gmail.com>
> wrote:
> >
> > > Hi,
> > >
> > > I am trying to use bootstrap component modal.js. I intend to change to
> > > content of the modal( i.e image in my case) for every execution of
> this
> > > conditional block given below. But I see that , the content of the
> modal
> > > ("${imageUrl}") in the image tag, is only loaded once and I get to see
> > the
> > > same image for each and every input field, where this block is
> executed.
> > >
> > > Code snippet :-
> > >
> > > <t:if test="imageUrl">
> > > <a href="#" class="btn btn-lg" data-toggle="modal"
> > > data-target="#basicModal">Show Example</a>
> > >
> > > <div class="modal fade" id="basicModal" tabindex="-1" role="dialog"
> > > aria-labelledby="basicModal" aria-hidden="true">
> > > <div class="modal-dialog">
> > > <div class="modal-content">
> > >
> > > <div class="modal-body">
> > > <img src="${imageUrl}" style="float: none;" height="500px"
> > > width="500px"></img>
> > > </div>
> > >
> > > </div>
> > > </div>
> > > </div>
> > > </t:if>
> > >
> > > I read over the internet that modal loads the content only once, and
> for
> > > this didnt find any solution that would fit my need.
> > >
> > > Any kind of help would be highly appreciated.
> > >
> > > --
> > > Cheers!!
> > > Akshay
> > >
> >
>
>
>
> --
> Cheers!!
> Akshay
>
Re: Problem in using Bootstrap Modal component
Posted by akshay <ak...@gmail.com>.
Hi Sir,
Thanks for your response,
I believe post over a forum , expects a more polite response than yours.
Coming to the point suggested by you, I tried using the remote option
before posting into the forum and it didnt work the way, it is supposed to
be.
So rather than putting a complex code snippet, I jotted down the naive
approach, so that someone can really help me in knowing the feasible
solution.
Regarding the effort, I tried the possibilities and has asked the question,
hoping to get a better response.
Thanks and Best Regards
Akshay
On Tue, Sep 23, 2014 at 6:48 PM, Chris Poulsen <ma...@nesluop.dk>
wrote:
> I doubt there is any magic going on. If your html output is correct then it
> should work like advertised. You seem to be talking about the modal remote
> option, but that is not used in your pasted code (which is close to
> absolutely useless anyway, please put in an effort if you expect others to
> try and help you).
>
> I suggest you read the docs for bootstrap modal, and then make sure that
> your html is correct.
>
> --
> Chris
>
> On Tue, Sep 23, 2014 at 6:12 PM, akshay <ak...@gmail.com> wrote:
>
> > Hi,
> >
> > I am trying to use bootstrap component modal.js. I intend to change to
> > content of the modal( i.e image in my case) for every execution of this
> > conditional block given below. But I see that , the content of the modal
> > ("${imageUrl}") in the image tag, is only loaded once and I get to see
> the
> > same image for each and every input field, where this block is executed.
> >
> > Code snippet :-
> >
> > <t:if test="imageUrl">
> > <a href="#" class="btn btn-lg" data-toggle="modal"
> > data-target="#basicModal">Show Example</a>
> >
> > <div class="modal fade" id="basicModal" tabindex="-1" role="dialog"
> > aria-labelledby="basicModal" aria-hidden="true">
> > <div class="modal-dialog">
> > <div class="modal-content">
> >
> > <div class="modal-body">
> > <img src="${imageUrl}" style="float: none;" height="500px"
> > width="500px"></img>
> > </div>
> >
> > </div>
> > </div>
> > </div>
> > </t:if>
> >
> > I read over the internet that modal loads the content only once, and for
> > this didnt find any solution that would fit my need.
> >
> > Any kind of help would be highly appreciated.
> >
> > --
> > Cheers!!
> > Akshay
> >
>
--
Cheers!!
Akshay
Re: Problem in using Bootstrap Modal component
Posted by Muhammad Gelbana <m....@gmail.com>.
If I understood your case correctly. You need to put your modal div in a
zone so you can update it when you submit the first modal.
*---------------------*
*Muhammad Gelbana*
http://www.linkedin.com/in/mgelbana
On Tue, Sep 23, 2014 at 7:48 PM, Chris Poulsen <ma...@nesluop.dk>
wrote:
> I doubt there is any magic going on. If your html output is correct then it
> should work like advertised. You seem to be talking about the modal remote
> option, but that is not used in your pasted code (which is close to
> absolutely useless anyway, please put in an effort if you expect others to
> try and help you).
>
> I suggest you read the docs for bootstrap modal, and then make sure that
> your html is correct.
>
> --
> Chris
>
> On Tue, Sep 23, 2014 at 6:12 PM, akshay <ak...@gmail.com> wrote:
>
> > Hi,
> >
> > I am trying to use bootstrap component modal.js. I intend to change to
> > content of the modal( i.e image in my case) for every execution of this
> > conditional block given below. But I see that , the content of the modal
> > ("${imageUrl}") in the image tag, is only loaded once and I get to see
> the
> > same image for each and every input field, where this block is executed.
> >
> > Code snippet :-
> >
> > <t:if test="imageUrl">
> > <a href="#" class="btn btn-lg" data-toggle="modal"
> > data-target="#basicModal">Show Example</a>
> >
> > <div class="modal fade" id="basicModal" tabindex="-1" role="dialog"
> > aria-labelledby="basicModal" aria-hidden="true">
> > <div class="modal-dialog">
> > <div class="modal-content">
> >
> > <div class="modal-body">
> > <img src="${imageUrl}" style="float: none;" height="500px"
> > width="500px"></img>
> > </div>
> >
> > </div>
> > </div>
> > </div>
> > </t:if>
> >
> > I read over the internet that modal loads the content only once, and for
> > this didnt find any solution that would fit my need.
> >
> > Any kind of help would be highly appreciated.
> >
> > --
> > Cheers!!
> > Akshay
> >
>
Re: Problem in using Bootstrap Modal component
Posted by Chris Poulsen <ma...@nesluop.dk>.
I doubt there is any magic going on. If your html output is correct then it
should work like advertised. You seem to be talking about the modal remote
option, but that is not used in your pasted code (which is close to
absolutely useless anyway, please put in an effort if you expect others to
try and help you).
I suggest you read the docs for bootstrap modal, and then make sure that
your html is correct.
--
Chris
On Tue, Sep 23, 2014 at 6:12 PM, akshay <ak...@gmail.com> wrote:
> Hi,
>
> I am trying to use bootstrap component modal.js. I intend to change to
> content of the modal( i.e image in my case) for every execution of this
> conditional block given below. But I see that , the content of the modal
> ("${imageUrl}") in the image tag, is only loaded once and I get to see the
> same image for each and every input field, where this block is executed.
>
> Code snippet :-
>
> <t:if test="imageUrl">
> <a href="#" class="btn btn-lg" data-toggle="modal"
> data-target="#basicModal">Show Example</a>
>
> <div class="modal fade" id="basicModal" tabindex="-1" role="dialog"
> aria-labelledby="basicModal" aria-hidden="true">
> <div class="modal-dialog">
> <div class="modal-content">
>
> <div class="modal-body">
> <img src="${imageUrl}" style="float: none;" height="500px"
> width="500px"></img>
> </div>
>
> </div>
> </div>
> </div>
> </t:if>
>
> I read over the internet that modal loads the content only once, and for
> this didnt find any solution that would fit my need.
>
> Any kind of help would be highly appreciated.
>
> --
> Cheers!!
> Akshay
>