Including file from PHP inside dialogbox of jQuery is misleading javascript

Question

I have 3 files (file1.php, file2.php and file3.php). Their contents are given below. When I load file1.php it shows two times the message of "Hello" in an alert box. But when I include file3.php before or after dialogbox (which is in file2.php) then it shows that message only one times (which is what I want).

Does anybody know where is the problem please?

Thanks.

The content of file1.php

<?php 
     some operations
     require_once("file2.php");
?>

The content of file2.php

<script type="text/javascript">
   $(document).ready(function() {
       var dialogOpts={        
         autoOpen: true,
         modal: false,
         height: "auto",
         resizable: false,
         closeOnEscape: true,
         width: 700,
         position: ["center",30]
       }
       $('#learning_activity_wizard_dialog').dialog(dialogOpts);
   });
</script>
<?php 
     some operations         
?>
<div id="learning_activity_wizard_dialog" title="Learning Activity Wizard" class="dialogbox">
    some content
    <?php require_once("file3.php"); ?>
</div>

The content of file3.php

<script type="text/javascript">
  $(function () {
      alert('Hello');
  });
</script>
sometext

in file2.php you're missing a closing PHP tag around the include for file3.php — Kerry Jones
– Kerry Jones, Commented Jun 21, 2011 at 19:23
@Kerry. I made error when typing here in stackoverflow, sorry. — Bakhtiyor
– Bakhtiyor, Commented Jun 21, 2011 at 19:25
Why do you want to have javascript inside of the dialog element? Can you move it elsewhere? — Niklas
– Niklas, Commented Jun 21, 2011 at 19:25
I am include file3.php inside dialogbox (of file2.php) because file3.php has a lot of coding beside alert("Hello"); and I wanted to separate it in order to make a code more readable. Besides file3.php I have file4.php and file5.php also included inside file2.php — Bakhtiyor
– Bakhtiyor, Commented Jun 21, 2011 at 19:36

Mike Ruhlin · Accepted Answer · 2011-06-21 19:25:47Z

3

When jQuery creates the dialog box, it copies everything in the learning_activity_wisard_dialog div to a new DOM node, including the script tag.

So, the tag runs once when the page loads, then again when the dialog is rendered. Move your script out of that div, or just use some bool to track whether it's already run or not.

answered Jun 21, 2011 at 19:25

Mike Ruhlin

3,5562 gold badges24 silver badges31 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Naftali · Accepted Answer · 2011-06-21 19:26:05Z

3

When you do $('#learning_activity_wizard_dialog').dialog(dialogOpts); it will run the script again.

If you do not want this to happen, move that script tag out of the div that will later become a dialog.

answered Jun 21, 2011 at 19:26

Naftali

147k41 gold badges247 silver badges304 bronze badges

Comments

Boopathi Rajaa · Accepted Answer · 2011-06-22 01:50:46Z

2

http://jsfiddle.net/uRhQT/

i guess this is your problem, adding script tag inside a html that will load again using jquery.

The solution to this what you have only ... use the script outside the div.

Reason: The script tag content is executed when defined inline. So When your dialogbox is shown, the contents are copied to the dialogbox which makes it new inline script. So it gets executed and another alert box is shown.

edited Jun 22, 2011 at 1:50

answered Jun 21, 2011 at 19:34

Boopathi Rajaa

4,7312 gold badges33 silver badges54 bronze badges

Collectives™ on Stack Overflow

Including file from PHP inside dialogbox of jQuery is misleading javascript

3 Answers 3

Comments

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related