jQuery UI Widgets Forums Grid pop up window before refreshing page ?

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

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

  • 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 ??


    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/


    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”>
    datesrc
    </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>


    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/

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

You must be logged in to reply to this topic.