Showing a webpage in popup in Angular app - javascript

I'm developing an Angular App with some page which has a table. In the table there is a row with a URL, Accept/Reject buttons. Based on the information in the page with the URL, I must accept or reject. I don't want this page to open in a new window. Is there a way to show this page in a modal window in Angular ? All I found is showing some json data etc but not a page.

AngularUI bootstrap has a ngModal module, you can use that to display the table in a modal pop-up with buttons and what not. Check it out.

Related

Ionic - Open some URL into modal

I'm not sure if this is even possible but, I have a button (Add event to calendar).
This button should let the user create an entry to his Google calendar.
For this, I have to open somewhere this URL
My concern here is that I don't want the user to "quit" the main page (where the button is placed). So opening it in a new tab is not an option.
So I'm wondering if it is possible to open it in ion-modal or anything else that keeps the user with the page.
If your app is based on cordova you can use In App Browser to load a url within the app.
If you are using capacitor you can use Browser Plugin, same purpose.

angularjs one or more custom popup in all pages

My angularjs app has one or more quick links in all pages, each quick links need to show popup window.
Each popup has its own html, controller and service.
So, how to implement this, there are more than one popups which may need to display in most of the pages. popup must appear above the current view and should leave focus to below page after closing the popup.
also please advice me how to loaded these controllers and service JS files by Lazy Loading (Resolve).
is it possible to implement this by adding a extra ui-view for modal popup.
I have implemented the same using stick state Modal of UI-Router Extras
https://github.com/christopherthielen/ui-router-extras
demo link
http://plnkr.co/edit/qgt0RkEnXDPDTdMJPIfy?p=preview

Loading Images From a Link without Refreshing Page

I created some widgets in my Wordpress theme, I want create representation for some of my widget fields, For example I create Twitter widget, it is contain the VIDEO_ID field, I created link named (info),
I want when anyone don't Know how get twitter VIDEO_ID, Then click on (info) link, to show it the explanation image on screen without refresh page.
How I can Show images by clicking on info link to show images without refresh the page and then click on close button to close the image?
use a Modal to present your image.
You can refer to bootstrap modal http://www.w3schools.com/bootstrap/bootstrap_modal.asp

AngularJS : dialog as ng view

Assuming we have a single page with full screen background and couple of links on the top of the page.
I know how to load partial html pages in a container using angularjs and routing configuration but now the scenario is a bit different.
I'm looking for a way that each time user clicks on the application'link load the content in the modal dialog.User able to close the dialog but if user clicks link or changes routing the appropriate content to be load and show in the dialog.
My point is not just showing the dialog using angular.For example I want to if user changes the route to www.sitename.com/#about web-application loads about in the dialog and show it.
Is it possible?

Open redirect page in new tab and reopen in the same tab on multiple redirects Django

I am making a blog app in Django and I want to do the following things
When the user submits the preview button I want to open the partially completed blog in a new tab in the same window.
Secondly if the user does not close the tab and again presses preview button, I want to display the updated blog in the tab which was previously opened.
How can I do this?
Edit:
As told in the answer below I am trying to use this code snippet to open it in a new window, but this does not work
<script>
var current_link = $(location).attr('href');
$('.preview_button').onClick(function() {
window.open(current_link,'preview_tab');
});
</script>
Also I currently have 3 submit buttons and I want to provide this feature only for 1 submit button i.e. preview So I cannot directly do (#form).onSubmit. For the the other two buttons, one updates the content via Ajax and the other redirects to a new page.
Try using a Javascript onSubmit to open the appropriate preview page with window.open, passing a name as the second parameter. It does almost exactly that. (If you want to support having different preview tabs associated with different editing tabs, include something in the name based on a tab ID of some kind -- maybe the article ID plus a random number, or something.)
You'll have to also send the updated content into the server via AJAX.

Categories