jquery - Comboboxes onsubmit changes giving results but refreshes javascript setting -
i have html page has 3 buttons on click event displays respective hidden div form .the html buttons :
<button id="edituser" type="submit" onclick="toggle_visibility('c');" style="border:0;width:100px;margin-left: 74px;"> <img src="images/edituser.png" alt=""> </button><br><br> <button id="companyprofile" type="submit" onclick="toggle_visibility('d');" style="border:0;width:100px;margin-left: 74px;"> <img src="images/companyprofile.png" alt=""> </button><br><br> <button id="checkticket" type="submit" onclick="toggle_visibility('e');" style="border:0;width:100px;margin-left: 74px;"> <img src="images/checkticket.png" alt=""> </button><br><br> using js code on click of these buttons can select html div.
function toggle_visibility(id) { var e = document.getelementbyid(id); if(document.getelementbyid("c").id == id) { e.style.display = 'block'; document.getelementbyid("a").style.display='none'; document.getelementbyid("b").style.display='none'; document.getelementbyid("g").style.display='none'; document.getelementbyid("d").style.display='none'; document.getelementbyid("e").style.display='none'; document.getelementbyid("f").style.display='none'; document.getelementbyid("edituser").style.backgroundimage="url('images/edit_user_hover.png')"; } if(document.getelementbyid("d").id == id) { e.style.display = 'block'; document.getelementbyid("a").style.display='none'; document.getelementbyid("b").style.display='none'; document.getelementbyid("c").style.display='none'; document.getelementbyid("g").style.display='none'; document.getelementbyid("e").style.display='none'; document.getelementbyid("f").style.display='none'; document.getelementbyid("companyprofile").style.backgroundimage="url('images/edit_company_hover.png')"; } if(document.getelementbyid("e").id == id) { e.style.display = 'block'; document.getelementbyid("a").style.display='none'; document.getelementbyid("b").style.display='none'; document.getelementbyid("c").style.display='none'; document.getelementbyid("g").style.display='none'; document.getelementbyid("d").style.display='none'; document.getelementbyid("f").style.display='none'; document.getelementbyid("checkticket").style.backgroundimage="url('images/check_ticket_hover.png')"; } the html div given below:
<div class="col-lg-6" style="display:none" id="c" > <form action="" method="post" name="country_filter" id="country_filter" > <select name="id" id="id" class="span2" style="width:150px;" onchange="disp_div()" onchange="this.form.submit();" > <?php $servername = "localhost"; $username = "root"; $password = ""; $dbname = "v"; // create connection $conn = mysqli_connect($servername, $username, $password, $dbname); // check connection if (!$conn) { die("connection failed: " . mysqli_connect_error()); } $age = array(); $sql = "select * `tbl_user` "; $result = mysqli_query($conn, $sql); // echo "user name=" . $row["name"]. "<br>"; ?> <option value="">-select user-</option> <?php if (mysqli_num_rows($result) > 0) { // output data of each row while($row = mysqli_fetch_assoc($result)) { $age[] = $row; } ?> <?php foreach($age $key=>$row) { echo "<option value='" . $row['id'] . "' " . (($_request['id'] == $row['id']) ? "selected": "") . ">" . $row["id"] . "</option>"; ?> <?php } } else { echo "error: " . $sql . "<br>" . mysqli_error($conn); header('location: webservices.php'); } mysqli_close($conn); ?> </select> <form id="aa" action="" method="get" > <?php $servername = "localhost"; $username = "root"; $password = ""; $dbname = "v"; // create connection $conn = mysqli_connect($servername, $username, $password, $dbname); // check connection if (!$conn) { die("connection failed: " . mysqli_connect_error()); } $age = array(); if(isset($_request['id'])){ $sql = "select first_name ,last_name, phone, company_id, register_on `tbl_user` id=".$_request['id'] ." "; $result = mysqli_query($conn, $sql); // echo "user name=" . $row["name"]. "<br>"; if (mysqli_num_rows($result) > 0) { // output data of each row while($row = mysqli_fetch_assoc($result)) { $age[] = $row; ?> <br><br> <br> <input type="text" id="first_name" value="<?php echo $row["first_name"]; ?>" name="first_name" style="width: 460px;height: 50px;overflow: hidden;" placeholder="first name*"> <br> <br><br><br> <input type="text" id="last_name" value="<?php echo $row["last_name"]; ?>" name="last_name" style="width: 460px;height: 50px;overflow: hidden;" placeholder="last name*"> <br><br><br><br> <input type="text" id="phone" value="<?php echo $row["phone"]; ?>" name="phone" style="width: 460px;height: 50px;overflow: hidden;" placeholder="phone*"> <br><br><br><br> <input type="text" id="company_id" value="<?php echo $row["company_id"]; ?>" name="company_id" style="width: 460px;height: 50px;overflow: hidden;" placeholder="company id*"> <br><br><br><br> <input type="text" id="register_on" value="<?php echo $row["register_on"]; ?>" name="register_on" style="width: 460px;height: 50px;overflow: hidden;" placeholder="register on*"> <br><br><br><br> <button name="edituser" id="edituser" type="submit" style="border:0;width:100px;margin-left: 45px;" > <img src="images/save.png" alt=""> </button> <button type="submit" style="border:0;width:100px;margin-left: 75px;"> <img src="images/cancel.png" alt=""> </button> <?php } } } mysqli_close($conn); ?> </form> </div> <div class="col-lg-6" style="display:none" id="d" > <form action="" id="abc" method="post" > <select name="id" id="id" class="span2" style="width:150px;" onchange="this.form.submit();"> <?php $servername = "localhost"; $username = "root"; $password = ""; $dbname = "v"; // create connection $conn = mysqli_connect($servername, $username, $password, $dbname); // check connection if (!$conn) { die("connection failed: " . mysqli_connect_error()); } $age = array(); $sql = "select * `tbl_companies` "; $result = mysqli_query($conn, $sql); // echo "user name=" . $row["name"]. "<br>"; ?> <option value="">-select company-</option> <?php if (mysqli_num_rows($result) > 0) { // output data of each row while($row = mysqli_fetch_assoc($result)) { $age[] = $row; } ?> <?php foreach($age $key=>$row) { echo "<option value='" . $row['id'] . "' " . (($_request['id'] == $row['id']) ? "selected": "") . ">" . $row["id"] . "</option>"; ?> <?php } } else { echo "error: " . $sql . "<br>" . mysqli_error($conn); header('location: webservices.php'); } mysqli_close($conn); ?> </select> <br><br> <br> <?php $servername = "localhost"; $username = "root"; $password = ""; $dbname = "v"; // create connection $conn = mysqli_connect($servername, $username, $password, $dbname); // check connection if (!$conn) { die("connection failed: " . mysqli_connect_error()); } $age = array(); if(isset($_request['id'])){ $sql = "select company_name ,acess_code ,register_on `tbl_companies` id=".$_request['id'] ." "; $result = mysqli_query($conn, $sql); // echo "user name=" . $row["name"]. "<br>"; if (mysqli_num_rows($result) > 0) { // output data of each row while($row = mysqli_fetch_assoc($result)) { $age[] = $row; ?> <br><br><br> <input type="text" id="company_name" value="<?php echo isset($row["company_name"])?$row["company_name"]:''; ?>" name="company_name" style="width: 460px;height: 50px;overflow: hidden;" placeholder="company name*"> <br> <br><br><br> <input type="text" id="acess_code" value="<?php echo isset($row["acess_code"])?$row["acess_code"]:''; ?>" name="acess_code" style="width: 460px;height: 50px;overflow: hidden;" placeholder="acess code*"> <br><br><br><br> <input type="text" id="register_on" value="<?php echo isset($row["register_on"])?$row["register_on"]:''; ?>" name="register_on" style="width: 460px;height: 50px;overflow: hidden;" placeholder="register on*"> <br><br><br><br> <button name="editcompany" id="editcompany" type="submit" style="border:0;width:100px;margin-left: 45px;" > <img src="images/save.png" alt=""> </button> <button type="submit" style="border:0;width:100px;margin-left: 75px;"> <img src="images/cancel.png" alt=""> </button> <?php } } } mysqli_close($conn); ?> </form> </div> <div class="col-lg-6" style="display:none" id="e" > <form action="" method="post" name="country_filter" id="country_filter" > <select name="id" id="id" class="span2" style="width:150px;" onchange="this.form.submit();"> <?php $servername = "localhost"; $username = "root"; $password = ""; $dbname = "v"; // create connection $conn = mysqli_connect($servername, $username, $password, $dbname); // check connection if (!$conn) { die("connection failed: " . mysqli_connect_error()); } $age = array(); $sql = "select * `tbl_tickets` "; $result = mysqli_query($conn, $sql); // echo "user name=" . $row["name"]. "<br>"; ?> <option value="">-select tickets-</option> <?php if (mysqli_num_rows($result) > 0) { // output data of each row while($row = mysqli_fetch_assoc($result)) { $age[] = $row; } ?> <?php foreach($age $key=>$row) { echo "<option value='" . $row['id'] . "' " . (($_request['id'] == $row['id']) ? "selected": "") . ">" . $row["id"] . "</option>"; ?> <?php } } else { echo "error: " . $sql . "<br>" . mysqli_error($conn); header('location: webservices.php'); } mysqli_close($conn); ?> </select> </form> <form action="" method="post" id="e" > <?php $servername = "localhost"; $username = "root"; $password = ""; $dbname = "v"; // create connection $conn = mysqli_connect($servername, $username, $password, $dbname); // check connection if (!$conn) { die("connection failed: " . mysqli_connect_error()); } $age = array(); if(isset($_request['id'])){ $sql = "select ticket_no ,user_id ,ticket_status ,register_on `tbl_tickets` id=".$_request['id'] ." "; $result = mysqli_query($conn, $sql); // echo "user name=" . $row["name"]. "<br>"; if (mysqli_num_rows($result) > 0) { // output data of each row while($row = mysqli_fetch_assoc($result)) { $age[] = $row; ?> <br><br><br> <input type="text" name="firstname" value="<?php echo $row["ticket_no"] ;?>" style="width: 460px;height: 50px;overflow: hidden;" placeholder="ticket owner name*" readonly> <br> <br><br><br> <input type="text" name="lastname" value="<?php echo $row["user_id"]; ?>" style="width: 460px;height: 50px;overflow: hidden;" placeholder="registration date*" readonly> <br><br><br><br> <input type="text" name="lastname" value="<?php echo $row["ticket_status"]; ?>" style="width: 460px;height: 50px;overflow: hidden;" placeholder="expire date*" readonly> <br><br><br><br> <input type="text" name="lastname" value="<?php echo $row["register_on"]; ?>" style="width: 460px;height: 50px;overflow: hidden;" placeholder="expire time status*" readonly> <br><br><br><br> <button name="chkticketstatus" id="chkticketstatus" type="submit" style="border:0;width:100px;margin-left: 45px;"> <img src="images/save.png" alt=""> </button> <button type="submit" style="border:0;width:100px;margin-left: 75px;"> <img src="images/cancel.png" alt=""> </button> <?php } } } mysqli_close($conn); ?> </form> </div> the problem facing user select html div on button click using function (onclick="toggle_visibility('c');") combo-box appears , when value submitted combo-box refreshes page , load default div visible.how can make html div visible combobox has submitted value after page reloads?
you can acheive changing form submission way. don't submit whole page instead can use ajax way form submission. ajax way can submit form without reloading whole page. in way div selected persisted.
ajax reference:
Comments
Post a Comment