用PHP代码不用javascript隐藏的div

时间:2017-07-25 08:31:19

标签: javascript php html

我有三个标签。点击每个标签显示某些信息。但是当我点击编辑时,所需的表格不会到来。只有当我点击配置文件选项卡它的工作。如果我删除PHP代码并将简单的html代码放在配置文件div中的选项卡工作。我的意思是,如果我点击它的工作原理并隐藏编辑div,反之亦然。但不是用PHP代码。我想编辑选项卡在配置文件选项卡中使用PHP代码。我该如何解决这个问题?

<div class="tabmember">
  <button class="tablinks" onclick="opentab1(event, 'profile')">Profile</button>
  <button class="tablinks" onclick="opentab2(event, 'edit')">Edit</button>
  <button class="tablinks" onclick="opentab(event, 'myorder')">My Order</button>
  <button class="tablinks" onclick="opentab(event, 'logout')">Log out</button>
</div>

<div id="profile">
<?php

  $email=filter_var($_SESSION['email'],FILTER_SANITIZE_EMAIL) ;

  $user_query="select * from user where email='$email'"; 

    $run_query=mysqli_query($dbcon,$user_query);  

    if(mysqli_num_rows($run_query)>0)  
    {  

      echo' <table border="2">
        <thead>
          <tr>
            <th>id</th>
            <th>email</th>
            <th>status</th>
            <th>zip</th>
            <th>name</th>
            <th>password</th>
            <th>address</th>
            <th>country</th>
            <th>expires</th>

          </tr>
        </thead>
        <tbody>';


      while( $row = mysqli_fetch_assoc( $run_query)){
        echo "<tr><td>{$row['id']}</td><td>{$row['email']}</td><td>{$row['status']}</td><td>{$row['zip']}</td><td>{$row['name']}</td><td>{$row['password']}</td><td>{$row['address']}</td><td>{$row['country']}</td><td>{$row['expires']}</td></tr>\n";
      }

    }
    else {
      echo"<script>alert('error retrieving from database! Contact admin!')</script>"; 
    }

    //close con
    mysqli_close($dbcon);

?>

</div>

<div id="edit">
  <form id="actform" action="new_user.php">
    <div><a href="bbc.com">AAA</div>        
    <input type="text" id="email" name="email_" placeholder="Your new email.."> 
    <input type="text" id="name" name="fullname" placeholder="Your new full name..">
    <input type="text" id="address" name="fulladdr" placeholder="Your new full address..">
    <input type="text" id="zip" name="zipcode" placeholder="Your new zip code..">
    <select id="country" name="country">
      <option value="australia">Australia</option>
      <option value="canada">Canada</option>
      <option value="usa">USA</option>
    </select>
    <input type="submit" value="Submit">
  </form>
</div>

function opentab1(evt, tabname) {
    // Declare all variables
    var i, tabcontent, tablinks;



if (window.matchMedia("(max-width: 680px)").matches) {

      document.getElementById("main").style.display="none";
      document.getElementById("side").style.display="none";
    document.getElementById("edit").style.display="none";

     document.getElementById("actform").style.display="none";


     document.getElementById("profile").style.display="block";
   document.getElementById("profile").style.position="fixed";
   document.getElementById("profile").style.top="400px";
   document.getElementById("profile").style.left="10px";


  /* the viewport is at least 400 pixels wide */
} 

else{

    document.getElementById("profile").style.display="none";
    }

  /* the viewport is less than 400 pixels wide */
    document.getElementById("main").style.display="none";
    document.getElementById("side").style.display="none";
    document.getElementById("edit").style.display="none";

     document.getElementById("actform").style.display="none";

     document.getElementById("profile").style.display="block";




}

function opentab2(evt, tabname) {
    // Declare all variables
    var i, tabcontent, tablinks;
if (window.matchMedia("(max-width: 680px)").matches) {

    document.getElementById("main").style.display="none";
    document.getElementById("side").style.display="none";
    document.getElementById("profile").style.display="none";

     document.getElementById("edit").style.display="block";
     document.getElementById("actform").style.position="fixed";
     document.getElementById("actform").style.top="300px";
     document.getElementById("actform").style.left="10px";

}


else{
document.getElementById("edit").style.display="none";
     document.getElementById("actform").style.display="none";

}



     document.getElementById("main").style.display="none";
    document.getElementById("profile").style.display="none";
    document.getElementById("side").style.display="none";

     document.getElementById("edit").style.display="block";
     document.getElementById("actform").style.display="block";



}

0 个答案:

没有答案