We Keep Coding

How can we prevent user using Print button from Adobe Menu in LiveCycle xfa Form using JavaScript?

I want to user to use print button on the form not on the adobe menu? How can I disable and pass error message every time user click the print button from adobe menu? using JavaScript for Xfa forms that are developed in LiveCycle.

A workaround would be to check for a variable in the prePrint event, that you only fill when clicking the button. So if the user clicks on the menu the variable won't be filled and you can cancel the print process and show an error msg.
So for example in the prePrint event:
//Set a variable (buttonClicked) to true prior in the `click` event of your print button
if(!buttonClicked) {//if the menu print was used cancel and show error
xfa.event.cancelAction = 1; //Prevent printing
xfa.host.messageBox("This is a message", "This is a title", 3, 1);
}
What I usually do is calling any function I need in the prePrint event, this way it doesn't matter if the user clicks on the adobe menu print or not. And in case I want to print a specific way, I first cancel the print action and then print programtically with the parameters I need.

How do I ask for confirmation before changing tabs using Bootstrap 3 tabs?

I have the standard tabs setup using Bootstrap 3. Each tab is a form into which the user inputs information. Now there is a save button at the bottom of each form which will save the information in the current tab, but what I'm looking to do is enable the user to click a different tab at the top of the page, and be given a warning of
var areYouSure = confirm('If you sure you wish to leave this tab? Any data entered will NOT be saved. To save information, use the Save buttons.');
with an OK or Cancel button. If they click OK then they go to the tab they clicked, and if they hit cancel, they stay on the current tab. Anybody any idea how I can do this? I've been trying to get this all day, but with no luck. Should I even be using Bootstrap tabs or would it be easier to build my own tabs functionality instead of over-riding bootstrap's tabs?

Per the Bootstrap 3 docs, you can set up something like this. In your tab button listener, show a confirm box, then add logic to handle that response:
$('#myTabs a').click(function (e) {
e.preventDefault()
var areYouSure = confirm('If you sure you wish to leave this tab? Any data entered will NOT be saved. To save information, use the Save buttons.');
if (areYouSure === true) {
$(this).tab('show')
} else {
// do other stuff
return false;
}
})

You could add a class to your tabs and then use an on click function where you'd fire a modal or bootbox confirm asking the user if they want to continue to the new tab. If they select no, you prevent the new tab from loading, if they select yes, you continue.
https://api.jquery.com/click/
http://bootboxjs.com/examples.html

Preempt moving to another page with a pop-up

Let's say I have an update page in HTML5 and if the user edited a field, I want to show a pop-up whenever the user will exit the page (by clicking on another link) without clicking the update button. The pop-up will confirm if the user wants to save his edits or if the user declined, simply continue on the link he clicked before. How to achieve this in HTML5/JavaScript? Is there any function that preempts redirects? Thanks.

Use the onbeforeunload event.
Check out the demo: onbeforeunload Demo
JS code:
<script language="JavaScript">
window.onbeforeunload = confirmExit;
function confirmExit()
{
return "You have attempted to leave this page. If you have made any changes to the fields without clicking the Save button, your changes will be lost. Are you sure you want to exit this page?";
}
</script>

PHP Calculator - Show results on page and in Ajax Popup

UPDATE - this was solved by adding $('.popup-with-form').magnificPopup('open'); to the StateChanged function in the JS. Thanks to #Bollis.
Original Question:
I have a simple calculator here: http://www.roofingcalculator.org/popup/popup.htm
when click on "Calculate" button, i need results to be displayed on that page AND initiate Ajax Popup (Magnific inline) with results displayed in popup as well.
Question: How do i make it so that pressing "calculate" button would both of these at the same time:
1) display results on page
2) Launch pupup with results of calculator
Right now, to show Popup, user needs to click on the link "Open Form".
If you open popup AND don't click "calculte" button, no results are displayed.
If you click Calculate first and then open popup, results are shown on both the page and in popup (see image).
The two things that initiate popup are:
<a class="popup-with-form" href="#test-form">
If i add class="popup-with-form" and href="#test-form" to the Calculate button, it launches popup, but no calculation is done.
All codes for calculator (JS / PHP) can be seen here.
Here is AJAX code that opens popup (i think)
$(document).ready(function() {
$('.popup-with-form').magnificPopup({
type: 'inline',
preloader: false,
focus: '#name',
// When elemened is focused, some mobile browsers in some cases zoom in
// It looks not nice, so we disable it:
callbacks: {
beforeOpen: function() {
if($(window).width() < 700) {
this.st.focus = false;
} else {
this.st.focus = '#name';
}
}
}
});
});

Try adding onsubmit="openPopupFunctionHere()" to your form tag. The onsubmit event will be triggered whenever the form should submit, which happens when you press the "Calculate" button.

How to disable browser back button [duplicate]

This question already has answers here:
Disabling Back button on the browser [closed]
(12 answers)
Closed 8 years ago.
I have web app which contains iframe. In main part client communicates with server by ajax, additionally i added beforeunload = function(){ return "something";} , so when user clicks browser back button alert will appear, when user clicks leave the page, he will lose session and login page will show. In iframe part i use servlet, so when user clicks browser back button alert won't appear because only iframe page will unload. Now what i want to achieve. While user is manipulating in iframe, when he clicks browser back button then alert should appear and when user click leave page i want to log off whole app. When he clicks don't leave page inside iframe shouldn't reload.
I tried to solve this using two events beforeunload and unload.
This is inside iframe:
var confirm = false;
var clicked = true;
$(window).on('beforeunload', function(evt){
if(confirm){
return "Text";
} else {
clicked = false;
}
});
$(window).on('unload',function(evt){
if(clicked){
$(this).off('beforeunload');
window.parent.location = window.parent.location + "/error";
}
});
Now when user manipulating in iframe clicks back button browser, alert appears. When clicks leave page is working good, log out. But when clicks don't leave, the page in iframe will back to earlier and i don't why:(. I want to prevent it.

One cannot disable the browser back button functionality only thing that can be done is prevent them.
Below is the JavaScript snippets that needs to be placed in the head section of the page where you don’t want the user to revisit using the back button
<script type = "text/javascript" >
function preventBack(){window.history.forward();}
setTimeout("preventBack()", 0);
window.onunload=function(){null};
</script>
Suppose there are two pages Page1.aspx and Page2.aspx and Page1.aspx redirects to Page2.aspx
Hence to prevent user from visiting Page1.aspx using Back Button you will need to place the above script in the head section of Page1.aspx as shown below.
Here is the original article: http://www.aspsnippets.com/Articles/Disable-Browser-Back-Button-Functionality-using-JavaScript.aspx