jquery hide div when clicked search button - javascript

I have a table that generates content using php that called "tab1" and has a search button called with an Id with "cmdsearch". My content seems not to hide when I clicked search. My code so far
$(document).ready(function() {
$( "#datepicker" ).hide();
$( "#datepicker2" ).hide();
$( "#datepicker" ).datepicker({dateFormat: 'yy/mm/dd'});
$( "#datepicker2" ).datepicker({dateFormat: 'yy/mm/dd'});
$("#category").on('change',function(){
if($("#category").val() == 'ORIGINAL_DEADLINE'){
$( "#datepicker" ).show();
$( "#datepicker2" ).show();
$( "#datepicker2" ).show();
}else{
$( "#datepicker" ).hide();
$( "#datepicker2" ).hide();
}
$("#cmdsearch").click(function(){
$("#tab1").hide();
});
});
});
here is my html code
<?php
// session_start();
// if (!isset($_SESSION['username'])) {
// header("Location: login.php");
// exit;
// }
// $username=$_SESSION['username'];
?>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<script src="./js/sample.js"></script>
<script src="./js/quicksearch.js"></script>
<script src="./js/lytebox.js"></script>
<script src="//code.jquery.com/jquery-1.10.2.js"></script>
<script src="//code.jquery.com/ui/1.11.4/jquery-ui.js"></script>
<link rel="stylesheet" type="text/css" href="./css/sample.css">
<link rel="stylesheet" type="text/css" href="./css/table_blue.css">
<link rel="stylesheet" type="text/css" href="./css/lytebox.css">
<link rel="stylesheet" href="//code.jquery.com/ui/1.11.4/themes/smoothness/jquery-ui.css">
<script>
$(document).ready(function() {
$( "#datepicker" ).hide();
$( "#datepicker2" ).hide();
$( "#datepicker" ).datepicker({dateFormat: 'yy/mm/dd'});
$( "#datepicker2" ).datepicker({dateFormat: 'yy/mm/dd'});
$("#category").on('change',function(){
if($("#category").val() == 'ORIGINAL_DEADLINE'){
$( "#datepicker" ).show();
$( "#datepicker2" ).show();
$( "#datepicker2" ).show();
}else{
$( "#datepicker" ).hide();
$( "#datepicker2" ).hide();
}
});
});
$("#cmdsearch").click(function(){
$("#tab1").hide();
});
</script>
</head>
<body>
<div class="tabs">
<ul class="tab-links">
<li class="active">Overdue</li>
<li>Next 60 days</li>
<li>Others</li>
<li>No Deadline</li>
<li>Finished Documents</li>
<li>Register User</li>
<li>Generate Report</li>
<li>Manage Users</li>
<li>Logout</li>
</ul>
<form method="post" action="table.php">
Category<select name="category" id="category">
<option value='APP_NUMBER' >APP_NUMBER</option>
<option value='SPOC_ASSIGNED' >SPOC_ASSIGNED</option>
<option value='BORROWER_NAME' >BORROWER_NAME</option>
<option value='DEFERRED_TYPE' >DEFERRED_TYPE</option>
<option value='ORIGINAL_DEADLINE' >ORIGINAL_DEADLINE</option>
</select>
Search Text<input type="text" name="txtsearch" placeholder="Type to Search" />
<input type="text" id="datepicker" name="date1" placeholder="Input Start Date">
<input type="text" id="datepicker2" name="date2" placeholder="Input End Date">
<input type="submit" id="cmdsearch" name="cmdsearch" value="Search" />
</form>
<div class="tab-content">
<div id="tab1" class="tab active" >
<?php
//conection:
include "conn.php";
//consultation:
$query = "SELECT * FROM export_workflow.COLLATERAL_MANAGEMENT where DATEDIFF(CURDATE(),ORIGINAL_DEADLINE)>1 and SUBMITTED_PENDING='PENDING'";
//execute the query.
if($result = $link->query($query)){
echo "<table class='data' id='table_example'>".
"<thead>".
"<tr>".
"<td>App Number</td>".
"<td>Spoc Assigned</td>".
"<td>Borrower Name</td>".
"<td>App Finish Date</td>".
"<td>Developer & Project</td>".
"<td>Collateral Address Details</td>".
"<td>Deferred Document</td>".
"<td>Deferred Type</td>".
"<td>Original Deadline</td>".
"<td>Date Completed</td>".
"<td>SPOC Remarks</td>".
"<td>File Location</td>".
"<td>JUW MA Remarks</td>".
"<td>COSU Remarks</td>".
"<td>SMU Notes</td>".
"<td>SUBMITTED/PENDING</td>".
"<td> EDIT </td>".
"</tr></thead>";
while($row = $result->fetch_assoc()){
echo "<tr><td>".$row['APP_NUMBER']."</td>".
"<td>".$row['SPOC_ASSIGNED']."</td>".
"<td>".$row['BORROWER_NAME']."</td>".
"<td>".$row['APP_FINISH_DATE']."</td>".
"<td>".$row['DEVELOPER_PROJECT']."</td>".
"<td>".$row['COLLATERAL_ADDRESS_DETAILS']."</td>".
"<td>".$row['DEFERRED_DOCUMENT']."</td>".
"<td>".$row['DEFERRED_TYPE']."</td>".
"<td>".$row['ORIGINAL_DEADLINE']."</td>".
"<td>".$row['DATE_COMPLETED']."</td>".
"<td>".$row['SPOC_REMARKS']."</td>".
"<td>".$row['FILED_LOCATION']."</td>".
"<td>".$row['JUW_MA_REMARKS']."</td>".
"<td>".$row['COSU_REMARKS']."</td>".
"<td>".$row['SMU_NOTES']."</td>".
"<td>".$row['SUBMITTED_PENDING']."</td>".
"<td><a href='spoc_remarks.php?id=".$row['ID']."' class='lytebox'><image src='./images/pen.png' height=30 width=30></a></td>".
"</tr>";
}
$result->close();
echo "</table>\r\n";
} else {
printf("<p>Error: %s</p>\r\n", $mysqli->error);
}
?>
</div>
<div id="tab_result">
<?php
if(isset($_POST['cmdsearch'])){
$category=$_POST['category'];
$text=$_POST['txtsearch'];
$date1=$_POST['date1'];
$date2=$_POST['date2'];
//connect to db
$link = mysqli_connect("10.20.8.70","stcutie","qwerty123","export_workflow") or die("Error " . mysqli_error($link));
if($link->connect_error){
printf("Connect failed: %s\n", $mysqli->connect_error);
exit();
}
if($category==='ORIGINAL_DEADLINE'){
$sql="SELECT * FROM COLLATERAL_MANAGEMENT where ($category BETWEEN '$date1' AND '$date2')";
}else{
$sql="SELECT * FROM COLLATERAL_MANAGEMENT where $category LIKE '%$text%'";
}
if (mysqli_query($link, $sql)) {
} else {
echo "Error: " . $sql . "<br>" . mysqli_error($link);
}
$result = $link->query($sql);
echo "<table class='data' id='table_example'>".
"<thead>".
"<tr>".
"<td>App Number</td>".
"<td>Spoc Assigned</td>".
"<td>Borrower Name</td>".
"<td>App Finish Date</td>".
"<td>Developer & Project</td>".
"<td>Collateral Address Details</td>".
"<td>Deferred Document</td>".
"<td>Deferred Type</td>".
"<td>Original Deadline</td>".
"<td>Date Completed</td>".
"<td>SPOC Remarks</td>".
"<td>File Location</td>".
"<td>JUW MA Remarks</td>".
"<td>COSU Remarks</td>".
"<td>SMU Notes</td>".
"<td>SUBMITTED/PENDING</td>".
"<td> EDIT </td>".
"</tr></thead>";
while($row = $result->fetch_assoc()){
echo "<tr><td>".$row['APP_NUMBER']."</td>".
"<td>".$row['SPOC_ASSIGNED']."</td>".
"<td>".$row['BORROWER_NAME']."</td>".
"<td>".$row['APP_FINISH_DATE']."</td>".
"<td>".$row['DEVELOPER_PROJECT']."</td>".
"<td>".$row['COLLATERAL_ADDRESS_DETAILS']."</td>".
"<td>".$row['DEFERRED_DOCUMENT']."</td>".
"<td>".$row['DEFERRED_TYPE']."</td>".
"<td>".$row['ORIGINAL_DEADLINE']."</td>".
"<td>".$row['DATE_COMPLETED']."</td>".
"<td>".$row['SPOC_REMARKS']."</td>".
"<td>".$row['FILED_LOCATION']."</td>".
"<td>".$row['JUW_MA_REMARKS']."</td>".
"<td>".$row['COSU_REMARKS']."</td>".
"<td>".$row['SMU_NOTES']."</td>".
"<td>".$row['SUBMITTED_PENDING']."</td>".
"<td><a href='spoc_remarks.php?id=".$row['ID']."' class='lytebox'><image src='./images/pen.png' height=30 width=30></a></td>".
"</tr>";
}
}
?>
</div>
</div>
<?php
$link->close();
?>
</body>
</html>

You have the click event listener registration in change event handler, so unless you change the value of the #category the click handler is not added. Also there is a possibility that it will add multiple click handler(1 new handler each time you change the value of category)
$(document).ready(function () {
$("#datepicker").hide();
$("#datepicker2").hide();
$("#datepicker").datepicker({
dateFormat: 'yy/mm/dd'
});
$("#datepicker2").datepicker({
dateFormat: 'yy/mm/dd'
});
$("#category").on('change', function () {
if ($("#category").val() == 'ORIGINAL_DEADLINE') {
$("#datepicker").show();
$("#datepicker2").show();
$("#datepicker2").show();
} else {
$("#datepicker").hide();
$("#datepicker2").hide();
}
});
//should be outside of the change event hanlder
$("#cmdsearch").click(function (e) {
e.preventDefault();//prevent the form submit since the button is inside a from
$("#tab1").hide();
});
});
But it could be simplified as
$(function () {
var $dtps = $("#datepicker, #datepicker2"); //use a class selector to simplify this
$dtps.hide().datepicker({
dateFormat: 'yy/mm/dd'
});
$("#category").on('change', function () {
$dtps.toggle(this.value == 'ORIGINAL_DEADLINE')
});
//should be outside of the change event hanlder
$("#cmdsearch").click(function (e) {
e.preventDefault();//prevent the form submit since the button is inside a from
$("#tab1").hide();
});
});
Demo: Fiddle
Note: Since the button is of type submit and is inside a form, the default action of the button click is to submit the button, since you want to do a custom action you need to prevent it by calling event.preventDefault() or by changing the type of the button to button(like <input type="button" id="cmdsearch" name="cmdsearch" value="Search" />)

Related

how to load sub category based on category by calling jquery function from <td> of javascript function for adding rows dynamically?

When I am clicking the add row button the category dropdown list loads successfully, but when I'm selecting an option from this category list the sub category does not load any list.
The Javascript function for adding rows dynamically:
<script type="text/javascript">
$(document).ready(function(){
var i=1;
$("#add_row").click(function(){
$('#addr'+i).html("<td>"+ (i+1) +"</td> <td><select name='parent_catt"+i+"' id='parent_catt' class='form-control input-md'><?php while($row2 = $query2_parent->fetch_array()): ?><option value='<?php echo $row2["cat_id"]; ?>'><?php echo $row2["category"]; ?></option><?php endwhile; ?></select></td><td><select name='sub_catt"+i+"' id='sub_catt' class='form-control input-md'></select></td><td><input name='mobile"+i+"' type='text' placeholder='Mobile' class='form-control input-md'></td><td><input name='mobile"+i+"' type='text' placeholder='Mobile' class='form-control input-md'></td><td><input name='mobile"+i+"' type='text' placeholder='Mobile' class='form-control input-md'></td>");
$('#tab_logic').append('<tr id="addr'+(i+1)+'"></tr>');
i++;
});
$("#delete_row").click(function(){
if(i>1){
$("#addr"+(i-1)).html('');
i--;
}
});
});
</script>
jQuery function to load subcategory:
<script type="text/javascript">
$(document).ready(function() {
$("#parent_catt").click(function() {
alert("clicked");
$(this).after('<div id="loader"><img src="images/loading.gif" alt="loading subcategory" /></div>');
$.get('loadsubcat.php?parent_catt=' + $(this).val(), function(data) {
$('#sub_catt').html(data);
$('#loader').slideUp(200, function() {
$(this).remove();
});
});
});
});
</script>
PHP code for fetch detail:
<?php
include('dbconnect.php');
$parent_catt = $_GET['parent_catt'];
$query2 = $con->query("SELECT * FROM subcategory WHERE cat_id = '$parent_catt'");
while($row2 = $query2->fetch_array()) {
echo "<option value='$row2[subcat_id]'>$row2[subcategory]</option>";
}
?>
Replace this line
$("#parent_catt").click(function() {
by this
$(document).off("click", "#parent_catt").on("click", "#parent_catt", function(){
use JQuery.on function
$( "#parent_catt" ).on( "click", function() {
alert("clicked");
});

how to pass PHP echo DIV values to dialog box

Each articles are located in DIV tag. Want to make each DIV clickable and once i click DIV, dialog box should display with appropriate DVI values
$add->tbl_article_content, $add->tbl_article_image my JS dialog box appear for only 1st DIV. how should i do it for all DIV and pass relevant data.
PHP
<div class="row">
<?php
foreach ($data as $value) {
echo "<div class='col-lg-3'>";
echo "<p id='target'>" . $value->tbl_article_header . "</p>";
echo "</div>";
}
?>
Jquery
$( "#target" ).click(function() {
alert( "relevant DIV database values ??? " );
});
Instead of target as an id you should make it as class
<div class="row">
<?php
foreach ($data as $value) {
echo "<div class='col-lg-3'>";
echo "<p class='target'>" . $value->tbl_article_header . "</p>";
echo "</div>";
}
?>
$( ".target" ).click(function() {
alert( $(this).html() );
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<div class='col-lg-3'>
<p class='target'>Value 1</p>
</div>
<div class='col-lg-3'>
<p class='target'>Value 2</p>
</div>
<div class='col-lg-3'>
<p class='target'>Value 3</p>
</div>
UPDATE
<div class="row">
<?php
foreach ($data as $value) {
echo "<div class='col-lg-3'>";
echo "<p class='target' data-article=".$add->tbl_article_content.">" . $value->tbl_article_header . "</p>";
echo "</div>";
}
?>
$( ".target" ).click(function() {
alert( $(this).attr('data-article') );
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<div class='col-lg-3'>
<p class='target' data-article="Articel 1">Head 1</p>
</div>
<div class='col-lg-3'>
<p class='target' data-article="Articel 2">Head 2</p>
</div>
<div class='col-lg-3'>
<p class='target' data-article="Articel 3">Head 3</p>
</div>
the id is unique inside a page ... use a class for a group of related div
<?php
foreach ($data as $value) {
echo "<div class='col-lg-3'>";
echo "<p class='target'>" . $value->tbl_article_header . "</p>";
echo "</div>";
}
?>
and for js
$( ".target" ).click(function() {
alert( "relevant DIV database values ??? " );
});

jquery widget tab refresh div to when update table finish

I have a jquery tab that display divs that have table with edit function that uses a lytebox to popup my update form.
Problem is I need to refresh the page to update the content and I'm kinda lost on the url and the process of the update thing. I am used to a single page update ever since. Here is my code so far:
<?php
session_start();
if (!isset($_SESSION['username'])) {
header("Location: login.php");
exit;
}else if($_SESSION['role']!=='ADMIN'){
header("Location: login.php");
exit;
}
$username=$_SESSION['username'];
?>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<script src="./js/sample.js"></script>
<script src="./js/quicksearch.js"></script>
<script src="./js/lytebox.js"></script>
<script src="//code.jquery.com/jquery-1.10.2.js"></script>
<script src="//code.jquery.com/ui/1.11.4/jquery-ui.js"></script>
<link rel="stylesheet" type="text/css" href="./css/sample.css">
<link rel="stylesheet" type="text/css" href="./css/table_blue.css">
<link rel="stylesheet" type="text/css" href="./css/lytebox.css">
<link rel="stylesheet" href="//code.jquery.com/ui/1.11.4/themes/smoothness/jquery-ui.css">
<script>
$(document).ready(function () {
$("#datepicker").hide();
$("#datepicker2").hide();
$("#datepicker").datepicker({
dateFormat: 'yy/mm/dd'
});
$("#datepicker2").datepicker({
dateFormat: 'yy/mm/dd'
});
$("#category").on('change', function () {
if ($("#category").val() == 'ORIGINAL_DEADLINE') {
$("#datepicker").show();
$("#datepicker2").show();
$("#datepicker2").show();
} else {
$("#datepicker").hide();
$("#datepicker2").hide();
}
});
});
</script>
</head>
<body>
<div class="tabs">
<ul class="tab-links">
<li>Overdue</li>
<li>Next 60 days</li>
<li>Others</li>
<li>No Deadline</li>
<li>Finished Documents</li>
<li>Manage Users</li>
<li>Generate Report</li>
<li>Logout</li>
</ul>
<form method="post" action="table.php" >
Category<select name="category" id="category">
<option value='APP_NUMBER' >APP_NUMBER</option>
<option value='SPOC_ASSIGNED' >SPOC_ASSIGNED</option>
<option value='BORROWER_NAME' >BORROWER_NAME</option>
<option value='DEFERRED_TYPE' >DEFERRED_TYPE</option>
<option value='ORIGINAL_DEADLINE' >ORIGINAL_DEADLINE</option>
</select>
Search Text<input type="text" name="txtsearch" placeholder="Type to Search" />
<input type="text" id="datepicker" name="date1" placeholder="Input Start Date">
<input type="text" id="datepicker2" name="date2" placeholder="Input End Date">
<input type="submit" name="cmdsearch" id="cmdsearch" value="Search"/>
</form>
<div class="tab-content">
<div id="tab1" class="tab">
<?php
//conection:
include "conn.php";
//consultation:
$query = "SELECT * FROM export_workflow.COLLATERAL_MANAGEMENT where DATEDIFF(CURDATE(),ORIGINAL_DEADLINE)>1 and SUBMITTED_PENDING='PENDING'";
//execute the query.
if($result = $link->query($query)){
echo "<table class='data' id='table_example'>".
"<thead>".
"<tr>".
"<td>App Number</td>".
"<td>Spoc Assigned</td>".
"<td>Borrower Name</td>".
"<td>App Finish Date</td>".
"<td>Developer & Project</td>".
"<td>Collateral Address Details</td>".
"<td>Deferred Document</td>".
"<td>Deferred Type</td>".
"<td>Original Deadline</td>".
"<td>Date Completed</td>".
"<td>SPOC Remarks</td>".
"<td>File Location</td>".
"<td>JUW MA Remarks</td>".
"<td>COSU Remarks</td>".
"<td>SMU Notes</td>".
"<td>SUBMITTED/PENDING</td>".
"<td> EDIT </td>".
"<td> EDIT </td>".
"</tr></thead>";
while($row = $result->fetch_assoc()){
echo "<tr><td>".$row['APP_NUMBER']."</td>".
"<td>".$row['SPOC_ASSIGNED']."</td>".
"<td>".$row['BORROWER_NAME']."</td>".
"<td>".$row['APP_FINISH_DATE']."</td>".
"<td>".$row['DEVELOPER_PROJECT']."</td>".
"<td>".$row['COLLATERAL_ADDRESS_DETAILS']."</td>".
"<td>".$row['DEFERRED_DOCUMENT']."</td>".
"<td>".$row['DEFERRED_TYPE']."</td>".
"<td>".$row['ORIGINAL_DEADLINE']."</td>".
"<td>".$row['DATE_COMPLETED']."</td>".
"<td>".$row['SPOC_REMARKS']."</td>".
"<td>".$row['FILED_LOCATION']."</td>".
"<td>".$row['JUW_MA_REMARKS']."</td>".
"<td>".$row['COSU_REMARKS']."</td>".
"<td>".$row['SMU_NOTES']."</td>".
"<td>".$row['SUBMITTED_PENDING']."</td>".
"<td><a href='spoc_remarks.php?id=".$row['ID']."' class='lytebox'><image src='./images/pen.png' height=30 width=30></a></td>".
"</tr>";
}
$result->close();
echo "</table>\r\n";
} else {
printf("<p>Error: %s</p>\r\n", $mysqli->error);
}
?>
</div>
<div id="tab2" class="tab">
<?php
// Perform next SQL Query
if($result = $link->query("SELECT * FROM export_workflow.COLLATERAL_MANAGEMENT where DATEDIFF(CURDATE(),ORIGINAL_DEADLINE)<60 and SUBMITTED_PENDING='PENDING'")){
echo "<table class='data' id='table_example'>".
"<thead>".
"<tr>".
"<td>App Number</td>".
"<td>Spoc Assigned</td>".
"<td>Borrower Name</td>".
"<td>App Finish Date</td>".
"<td>Developer & Project</td>".
"<td>Collateral Address Details</td>".
"<td>Deferred Document</td>".
"<td>Deferred Type</td>".
"<td>Original Deadline</td>".
"<td>Date Completed</td>".
"<td>SPOC Remarks</td>".
"<td>File Location</td>".
"<td>JUW MA Remarks</td>".
"<td>COSU Remarks</td>".
"<td>SMU Notes</td>".
"<td>SUBMITTED/PENDING</td>".
"<td> EDIT </td>".
"</tr></thead>";
while($row = $result->fetch_assoc()){
echo "<tr><td>".$row['APP_NUMBER']."</td>".
"<td>".$row['SPOC_ASSIGNED']."</td>".
"<td>".$row['BORROWER_NAME']."</td>".
"<td>".$row['APP_FINISH_DATE']."</td>".
"<td>".$row['DEVELOPER_PROJECT']."</td>".
"<td>".$row['COLLATERAL_ADDRESS_DETAILS']."</td>".
"<td>".$row['DEFERRED_DOCUMENT']."</td>".
"<td>".$row['DEFERRED_TYPE']."</td>".
"<td>".$row['ORIGINAL_DEADLINE']."</td>".
"<td>".$row['DATE_COMPLETED']."</td>".
"<td>".$row['SPOC_REMARKS']."</td>".
"<td>".$row['FILED_LOCATION']."</td>".
"<td>".$row['JUW_MA_REMARKS']."</td>".
"<td>".$row['COSU_REMARKS']."</td>".
"<td>".$row['SMU_NOTES']."</td>".
"<td>".$row['SUBMITTED_PENDING']."</td>".
"<td><a href='spoc_remarks.php?id=".$row['ID']."' class='lytebox'><image src='./images/pen.png' height=30 width=30></a></td>".
"</tr>";
}
echo "</table>\r\n";
$result->close();
} else {
printf("<p>Error: %s</p>\r\n", $mysqli->error);
}
?>
</div>
<div id="tab3" class="tab">
<?php
// Perform next SQL Query
if($result = $link->query("SELECT * FROM export_workflow.COLLATERAL_MANAGEMENT where ORIGINAL_DEADLINE < current_date and SUBMITTED_PENDING='PENDING'")){
echo "<table class='data' id='table_example'>".
"<thead>".
"<tr>".
"<td>App Number</td>".
"<td>Spoc Assigned</td>".
"<td>Borrower Name</td>".
"<td>App Finish Date</td>".
"<td>Developer & Project</td>".
"<td>Collateral Address Details</td>".
"<td>Deferred Document</td>".
"<td>Deferred Type</td>".
"<td>Original Deadline</td>".
"<td>Date Completed</td>".
"<td>SPOC Remarks</td>".
"<td>File Location</td>".
"<td>JUW MA Remarks</td>".
"<td>COSU Remarks</td>".
"<td>SMU Notes</td>".
"<td>SUBMITTED/PENDING</td>".
"<td> EDIT </td>".
"</tr></thead>";
while($row = $result->fetch_assoc()){
echo "<tr><td>".$row['APP_NUMBER']."</td>".
"<td>".$row['SPOC_ASSIGNED']."</td>".
"<td>".$row['BORROWER_NAME']."</td>".
"<td>".$row['APP_FINISH_DATE']."</td>".
"<td>".$row['DEVELOPER_PROJECT']."</td>".
"<td>".$row['COLLATERAL_ADDRESS_DETAILS']."</td>".
"<td>".$row['DEFERRED_DOCUMENT']."</td>".
"<td>".$row['DEFERRED_TYPE']."</td>".
"<td>".$row['ORIGINAL_DEADLINE']."</td>".
"<td>".$row['DATE_COMPLETED']."</td>".
"<td>".$row['SPOC_REMARKS']."</td>".
"<td>".$row['FILED_LOCATION']."</td>".
"<td>".$row['JUW_MA_REMARKS']."</td>".
"<td>".$row['COSU_REMARKS']."</td>".
"<td>".$row['SMU_NOTES']."</td>".
"<td>".$row['SUBMITTED_PENDING']."</td>".
"<td><a href='spoc_remarks.php?id=".$row['ID']."' class='lytebox'><image src='./images/pen.png' height=30 width=30></a></td>".
"</tr>";
}
echo "</table>\r\n";
$result->close();
} else {
printf("<p>Error: %s</p>\r\n", $mysqli->error);
}
?>
</div>
<div id="tab4" class="tab">
<?php
if($result = $link->query("SELECT * FROM export_workflow.COLLATERAL_MANAGEMENT where ORIGINAL_DEADLINE='' and SUBMITTED_PENDING='PENDING'")){
echo "<table class='data' id='table_example'>".
"<thead>".
"<tr>".
"<td>App Number</td>".
"<td>Spoc Assigned</td>".
"<td>Borrower Name</td>".
"<td>App Finish Date</td>".
"<td>Developer & Project</td>".
"<td>Collateral Address Details</td>".
"<td>Deferred Document</td>".
"<td>Deferred Type</td>".
"<td>Original Deadline</td>".
"<td>Date Completed</td>".
"<td>SPOC Remarks</td>".
"<td>File Location</td>".
"<td>JUW MA Remarks</td>".
"<td>COSU Remarks</td>".
"<td>SMU Notes</td>".
"<td>SUBMITTED/PENDING</td>".
"<td> EDIT </td>".
"</tr></thead>";
while($row = $result->fetch_assoc()){
echo "<tr><td>".$row['APP_NUMBER']."</td>".
"<td>".$row['SPOC_ASSIGNED']."</td>".
"<td>".$row['BORROWER_NAME']."</td>".
"<td>".$row['APP_FINISH_DATE']."</td>".
"<td>".$row['DEVELOPER_PROJECT']."</td>".
"<td>".$row['COLLATERAL_ADDRESS_DETAILS']."</td>".
"<td>".$row['DEFERRED_DOCUMENT']."</td>".
"<td>".$row['DEFERRED_TYPE']."</td>".
"<td>".$row['ORIGINAL_DEADLINE']."</td>".
"<td>".$row['DATE_COMPLETED']."</td>".
"<td>".$row['SPOC_REMARKS']."</td>".
"<td>".$row['FILED_LOCATION']."</td>".
"<td>".$row['JUW_MA_REMARKS']."</td>".
"<td>".$row['COSU_REMARKS']."</td>".
"<td>".$row['SMU_NOTES']."</td>".
"<td>".$row['SUBMITTED_PENDING']."</td>".
"<td><a href='spoc_remarks.php?id=".$row['ID']."' class='lytebox'><image src='./images/pen.png' height=30 width=30></a></td>".
"</tr>";
}
echo "</table>\r\n";
$result->close();
} else {
printf("<p>Error: %s</p>\r\n", $mysqli->error);
}
?>
</div>
<div id="tab5" class="tab">
<?php
if($result = $link->query("SELECT * FROM export_workflow.COLLATERAL_MANAGEMENT where SUBMITTED_PENDING='SUBMITTED'")){
echo "<table class='data' id='table_example'>".
"<thead>".
"<tr>".
"<td>App Number</td>".
"<td>Spoc Assigned</td>".
"<td>Borrower Name</td>".
"<td>App Finish Date</td>".
"<td>Developer & Project</td>".
"<td>Collateral Address Details</td>".
"<td>Deferred Document</td>".
"<td>Deferred Type</td>".
"<td>Original Deadline</td>".
"<td>Date Completed</td>".
"<td>SPOC Remarks</td>".
"<td>File Location</td>".
"<td>JUW MA Remarks</td>".
"<td>COSU Remarks</td>".
"<td>SMU Notes</td>".
"<td>SUBMITTED/PENDING</td>".
"<td>EDIT</td>".
"</tr></thead>";
while($row = $result->fetch_assoc()){
echo "<tr><td>".$row['APP_NUMBER']."</td>".
"<td>".$row['SPOC_ASSIGNED']."</td>".
"<td>".$row['BORROWER_NAME']."</td>".
"<td>".$row['APP_FINISH_DATE']."</td>".
"<td>".$row['DEVELOPER_PROJECT']."</td>".
"<td>".$row['COLLATERAL_ADDRESS_DETAILS']."</td>".
"<td>".$row['DEFERRED_DOCUMENT']."</td>".
"<td>".$row['DEFERRED_TYPE']."</td>".
"<td>".$row['ORIGINAL_DEADLINE']."</td>".
"<td>".$row['DATE_COMPLETED']."</td>".
"<td>".$row['SPOC_REMARKS']."</td>".
"<td>".$row['FILED_LOCATION']."</td>".
"<td>".$row['JUW_MA_REMARKS']."</td>".
"<td>".$row['COSU_REMARKS']."</td>".
"<td>".$row['SMU_NOTES']."</td>".
"<td>".$row['SUBMITTED_PENDING']."</td>".
"<td><a href='spoc_remarks.php?id=".$row['ID']."' class='lytebox'><image src='./images/pen.png' height=30 width=30></a></td>".
"</tr>";
}
echo "</table>\r\n";
$result->close();
} else {
printf("<p>Error: %s</p>\r\n", $mysqli->error);
}
?>
</div>
<div id="tab_search">
<?php
if(isset($_POST['cmdsearch'])){
$category=$_POST['category'];
$text=$_POST['txtsearch'];
$date1=$_POST['date1'];
$date2=$_POST['date2'];
//connect to db
$link = mysqli_connect("xxxxxx","xxxxx","qwerty123","xxxxx") or die("Error " . mysqli_error($link));
if($link->connect_error){
printf("Connect failed: %s\n", $mysqli->connect_error);
exit();
}
if($category==='ORIGINAL_DEADLINE'){
$sql="SELECT * FROM COLLATERAL_MANAGEMENT where ($category BETWEEN '$date1' AND '$date2')";
}else{
$sql="SELECT * FROM COLLATERAL_MANAGEMENT where $category LIKE '%$text%'";
}
if (mysqli_query($link, $sql)) {
} else {
echo "Error: " . $sql . "<br>" . mysqli_error($link);
}
$result = $link->query($sql);
echo "<table class='data' id='table_example'>".
"<thead>".
"<tr>".
"<td>App Number</td>".
"<td>Spoc Assigned</td>".
"<td>Borrower Name</td>".
"<td>App Finish Date</td>".
"<td>Developer & Project</td>".
"<td>Collateral Address Details</td>".
"<td>Deferred Document</td>".
"<td>Deferred Type</td>".
"<td>Original Deadline</td>".
"<td>Date Completed</td>".
"<td>SPOC Remarks</td>".
"<td>File Location</td>".
"<td>JUW MA Remarks</td>".
"<td>COSU Remarks</td>".
"<td>SMU Notes</td>".
"<td>SUBMITTED/PENDING</td>".
"<td> EDIT </td>".
"</tr></thead>";
while($row = $result->fetch_assoc()){
echo "<tr><td>".$row['APP_NUMBER']."</td>".
"<td>".$row['SPOC_ASSIGNED']."</td>".
"<td>".$row['BORROWER_NAME']."</td>".
"<td>".$row['APP_FINISH_DATE']."</td>".
"<td>".$row['DEVELOPER_PROJECT']."</td>".
"<td>".$row['COLLATERAL_ADDRESS_DETAILS']."</td>".
"<td>".$row['DEFERRED_DOCUMENT']."</td>".
"<td>".$row['DEFERRED_TYPE']."</td>".
"<td>".$row['ORIGINAL_DEADLINE']."</td>".
"<td>".$row['DATE_COMPLETED']."</td>".
"<td>".$row['SPOC_REMARKS']."</td>".
"<td>".$row['FILED_LOCATION']."</td>".
"<td>".$row['JUW_MA_REMARKS']."</td>".
"<td>".$row['COSU_REMARKS']."</td>".
"<td>".$row['SMU_NOTES']."</td>".
"<td>".$row['SUBMITTED_PENDING']."</td>".
"<td><a href='spoc_remarks.php?id=".$row['ID']."' class='lytebox'><image src='./images/pen.png' height=30 width=30></a></td>".
"</tr>";
}
}
?>
</div>
</div>
<?php
$link->close();
?>
</body>
</html>
here is my updated script when the user click my table:
<?php
$link = mysqli_connect("10.20.8.70","stcutie","qwerty123","export_workflow") or die("Error " . mysqli_error($link));
session_start();
if (!isset($_SESSION['username'])) {
header("Location: login.php");
exit;
}
$username=$_SESSION['username'];
$role=$_SESSION['role'];
$id=$_GET['id'];
$ip=$_SERVER['REMOTE_ADDR'];
//filter database for update
$query = "SELECT * from COLLATERAL_MANAGEMENT where ID='$id'; " or die("Error in the consult.." . mysqli_error($link));
//execute the query.
$result = $link->query($query);
$row = mysqli_fetch_array($result);
$app_uid=$row['APP_NUMBER'];
$spoc_remarks=$row['SPOC_REMARKS'];
$file_location=$row['FILED_LOCATION'];
$juw_remarks=$row['JUW_MA_REMARKS'];
$cosu_remarks=$row['COSU_REMARKS'];
$smu_notes=$row['SMU_NOTES'];
$pending_complete=$row['SUBMITTED_PENDING'];
?>
<html>
<head>
<link rel="stylesheet" type="text/css" href="./css/form_style.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<script src="//code.jquery.com/jquery-1.10.2.js"></script>
<script src="//code.jquery.com/ui/1.11.4/jquery-ui.js"></script>
</head>
<body>
<form method="POST" action="">
<div class="form-style-10" id="dynamicField">
<h1>Edit Form</h1>
<br>
<input type="hidden" name="ID" value="<?php $id;?>" >
<p id="spoke_remarks">Spoc Remarks<input type="text" name="spoke_remarks" value="<?php echo $spoc_remarks; ?>"></p>
<br>
<p id="file_location"> File Location<input type="text" name="file_location" value="<?php echo $file_location;?>" > </p>
<br>
<p id="smu_notes">SMU NOTES<input type="text" name="smu_notes" value="<?php echo $smu_notes;?>" ></p>
<br>
<p id="pending_complete">Pending/SUBMITTED<select name="pending_complete" >
<option value='' >--SELECT--</option>
<option value='PENDING' >PENDING</option>
<option value='SUBMITTED' >SUBMITTED</option>
</select> </p>
<input type="submit" value="Edit" name="update" id="update"/>
</div>
</form>
<?php
if(isset($_POST['update'])){
if($role=='SPOC'){
$spoc_remarks2=mysqli_real_escape_string($link,$_POST['spoke_remarks']);
$sql="UPDATE COLLATERAL_MANAGEMENT set SPOC_REMARKS = '$spoc_remarks2' WHERE ID='$id'";
if (mysqli_query($link, $sql)) {
} else {
echo "Error: " . $sql . "<br>" . mysqli_error($link);
}
$sql2="INSERT INTO collateral_management.CHANGE_LOG (DATE, USERS_LOGGED, DESCRIPTION, OLD_VALUE,NEW_VALUE, APP_ID,IP_ADDRESS)
VALUES
(now(),'$username','Spoc $username edit remarks','$spoc_remarks','$spoc_remarks2','$app_uid','$ip');";
mysqli_query($link, $sql2);
}
I didn't solve it so, I made the tabs like a menu bar and just put a js window.load for refresh ^_^

I need help to making automatic submit quiz using timer

Hello guys i have a quiz system and i want that quiz will auto submit after the time is over this is my code but its not working.
<script type="text/javascript">
function countDown(secs, elem)
{
var element = document.getElementById(elem);
element.innerHTML = "<h2>You have <b>"+secs+"</b> seconds to answer the questions</h2>";
if(secs < 1) {
document.quiz.submit();
}
else
{
secs--;
setTimeout('countDown('+secs+',"'+elem+'")',1500);
}
}
function validate() {
return true;
}
</script>
<div id="status"></div>
<script type="text/javascript">countDown(4,"status");</script>
<title>Questionnaire</title>
<style type="text/css">
span {
color: #FF00CC;
}
</style>
<body>
<br />
<div class="col-sm-8">
<div class="panel panel-black">
<?php
include("db_conn.php");
$query="select * from question";
$rs=mysql_query("select * from question where test_id=$tid",$cn) or die(mysql_error());
if(!isset($_SESSION[qn]))
{
$_SESSION[qn]=0;
mysql_query("delete from useranswer where sess_id='" . session_id() ."'") or die(mysql_error());
$_SESSION[trueans]=0;
}
else
{
if($submit=='Next Question' && isset($ans))
{
mysql_data_seek($rs,$_SESSION[qn]);
$row= mysql_fetch_row($rs);
mysql_query("insert into useranswer(sess_id, test_id, que_des, ans1,ans2,ans3,ans4,true_ans,your_ans) values ('".session_id()."', $tid,'$row[2]','$row[3]','$row[4]','$row[5]', '$row[6]','$row[7]','$ans')") or die(mysql_error());
if($ans==$row[7])
{
$_SESSION[trueans]=$_SESSION[trueans]+1;
}
$_SESSION[qn]=$_SESSION[qn]+1;
}
else if($submit=='Get Result' && isset($ans))
{
mysql_data_seek($rs,$_SESSION[qn]);
$row= mysql_fetch_row($rs);
mysql_query("insert into useranswer(sess_id, test_id, que_des, ans1,ans2,ans3,ans4,true_ans,your_ans) values ('".session_id()."', $tid,'$row[2]','$row[3]','$row[4]','$row[5]', '$row[6]','$row[7]','$ans')") or die(mysql_error());
if($ans==$row[7])
{
$_SESSION[trueans]=$_SESSION[trueans]+1;
}
echo "<h1 class=head1> Result</h1>";
$_SESSION[qn]=$_SESSION[qn]+1;
echo "<Table align=center><tr class=tot><td>Total Question<td> $_SESSION[qn]";
echo "<tr class=tans><td>True Answer<td>".$_SESSION[trueans];
$w=$_SESSION[qn]-$_SESSION[trueans];
echo "<tr class=fans><td>Wrong Answer<td> ". $w;
echo "</table>";
mysql_query("insert into result(login,test_id,test_date,score) values('$login',$tid,'".date("d/m/Y")."',$_SESSION[trueans])") or die(mysql_error());
unset($_SESSION[qn]);
unset($_SESSION[sid]);
unset($_SESSION[tid]);
unset($_SESSION[trueans]);
exit;
}
}
$rs=mysql_query("select * from question where test_id=$tid",$cn) or die(mysql_error());
if($_SESSION[qn]>mysql_num_rows($rs)-1)
{
unset($_SESSION[qn]);
echo "<h1 class=head1>Some Error Occured</h1>";
session_destroy();
echo "Please <a href=test.php> Start Again</a>";
exit;
}
mysql_data_seek($rs,$_SESSION[qn]);
$row= mysql_fetch_row($rs);
echo "<form name=quiz method=post action=quiz.php onsubmit=return validate()>";
echo "<table width=100%> <tr> <td width=30> <td> <table border=0>";
$n=$_SESSION[qn]+1;
echo "<tR><td><span class=style2>Que ". $n .": $row[2]</style>";
echo "<tr><td class=style8><input type=radio name=ans value=1>$row[3]";
echo "<tr><td class=style8> <input type=radio name=ans value=2>$row[4]";
echo "<tr><td class=style8><input type=radio name=ans value=3>$row[5]";
echo "<tr><td class=style8><input type=radio name=ans value=4>$row[6]";
if($_SESSION[qn]<mysql_num_rows($rs)-1)
echo "<tr><td><input type=submit name=submit class='btn btn-lg btn-black' value='Next Question'></form>";
else
echo "<tr><td><input type=submit name=submit class='btn btn-lg btn-black' value='Get Result'></form>";
echo "</table></table>";
?>
</div>
</div>
This code i am using guys but problem is that the auto timer not submitting the quiz after over
Use setInterval instead of setTimeout. Because if you use setTimeout your countDown function will fire just one time.
setInterval(function() {
countDown(secs, elem)
},1500);

Dependent dropdowns not working, 2nd dropdown not loading

I need help with this one, i dont know why the sub cat wont load. but the first dropdown loads all the queries. i just dont know why it wont work with the 2nd one.
here is my index.php
<?php
include('config.php');
$query_parent = mysql_query("SELECT * FROM zipcodes GROUP BY major_area") or die("Query failed: ".mysql_error());
?>
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>Dependent DropDown List</title>
<script type="text/javascript" src="js/jquery.js"></script>
<script type="text/javascript">
$(document).ready(function() {
$("#parent_cat").change(function() {
$(this).after('<div id="loader"><img src="img/loading.gif" alt="loading subcategory" /></div>');
$.get('loadsubcat.php?parent_cat=' + $(this).val(), function(data) {
$("#sub_cat").html(data);
$('#loader').slideUp(200, function() {
$(this).remove();
});
});
});
});
</script>
</head>
<body>
<form method="get">
<label for="category">Parent Category</label>
<select name="parent_cat" id="parent_cat">
<?php while($row = mysql_fetch_array($query_parent)): ?>
<option value="<?php echo $row['major_area']; ?>"><?php echo $row['major_area']; ?></option>
<?php endwhile; ?>
</select>
<br/><br/>
<label>Sub Category</label>
<select name="sub_cat" id="sub_cat"></select>
</form>
</body>
</html>
and here is my loadsubcat.php
<?php
include('config.php');
$parent_cat = $_GET['parent_cat'];
$query = mysql_query("SELECT city FROM zipcodes WHERE major_area = {$parent_cat}") or die(mysql_error());
while($row = mysql_fetch_array($query)) {
echo "<option value='$row[city]'>$row[city]</option>";
}
?>
please check my codes, and tell me where i did it wrong. it wont load for the 2nd drop down.
Try doing a simple AJAX function:
<script type="text/javascript">
function AjaxCall(ElemVal,PlaceId) {
$.ajax({
url: "loadsubcat.php?parent_cat="+$(ElemVal).val(),
success: function(result) {
$("#"+ PlaceId).html(result);
}
});
}
$(document).ready(function() {
$("#parent_cat").change(function() {
$("#sub-cat-load").html('<div id="loader"><img src="img/loading.gif" alt="loading subcategory" /></div>');
AjaxCall(this,'sub-cat-load');
});
});
</script>
sub_cat container
<label>Sub Category</label>
<!-- NOTICE THIS PART -->
<div id="sub-cat-load"></div>
loadsubcat.php
<?php
include('config.php');
// You may want to sanitize this variable
$parent_cat = $_GET['parent_cat'];
$query = mysql_query("SELECT city FROM zipcodes WHERE major_area = {$parent_cat}") or die(mysql_error()); ?>
<select name="sub_cat" id="sub_cat"><?php
while($row = mysql_fetch_array($query)) { ?>
<option value="<?php echo $row[city]; ?>"><?php echo $row[city]; ?></option><?php
} ?>
</select>

Categories