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.
Richard MasseyWeb DesignerAsked:
Who is Participating?
I wear a lot of hats...

"The solutions and answers provided on Experts Exchange have been extremely helpful to me over the last few years. I wear a lot of hats - Developer, Database Administrator, Help Desk, etc., so I know a lot of things but not a lot about one thing. Experts Exchange gives me answers from people who do know a lot about one thing, in a easy to use platform." -Todd S.

Scott Fell, EE MVEDeveloper & EE ModeratorCommented:
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 MasseyWeb DesignerAuthor 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
Ultimate Tool Kit for Technology Solution Provider

Broken down into practical pointers and step-by-step instructions, the IT Service Excellence Tool Kit delivers expert advice for technology solution providers. Get your free copy now.

Richard MasseyWeb DesignerAuthor 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 MasseyWeb DesignerAuthor 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 MasseyWeb DesignerAuthor 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

Experts Exchange Solution brought to you by

Your issues matter to us.

Facing a tech roadblock? Get the help and guidance you need from experienced professionals who care. Ask your question anytime, anywhere, with no hassle.

Start your 7-day free trial
Richard MasseyWeb DesignerAuthor Commented:
Thanks for the response, got me looking in the right direction
0
It's more than this solution.Get answers and train to solve all your tech problems - anytime, anywhere.Try it for free Edge Out The Competitionfor your dream job with proven skills and certifications.Get started today Stand Outas the employee with proven skills.Start learning today for free Move Your Career Forwardwith certification training in the latest technologies.Start your trial today
HTML

From novice to tech pro — start learning today.

Question has a verified solution.

Are you are experiencing a similar issue? Get a personalized answer when you ask a related question.

Have a better answer? Share it in a comment.