[Okta Webinar] Learn how to a build a cloud-first strategyRegister Now

x
  • Status: Solved
  • Priority: Medium
  • Security: Public
  • Views: 1170
  • Last Modified:

Two Bootstrap Modals to edit two different files content - PHP

First let me start by saying I know this is going to be a really basic question. I am new to PHP and struggling a little with this task.

Intro: I am making a little app on a local WAMP server to manage a basic client database and also manage all my VHOST enntries for development. I know there are security issues with editing Windows Hosts file as I'm about to request but this will be strictly a local site.

I have the following PHP

<?php include 'template-parts/header.php' /** calling of header(to make it uniform in all template file) **/?>  

<div class="container home">
    <h3> Delete </h3>



    <div class="btn-group">
            <button data-toggle="modal" class="btn btn-primary btn-sm" name="hostsedit" data-target="#modalhost"><span class="glyphicon glyphicon-user"></span> Edit Windows Host File</button>
            <button data-toggle="modal" class="btn btn-primary btn-sm" name="vhostsedit" data-target="#modalvhost"><span class="glyphicon glyphicon-trash"></span> Edit VHOST.conf</button>
    </div>


    <?php

        // configuration
        $url = 'delete.php';
        $file = 'C:/Windows/System32/Drivers/etc/hosts';

        // check if form has been submitted
        if (isset($_POST['text']))
        {
        // save the text contents
        file_put_contents($file, $_POST['text']);

        // redirect to form again
        header(sprintf('Location: %s', $url));
        printf('<a href="%s">Moved</a>.', htmlspecialchars($url));
        exit();
    }

    // read the textfile
    $text = file_get_contents($file);   
    ?>


    <!-- Modal 1 -->
    <div class="modal fade" id="modalhost" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
        <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
                <h4 class="modal-title">Delete Host File Entry</h4>
            </div><!-- /modal-header -->
            <div class="modal-body">
                <div class="container-fluid">
                    <div class="row">
                        <div class="col-xs-12 col-md-12">
                            <!-- HTML form -->
                            <form action="" method="post">
                                <textarea name="text" class="form-control" rows="15"><?php echo htmlspecialchars($text) ?></textarea><br />
                                <p><strong>NOTE:</strong> Ensure only lines similar to <kbd>127.0.0.1 www.dev.xxxxx</kbd> are deleted</p>
                        </div>
                    </div>
                </div>                        
            </div><!-- /modal-body -->
            <div class="modal-footer">
                <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
                <button type="submit" class="btn btn-primary">Save changes</button>
            </div> 
            </form>
        </div> <!-- /.modal-content -->
    </div> <!-- /.modal-dialog -->
</div> <!-- /.modal -->


<!-- Modal 2 --> 
<div class="modal fade" id="modalvhost" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
                <h4 class="modal-title">Delete VHOST File Entry</h4>
            </div><!-- /modal-header -->
            <div class="modal-body">
                <div class="container-fluid">
                    <div class="row">
                        <div class="col-xs-12 col-md-12">
                            <!-- HTML form -->
                            <form action="" method="post">
                                <textarea name="text" class="form-control" rows="15"><?php echo htmlspecialchars($text) ?></textarea><br />
                        </div>
                    </div>
                </div>                        
            </div><!-- /modal-body -->
            <div class="modal-footer">
                <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
                <button type="submit" class="btn btn-primary">Save changes</button>
            </div> 
            </form>
        </div> <!-- /.modal-content -->
    </div> <!-- /.modal-dialog -->
</div> <!-- /.modal -->
</div>  
</div>
</body>
</html>

Open in new window


The first modal works perfectly, I click the button

<button data-toggle="modal" class="btn btn-primary btn-sm" name="hostsedit" data-target="#modalhost"><span class="glyphicon glyphicon-user"></span> Edit Windows Host File</button>

Open in new window


and this opens up the Bootstrap Modal, presents the Windows Host file within the textarea and allows me to add and delete at will, I click the modal's save button and it works.

The question I need to acheive this same action with the second modal window however this one needs would need to edit C:/wamp/bin/apache/apache2.4.9/conf/extra/httpd-vhosts.conf'.

I simply don't know how to duplicate the first correctly working PHP to now also work with the VHOST editing requirement.

Any help or pointers would be greatly appreciated.
0
Richard Massey
Asked:
Richard Massey
1 Solution
 
Scott Fell, EE MVEDeveloperCommented:
I would use just one modal  http://jsbin.com/wagir/1
<!DOCTYPE html>
<html>
<head>
<script src="http://code.jquery.com/jquery.min.js"></script>
<link href="http://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css" rel="stylesheet" type="text/css" />
<script src="http://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/js/bootstrap.min.js"></script>
  
  <script>
  $(function(){
    var formOne = '<textarea name="text" class="form-control" rows="15"><?php echo htmlspecialchars($text) ?></textarea><br /><p><strong>NOTE:</strong> Ensure only lines similar to <kbd>127.0.0.1 www.dev.xxxxx</kbd> are deleted</p></div>';
   var formTwo='<textarea name="text" class="form-control" rows="15"><?php echo htmlspecialchars($text) ?></textarea><br /></div>' ;
$('.openModal').click(function(){
  $('#formContent').html('');
  var form = $(this).attr('id');
  $('#myModalLabel').text(form);
  if (form === 'formOne'){
    $('#formContent').html(formOne);
  }else{
     $('#formContent').html(formTwo);
  }
    $('#myModal').modal(open);
});
$('#myModal').on('hidden.bs.modal', function (e) {
  // clear the form
  $('#formContent').html('');
});
});
  </script>
  <meta charset="utf-8">
  <title>padas</title>
</head>
<body>
  
<!-- Button trigger modal -->
<button id="formOne" class="btn btn-primary btn-lg openModal" >
  Launch  form one
</button>
  <button id="formTwo" class="btn btn-primary btn-lg openModal" >
  Launch  form two
</button>

<!-- Modal -->
<div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
  <div class="modal-dialog">
    <div class="modal-content">
      <div class="modal-header">
        <button type="button" class="close" data-dismiss="modal"><span aria-hidden="true">&times;</span><span class="sr-only">Close</span></button>
        <h4 class="modal-title" id="myModalLabel"></h4>
      </div>
      <div class="modal-body">
       <!-- modal content here -->
        <!-- HTML form -->
        <form action="" method="post">
          <div id="formContent"></form>
        </form>
        
      </div>
      <div class="modal-footer">
        <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
        <button type="button" class="btn btn-primary">Save changes</button>
      </div>
    </div>
  </div>
</div>
</body>
</html>

Open in new window

or you could add a 2nd button changing the data-target="#modalhost" to match the id of the 2nd modal.  But one modal is all you need.

Also, your php will generate the html before the browser loads . It is separate from the js which runs after the html is sent to the browser.  It is easy to get that concept mixed up.  You only need to write out your php to get the html  you need as if you hard coded it.
0
 
Richard MasseyAuthor Commented:
Sorry, I'm not entirely sure I explained myself properly... If I understand your response properly, sounds like I was meaning a question specifically about the modals.

The actual issue I am having is the executing of the PHP... Basically I need duplicate the php:
<?php

        // configuration
        $url = 'delete.php';
        $file = 'C:/Windows/System32/Drivers/etc/hosts';

        // check if form has been submitted
        if (isset($_POST['text']))
        {
        // save the text contents
        file_put_contents($file, $_POST['text']);

        // redirect to form again
        header(sprintf('Location: %s', $url));
        printf('<a href="%s">Moved</a>.', htmlspecialchars($url));
        exit();
    }

    // read the textfile
    $text = file_get_contents($file);   
    ?>

Open in new window


As Modal-1 currently uses the above PHP and executes it properly, I need Modal-2 to execute 'almost' identical PHP however the second version of the PHP would be:
<?php

        // configuration
        $url = 'delete.php';
        $file = 'C:/wamp/bin/apache/apache2.4.9/conf/extra/httpd-vhosts.conf';

        // check if form has been submitted
        if (isset($_POST['text']))
        {
        // save the text contents
        file_put_contents($file, $_POST['text']);

        // redirect to form again
        header(sprintf('Location: %s', $url));
        printf('<a href="%s">Moved</a>.', htmlspecialchars($url));
        exit();
    }

    // read the textfile
    $text = file_get_contents($file);   
    ?>

Open in new window



So two modals, two PHP scripts, all performing almost identical actions but when I simply copy and past the PHP for the second modal, the PHP clashes with the first.

I tried changing the Vars but that only resulted in errors.

I am very sorry if this makes no sense, I am new to PHP and getting a little confused with my processes  :-)
0
 
Dave BaldwinFixer of ProblemsCommented:
This isn't clear at all.  If they are separate files, I don't see how they can conflict.  What are the errors?  And while changes in the 'hosts' file take effect almost immediately, changes in "httpd-vhosts.conf" do not take effect until Apache is restarted.
0
What does it mean to be "Always On"?

Is your cloud always on? With an Always On cloud you won't have to worry about downtime for maintenance or software application code updates, ensuring that your bottom line isn't affected.

 
Richard MasseyAuthor Commented:
Sorry guys, I didn't mean to be vague...

The following page probably makes more sense:

<?php include 'template-parts/header.php'; /** calling of header(to make it uniform in all template file) **/

function echoActiveClassIfRequestMatches($requestUri)
{
	$current_file_name = basename($_SERVER['REQUEST_URI'], ".php");
	if ($current_file_name == $requestUri)
	echo 'class="active"';
}
?>	

<div class="page-header">
	<h1>Example page Header <small>Subtext for header</small></h1>
</div>

<div class="container home">
    <h3> Delete </h3>

	<?php include "connection.php" /** calling of connection.php that has the connection code **/ ?>
		<table class="table table-bordered">
              <thead>
                <tr>
                  <th>Client</th>
                  <th>Development URL</th>
				  <th> </th>
                </tr>
              </thead>
              <tbody>
			  <?php 
				$result = mysqli_query($connection, "SELECT * FROM developments") or die ("Query failed: " . mysqli_error($connection));
while ($data = mysqli_fetch_object($result)):
			  ?>
                <tr>
                  <td style="display:none"><?php echo $data->ID ?></td>
                  <td><?php echo $data->clientBusName?></td>
                  <td><?php echo $data->devURL?></td>
				  <td>
					<a href="deleteById.php?id=<?php echo $data->ID ?>"><button class="btn btn-danger btn-sm"><span class="glyphicon glyphicon-trash"></span> Delete </button></a>
				  </td>
                </tr>
			  <?php
				endwhile;
			  ?>
              </tbody>
		</table>

    <div class="btn-group">
            <button data-toggle="modal" class="btn btn-primary btn-sm" name="hostsedit" data-target="#modalhost"><span class="glyphicon glyphicon-user"></span> Edit Windows Host File</button>
            <button data-toggle="modal" class="btn btn-primary btn-sm" name="vhostsedit" data-target="#modalvhost"><span class="glyphicon glyphicon-trash"></span> Edit VHOST.conf</button>
    </div>


    <?php
	// check if form has been submitted
    if (!empty($_POST['hostinput'])){ //i prefer to use empty rather than isset you can read about it

		// configuration
        $url = 'delete.php';
        $file = 'C:/Windows/System32/Drivers/etc/hosts';

        // check if form has been submitted
        if (isset($_POST['hostinput']))
        {
        // save the text contents
        file_put_contents($file, $_POST['hostinput']);

        // redirect to form again
        header(sprintf('Location: %s', $url));
        printf('<a href="%s">Moved</a>.', htmlspecialchars($url));
        exit();
    	}
		// read the textfile
		$text = file_get_contents($file);  
	}
	else if(!empty($_POST['vhostinput'])){
		// configuration
        $url = 'delete.php';
        $file = 'C:/wamp/bin/apache/apache2.4.9/conf/extra/httpd-vhosts.conf';

        // check if form has been submitted
        if (isset($_POST['vhostinput']))
        {
        // save the text contents
        file_put_contents($file, $_POST['vhostinput']);

        // redirect to form again
        header(sprintf('Location: %s', $url));
        printf('<a href="%s">Moved</a>.', htmlspecialchars($url));
        exit();
    	}
		// read the textfile
		$text = file_get_contents($file);  
	}

         
    ?>


    <!-- Modal 1 -->
    <div class="modal fade" id="modalhost" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
        <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
                <h4 class="modal-title">Delete Host File Entry</h4>
            </div><!-- /modal-header -->
            <div class="modal-body">
                <div class="container-fluid">
                    <div class="row">
                        <div class="col-xs-12 col-md-12">
                            <!-- HTML form -->
                            <form action="" method="post">
                                <textarea id="hostinput" name="hostinput" class="form-control" rows="15"><?php echo htmlspecialchars($text) ?></textarea><br />
                                <p><strong>NOTE:</strong> Ensure only lines similar to <kbd>127.0.0.1 www.dev.xxxxx</kbd> are deleted</p>
                        </div>
                    </div>
                </div>                        
            </div><!-- /modal-body -->
            <div class="modal-footer">
                <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
                <button type="submit" class="btn btn-primary">Save changes</button>
            </div> 
            </form>
        </div> <!-- /.modal-content -->
    </div> <!-- /.modal-dialog -->
</div> <!-- /.modal -->


<!-- Modal 2 --> 
<div class="modal fade" id="modalvhost" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
                <h4 class="modal-title">Delete VHOST File Entry</h4>
            </div><!-- /modal-header -->
            <div class="modal-body">
                <div class="container-fluid">
                    <div class="row">
                        <div class="col-xs-12 col-md-12">
                            <!-- HTML form -->
                            <form action="" method="post">
                                <textarea id="vhostinput" name="vhostinput" class="form-control" rows="15"><?php echo htmlspecialchars($text) ?></textarea><br />
                        </div>
                    </div>
                </div>                        
            </div><!-- /modal-body -->
            <div class="modal-footer">
                <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
                <button type="submit" class="btn btn-primary">Save changes</button>
            </div> 
            </form>
        </div> <!-- /.modal-content -->
    </div> <!-- /.modal-dialog -->
</div> <!-- /.modal -->
</div>  

    
<?php include 'template-parts/footer.php' ?>

Open in new window


Each modal needs to reference one of the PHP scripts. Those two scripts conflict with each other even with the if/else statements.

I hope this makes it a bit clearer.
0
 
Dave BaldwinFixer of ProblemsCommented:
They aren't conflicting, you're not telling them what to do.  This line...
<form action="" method="post">

Open in new window

doesn't have a name for the <form>.  That means that when you click on any submit button, both/all form entries are submitted.  Before you do anything else, give each of the forms different names like...
<form action="" method="post" name="form1">
<form action="" method="post" name="form2">

Open in new window

You Always have to do that if you have more than one form on a page.
0
 
Richard MasseyAuthor Commented:
Ok, made the change but I am getting the following error (removed personal info from link):
Notice: Undefined variable: text in C:\Users\xxxxxxx\xxxxxxx\xxxxx\devlogs\delete.php on line 112

Open in new window


This error corresponds to:

<textarea id="hostinput" name="hostinput" class="form-control" rows="15"><?php echo htmlspecialchars($text) ?></textarea><br />

Open in new window


I am sorry, I am quite new to PHP as mentioned.
0
 
Ray PaseurCommented:
If you're new to PHP, you may not yet have enough of the basics down to start on a complex project.  This article should help you get a foundation and find some good learning resources.  And more importantly it will help you avoid the many bad learning resources that litter the internet!
http://www.experts-exchange.com/Web_Development/Web_Languages-Standards/PHP/A_11769-And-by-the-way-I-am-new-to-PHP.html
0
 
Dave BaldwinFixer of ProblemsCommented:
The error in delete.php may be a consequence of getting the forms to submit correctly so you can see the error.  It says that "Undefined variable: text" so $text is the PHP variable on that line.  You probably have not assigned a value to $text, that would be the usual reason.
0
 
Richard MasseyAuthor Commented:
I am sorry if I'm wrong but isn't that what this line does
$text = file_get_contents($file);

Open in new window

0
 
Dave BaldwinFixer of ProblemsCommented:
Yes, it is.  But is it in "delete.php" before line 112?
0
 
Richard MasseyAuthor Commented:
Thanks for the response, got me looking in the right direction
0

Featured Post

[Webinar] Cloud and Mobile-First Strategy

Maybe you’ve fully adopted the cloud since the beginning. Or maybe you started with on-prem resources but are pursuing a “cloud and mobile first” strategy. Getting to that end state has its challenges. Discover how to build out a 100% cloud and mobile IT strategy in this webinar.

Tackle projects and never again get stuck behind a technical roadblock.
Join Now