jQWidgets Forums

Tagged: Angular window, dialog, jqgrid, jquery window, jqxwindow, Leave this Page, ng-include, ngInclude, onbeforeunload, popup, Stay on this Page, window

This topic contains 3 replies, has 3 voices, and was last updated by Dimitar 9 years ago.

Viewing 4 posts - 1 through 4 (of 4 total)

Author

pop up window before refreshing page ? Posts
July 28, 2015 at 9:50 pm pop up window before refreshing page ? #74237
ashwin prabhu
Participant
Hi,

I have a grid data and i have save option to save the grid contents. I want to ensure that user remembers to save the grid data before refreshing or exiting the page. Is there a way i can show a popup giving them an alert on saving the grid data before refreshing or exiting ?

I have the following code using javascript
```
window.onbeforeunload = function() {
				  return "Please ensure to save the file before exiting";
	};
```
This pop up is vague and different than the popups used in jqwidgets. i want to maintain consistency in my page. I have used popups using jqwidgets. Here is that code.
```
// initialize the popup window and buttons.
			\$("#popupWindow").jqxWindow({
				width: 300,
				resizable: false,
				theme: theme,
				isModal: true,
				autoOpen: false,
				
				modalOpacity: .3
			});
```
```
// open the popup window when the user clicks save button.
var offset = \$("#jqxgrid").offset();
							\$("#popupWindow").jqxWindow({
								position: {
									x: parseInt(offset.left) + 360,
									y: parseInt(offset.top) + 60
								}
							});
							// show the popup window.
							\$("#popupWindow").jqxWindow('show');
```
```
this is the html code. 
<div id="popupWindow">
		<div>
			Alert!!!!!
		</div>
		<div style="overflow: hidden;">
			<p>
				Save file
			</p>
		</div>
	
</div>
```
The above code is for saving once user clicks save button. Is there a onbeforeunload kind of thing in jqwidgets ??
July 29, 2015 at 10:43 am pop up window before refreshing page ? #74254

Dimitar
Participant

Hi ashwin prabhu,

Unfortunately, it does not seem to be possible to override the default onbeforeunload dialog. For more information, please refer to the following Stack Overflow answer: http://stackoverflow.com/a/276739.

Best Regards,
Dimitar

jQWidgets team
http://www.jqwidgets.com/

April 6, 2016 at 4:51 am pop up window before refreshing page ? #83166

sudeep
Participant

Hii,
i have tried to load a HTML page in popup using ng-include but it is not loading. that HTML page contain a calender of jqwidgets.here is the code.

<script type=”text/javascript”>
var app=angular.module(“myApp”,[“jqwidgets”]);
app.controller(“calenderController”, function ($scope) {
var dialog;
$scope.imageClick=function(){
alert(“hello”);
dialog.open();
};
$scope.dialogSettings = {
created : function(args) {
dialog = args.instance;
},
resizable : false,
position : {
left : popup.offsetLeft + 300,
top : popup.offsetTop
},
width : 400,
height : 300,
autoOpen : false
};
});
</script>
</head>
<body ng-app=”myApp” ng-controller=”calenderController”>
<center>
<input type=”text”>

</center>
<jqx-window jqx-on-close=”close()” jqx-create=”dialogSettings” jqx-settings=”dialogSettings”>
<div id=”popup”>Edit Dialog</div>
<div style=”overflow: hidden;”>
<div ng-include=” ‘Calender.html’ “></div>
</div>
</jqx-window>
</body>
</html>

April 6, 2016 at 11:28 am pop up window before refreshing page ? #83199

Dimitar
Participant

Hi sudeep,

We have a demo showcasing the ng-include directive you can see here: http://www.jqwidgets.com/jquery-widgets-demo/demos/angularjs-demos/nginclude.htm?light. If you are not able to resolve the issue, please share if there are any errors thrown in your browser’s console.

Best Regards,
Dimitar

jQWidgets team
http://www.jqwidgets.com/
Author

Posts

Viewing 4 posts - 1 through 4 (of 4 total)

You must be logged in to reply to this topic.