I have a gridpanel with some buttons for each row in the panel. When clicking the buttons, a new Ext.window pops up loading a remote url . Since the remote URL is opened in an iframe, I cannot use Ext.getBody().mask in the parent grid and Ext.getBody().unmask in the iframe, because these are two different pages. The reason I want to do it like this (Ext.getBody().mask in the parent page, and the unmask in the iframe) is because the url loaded in the iframe has a lot of js and images being loaded in the section. Therefore if i use the mask and unmask in the iframe, it will still take a lot of time to load whats in the iframe header, until it gets to the point where I can use the Ext.getBody().mask
My question is: can Ext.getBody().unmask() be used somehow on the parent window? (to hide the mask opened from the parent)?
Thanks,
Dan
try running window.parent.Ext.getBody().unmask() from the iframe.
I assume your iframe has the same origin as the parent.
Related
i am facing a issue.
I have created a images gallery in which the 18 images are showing by default and if user scroll down to the end of page then more images are adding to the gallery through ajax.
Now suppose when user have 18 images and he opens a lightbox then the opend lightbox has 18 images that he can navigate back and forth.
Now if user scroll the page to end the new images are added to the page and i want to add those images to theopened lightbox.
Please suggest a way to acheive this.
Thanks in advance.
Background
When the user clicks an image, the Lightbox script's start() method is called. This will compile the list of images to show, either a single one, or a set if data-lightbox is specified, by going through the page. These are stored in a an array called album on the lightbox object.
If you dynamically load images, then the user click an image to open Lightbox, things should work as expected, as the compilation of images happens on open.
Solution
In your scenario, the Lightbox is already open, and I'm assuming you have a set of images being browsed. You want to let the user continue scrolling while the Lightbox is open and this scrolling will dynamically load more images onto the page that are part of this set.
There is no documented way of doing this. But, you can fix your issue by digging into the internals pretty easily. This is normally not recommended, but no major changes to the Lightbox2 API are expected, so this should be safe (no guarantees though).
On scroll, once new images are loaded, add them to the Lightbox object's album property manually. Then call updateDetails() to refresh the UI.
lightbox.album.push({
link: 'fruit-roll-ups.jpg'
});
lightbox.updateDetails();
I'm having issues with an overlay panel.
The first page loads, you click a link... It pops up an overlay, the router fires a state and controller, and it populates the contents of the overlay.
There is a back button on the overlay, I trigger the overlay to close, call window.history.back() which sends the router off to load the new url (previous url) and it runs it through the router again but obviously refreshes the backing page in doing so.
So the end result is when you press a link, the overlay slides out beautifully, you then press back, the overlay slides back in, it then refreshes the page. You'd think then, why not just say in the controller, if there was an overlay and now there isn't do not change the view content... I can't, as the template stuff gets placed into the ui-view which is remove all my content.
So I need a way of changing the url without running through all of the controller stuff again so to avoid the template being inserted.
Any ideas on how to do this? Or examples of it working somewhere else.
I have a view for which route has been defined. On the view I have a no of images and when I click any of them the Modal Dialog appears with the detail of that image. What I want to do is to change the url only when the modal appears so user can easily share them. And yes, the share url would be another route I will define so when user directly come to that one, the modal pops in. Any suggestion please?
I would not change the URL when a modal appears. A modal is an overlay of your page and actually not a new page with a new URL.
Many image hosters, however, show the URL in a read-only field under the picture so that users can copy it. Maybe this is the way you would like to go.
On the page itself I recommend using $location to determine if there is an imageId in your URL. If so, just invoke the same logic as if a user clicked on that image on the page.
I have web application with master page and content pages. Inside content aspx page I am trying to open a model popup user control ascx page using Ajax ModalPopupExtender.
Inside ascx user control trying to bind data from database using AngularJS.
Initially when I open the user control page, table/grid is not displaying any data.
Using Developer tools IE/Crome when I reload the page, next time it shows the data.
I think DOM is not getting updated in the first display, how can I solve this problem.
Thanks,
Ali
I have a normal article page with a huge image shown as a small one. What i want to do is, when the user click on the image, a new page is rendered and the image is shown at full size of the page (no menus, header, footer, etc.. just page). If the user click again, he will be redirected to the previous page.
How can i do this with joomla? I mean, i could create an html page, but i don't know how can i access it.
Any help would be appreciated,
RR
All you need to do is add this to any link you want to display without all of the module positions -
?tmpl=component
This tells Joomla to load just the component part of the page without anything else around it.
Not sure that anything specifically in Joomla is going to allow you to do that. The only way you can achieve that directly in Joomla would be using a light box type of plugin. When the user clicks the image, it will open up a full size window of the image. When the user click on the image again, it will exit the light box.
Otherwise, you can just edit the source code of the page, and change it to <img src="http://www.pathroyourimage.com/image.png"> . That way when a user clicks the image, they go directly to the picture.