Avatar of Richard Korts
Richard KortsFlag for United States of America

asked on 

Javascript question

Please look at this code:

<script>
   steps = "<? print $_SESSION['use_steps']; ?>";
   user = <? print $_SESSION['user']; ?>;
   fname = "<? print $fname; ?>";
   fnue = "<? print $fnue; ?>";
   ac = "";
   fr = "<? print $fr; ?>";
   ems = "<? print $_GET['ems']; ?>";
   loc = "<? print $loc; ?>";
   function open_pdf_win() {
      str = loc + fname;   
      window.open(str);
   }
   function ask_email() {
      window.open("email_pdf_new.php?f=" + fnue);
      self.close();
      if (steps) {
         window.location = "choose_property_us.php?prop=" + fname;
      } else {
         window.location = "choose_property.php?prop=" + fname;
      }   
   }
   </script>
</head>
   <body onLoad="ask_email();open_pdf_win();">

</body>
</html>

This is at the end of a php script. The javascript function ask_email() used to have a confirm asking if the email should be sent. The customer asked that I change it so that the email is always sent, so it looks like this.

When I test it from my computer, it works fine. The customer says it does NOT work form him, using an iPad. I am wondering if there might be an issue with the self.close() occurring too quickly if no confirm to stop processing until the user answers is present. Or other issues?

Thank you.
HTMLJavaScript

Avatar of undefined
Last Comment
Richard Korts
Avatar of Richard Korts
Richard Korts
Flag of United States of America image

ASKER

Sorry, forgot to include these lines that PRECEDE the code initially posted:

<!DOCTYPE html>

<html>
<head>
<title>Print Single Form</title>
<meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css">
    <link rel="stylesheet" href="//code.jquery.com/ui/1.11.4/themes/smoothness/jquery-ui.css">

    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.min.js"></script>

    <script src="//code.jquery.com/jquery-1.10.2.js"></script>
    <script src="//code.jquery.com/ui/1.11.4/jquery-ui.js"></script>
    <link rel="stylesheet" href="/resources/demos/style.css">

    <title>Backflow Assembly & Test Report Form</title>
    <style>
        .nopadding {
            padding: 0 !important;
            margin: 0 !important;
        }
       
        .wrapper {
            max-width: 767px;
            min-width: 480px;
            margin: 0 auto;
        }
    </style>
Avatar of Julian Hansen
Julian Hansen
Flag of South Africa image

Hi Richard,

Instead of the window.open on line try this

function ask_email() {
  const url = email_pdf_new.php?f=" + fnue
  fetch(url)
    .then(() => {
      const final = steps 
        ? "choose_property_us.php" 
        : "choos_property.php";
      window.location = final + "?prop=" + fname;
    })
}

Open in new window

What we are doing in the above is using the Browser fetch() function to make an AJAX call back to the server to send the email - the window is redirected only after this has completed.

This will ensure that your email_pdf_new.php script completes before the rest of the code is run it also means you don't have to open another window and then close it again.

If this still does not work then we need to look at what "not working" means. Whether it means the script is not working or whether the client is not receiving the email. It is possible the email is being sent but is being bounced somewhere along the line due to reputation or SPAM issues.

Instead of "self.close();"   please use below line and try.

open(location, '_self').close();

Open in new window

Avatar of leakim971
leakim971
Flag of Guadeloupe image

check end of the page :
<!DOCTYPE html>
<html>
<head>
    <title>Print Single Form</title>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css">
    <link rel="stylesheet" href="//code.jquery.com/ui/1.11.4/themes/smoothness/jquery-ui.css">

    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.min.js"></script>

    <script src="//code.jquery.com/jquery-1.10.2.js"></script>
    <script src="//code.jquery.com/ui/1.11.4/jquery-ui.js"></script>
    <link rel="stylesheet" href="/resources/demos/style.css">

    <title>Backflow Assembly & Test Report Form</title>
    <style>
        .nopadding {
            padding: 0 !important;
            margin: 0 !important;
        }

        .wrapper {
            max-width: 767px;
            min-width: 480px;
            margin: 0 auto;
        }
    </style>
</head>
<body>

<script>
    <?php
        //open the pdf win
        print 'window.open("' . $loc . $fname '")';
        // check step
        if ($_SESSION['use_steps']) {
            // maybe use a JS setTimeout to open to change location to give time to the PDF to open
            print 'window.location = "choose_property_us.php?prop=' . $fname . ';';
        } else {
            // maybe use a JS setTimeout to open to change location to give time to the PDF to open
            print 'window.location = "choose_property.php?prop=' . $fname . ';';
        }
        // send email without asking permission
        include_once "email_pdf_new.php"; // you should use/read $fnue inside
    ?>
</script>
</body>
</html>

Open in new window


Avatar of Richard Korts
Richard Korts
Flag of United States of America image

ASKER

Julian,

You mean like this?

function ask_email() {
      const url = email_pdf_new.php?f=" + fnue
        fetch(url)
         .then(() => {
           const final = steps
            ? "choose_property_us.php"
            : "choos_property.php";
           window.location = final + "?prop=" + fname;
         })
      self.close();
   }
Avatar of Julian Hansen
Julian Hansen
Flag of South Africa image

No - the self.close() does not do anything - a window cannot close itself

Refer documentation on close() 
From this

his method can only be called on windows that were opened by a script using the  Window.open() method. If the window was not opened by a script, an error  similar to this one appears in the console:  Scripts may not close windows that were not opened by script. 

What was more likely your problem was the navigating away from the page before the window open completed.

What you are doing is using the window.open() to call a server script - which is effectively an AJAX call. What my script is suggesting is rather make it a bona fide AJAX call using the fetch() function and when that completes then do the redirect.
Avatar of leakim971
leakim971
Flag of Guadeloupe image

@Richard,

Now that your customer asked to always send the email, why do you want to do that with JavaScript ?
You should be able to send the email directly with PHP when loading your page, no need to open a separate browser window or using Ajax.
...or maybe I missed something.

Avatar of Richard Korts
Richard Korts
Flag of United States of America image

ASKER

Julian, so just eliminate the self.close()?

LeKim971,

Yes, that is obvious, I could not see the forest for the trees. But I need to open another browser tab with the pdf displayed therein & focus transferred to it. The other tab, choose_property or choose_property_us needs to be n a browser tab so when the user closes the pdf window, that is where they are.

Thank you both.

Richard
Avatar of Julian Hansen
Julian Hansen
Flag of South Africa image

Yes, the self.close() does nothing here.

For your PDF if you send the PDF back to the browser with the right headers the browser will show the save as dialog and give you the option to open it - which will be in a new tab.

Let me know if you need more information on how to do this.
Avatar of Richard Korts
Richard Korts
Flag of United States of America image

ASKER

Julian,

I did what I thought was right, attached HTML, displayed in browser a blank page.

What am I doing wrong?

I put the prior version back, it opens the pdf in a new browser window and has the proper page left in the prior window and sends the email.

What did I do wrong?

I think I'll try an all php version per LeKim971.

Thank you,

Richard

print_form.html
@Richard, Did you check my given workout? if not work, please let us know with exact error/exception or requirement.
https://www.experts-exchange.com/questions/29218204/Javascript-question.html#a43301790 
ASKER CERTIFIED SOLUTION
Avatar of Julian Hansen
Julian Hansen
Flag of South Africa image

Blurred text
THIS SOLUTION IS ONLY AVAILABLE TO MEMBERS.
View this solution by signing up for a free trial.
Members can start a 7-Day free trial and enjoy unlimited access to the platform.
See Pricing Options
Start Free Trial
Avatar of Richard Korts
Richard Korts
Flag of United States of America image

ASKER

Julian,

It worked!!

Thank you,

Richard
Avatar of Julian Hansen
Julian Hansen
Flag of South Africa image

You are welcome Richard - just wondering why you selected the comment above as the answer?
If you are going to be using the AJAX route (which is the correct way to do this) then closing a window becomes null and void?

Avatar of Richard Korts
Richard Korts
Flag of United States of America image

ASKER

I accidentally selected the comment above. I could not see any way to undo that in the magical EE interface, so I just awarded you the most points. It seems inane that I have to waste time figuring out that thing (if it EVEN IS undoable).

As an aside, the EE interface becomes more complex every time they change it. Sometimes the old saying in the USA, "if it ain't broke, don't fix it" may apply.

Sorry,

Richard
Avatar of Richard Korts
Richard Korts
Flag of United States of America image

ASKER

I tried to award Julian for the question.

Of course, no way to make comments.

I am a HUGE advocate of EE, but PLEASE don’t work on making it more difficult to interact with.

I guess you have me in your clutches. You can force all kinds of roadblocks on questioners but I will still use the site because of the quality of the experts, in spite of your attempts to make the process more difficult.
JavaScript
JavaScript

JavaScript is a dynamic, object-based language commonly used for client-side scripting in web browsers. Recently, server side JavaScript frameworks have also emerged. JavaScript runs on nearly every operating system and in almost every mainstream web browser.

127K
Questions
--
Followers
--
Top Experts
Get a personalized solution from industry experts
Ask the experts
Read over 600 more reviews

TRUSTED BY

IBM logoIntel logoMicrosoft logoUbisoft logoSAP logo
Qualcomm logoCitrix Systems logoWorkday logoErnst & Young logo
High performer badgeUsers love us badge
LinkedIn logoFacebook logoX logoInstagram logoTikTok logoYouTube logo