I am getting $pgcode value required for the second select option but the form is refreshed which I do not want. I also tried adding some html divs but in that case the form is duplicating some content and also refreshing.
How can I make this work without a refresh occurring?
<?php
if (session_id() == '') {
session_start();
ob_start();
}
error_reporting(E_ALL | E_NOTICE);
ini_set('display_errors', '1');
include("dbc.php");
if (isset($_POST['model'])) {
$pgcode = $_POST['model'];
}
?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<script src="js/jquery-1.10.1.min.js" type="text/javascript"></script>
<script>
$('#dataTable').on('change','.select-desc',function(){
var cur_val = $(this).val();
$.ajax({
method:"POST",
url:"cashtran.php",
data:{model:cur_val},
success:function(result){
$('body').html(result);
},
});
});
});
</script>
</head>
<body id="top">
<br class="clear" />
<div class="wrapper col4">
<div id="container">
<div id="content">
<form method="post" name="frmcashtran" action="">
<h3><span class="orange">Cash Payment Details</span></h3>
<fieldset>
<table>
<tr>
<td><input type="button" value="Add Row" id="addRow" /></td>
<td><input type="button" value="Remove Row" id="deleteRow"/></td>
</tr>
</table>
<table id="dataTable" border="0">
<tr>
<td></td>
<td><label>Main A/c</label></td>
<td><label>Subledger</label></td>
<td><label>Narration</label></td>
<td><label>Amount</label></td>
</tr>
<tr>
<td>
<?php
$sql = "SELECT gcode,acname FROM account ";
$result = mysqli_query($conn, $sql) or die(mysqli_error());
echo "<select name='acname[]' class='select-desc' tabindex='2'>";
echo "<option value=''>-- Select Main A/c --</option>";
while ($row = mysqli_fetch_array($result)) {
echo "<option value = '{$row['gcode']}'";
if ($pgcode == $row['gcode'])
echo "selected = 'selected'";
echo ">{$row['acname']}</option>";
}
echo "</select>";
?>
</td>
<td>
<?php
$sql = "SELECT scode,sname FROM subldg where gcode='$pgcode' ";
$result = mysqli_query($conn, $sql) or die(mysqli_error());
echo "<select name='slname[]' tabindex='2'>";
echo "<option value=''>-- Select Subledger--</option>";
while ($row = mysqli_fetch_array($result)) {
echo "<option value = '{$row['scode']}'";
if ($pscode == $row['scode'])
echo "selected = 'selected'";
echo ">{$row['sname']}</option>";
}
echo "</select>";
?>
</td>
</table>
</form>
</body>
</html>
If the entire page is being sent back as the response to the ajax request change the following PHP code
if (isset($_POST['model'])) {
$pgcode = $_POST['model'];
}
to
if( isset( $_POST['model'] ) ) {
ob_clean();
$pgcode = $_POST['model'];
exit( $pgcode );
}
Related
when page is loaded it display error that id, name and address is undefined. These variable are getting on condition of edit, but i dont understand how to place these values in text filed 'value' for edit as this is not working. The main code is like this.*** also the code of update is not updating values but it displays your record is updated
<?php
include 'server.php';
if (isset($_GET['edit'])) {
$id = $_GET['edit'];
$update = true;
$record = mysqli_query($con, "SELECT * FROM info WHERE id=$id");
if (count($record) == 1) {
$n = mysqli_fetch_array($record);
$name = $n['name'];
$address = $n['address'];
}
}
?>
<!-- Form -->
<!DOCTYPE html>
<html>
<head>
<title>CReate, Update</title>
<link rel="stylesheet" type="text/css" href="style.css">
</head>
<body>
<form method="post" action="php_code.php" >
<input type="hidden" name="id" value="<?php echo $id; ?>">
<input type="text" name="name" value="<?php echo $name; ?>">
<input type="text" name="address" value="<?php echo $address; ?>">
<div class="input-group">
<?php if ($update == true): ?>
<button class="btn" type="submit" name="update" >Update</button>
<?php else: ?>
<button class="btn" type="submit" name="submit" >save</button>
<?php endif ?>
</div>
</form>
<!-- Display -->
<?php
$i = 1;
$q = mysqli_query($con, "select*from info");
while ($f = mysqli_fetch_array($q)) {
?>
<table>
<th> sr N0</th>
<th> Name</th>
<th> address</th>
<th> Action</th>
<tr>
<td> <?php echo $i; ?> </td>
<td> <?php echo $f['name']; ?> </td>
<td> <?php echo $f['address']; ?> </td>
<td><a href="index.php?edit=<?php echo $f['id']; ?>" class="edit_btn" >Edit</a></td>
</tr>
<?php $i ++;
}
?>
</table>
</body>
</html>
<?php
include 'server.php';
if (isset($_POST['save']))
{
$name= $_POST['name'];
$add= $_POST['address'];
$q = "INSERT into info (name,address) VALUES ('$name', '$add')";
mysqli_query($con, $q);
echo "inserted";
}
if (isset($_POST['update']))
{
$uname= $_POST['name'];
$uaddress= $_POST['address'];
$q = "UPDATE info set name= '$uname', adress= '$uaddress' WHERE id = $id";
mysqli_query($con, $q);
echo "updated";
}
?>
Make
if (count($record) == 1 ) {
to
if (mysqli_num_rows($record) == 1 ) {
After php and mysql outputs a list of data in a table with radio buttons, dropdown boxes and text boxes for each row from the database, I'd like to be able to AJAX update the database onclick of radio button, dropdown boxes or entry of text. This is what I have...
<!DOCTYPE html>
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
</head>
<?php
require_once 'config.php';
echo '<table style="margin:0 auto;">
<tr>
</tr>';
$sql = "SELECT id, address, suburb, lat, lng, day, date, time FROM addresses";
$result = $conn->query($sql);
if ($result->num_rows > 0) {
// output data of each row
while($row = $result->fetch_assoc()) {
echo '<tr>
<td><span style="font-weight:bold;">'. $row["address"].' '. $row["suburb"].'</span> <button style="float:right;" type="button">Go</button><br><br>
H<input type="radio" name="home['. $row["id"].']" value="1"/>
NH<input type="radio" name="home['. $row["id"].']" value="2"/>
<select style="padding:1.4px;">
<option></option>
<option>Mo</option>
<option>Tu</option>
<option>We</option>
<option>Th</option>
<option>Fr</option>
<option>Sa</option>
<option>Su</option>
</select>
<input type="text" name="time1" size="2">
<select style="padding:1.4px;">
<option></option>
<option>Mo</option>
<option>Tu</option>
<option>We</option>
<option>Th</option>
<option>Fr</option>
<option>Sa</option>
<option>Su</option>
</select>
<input type="text" name="time2" size="2"><br>
<input style="width:100%; margin-top:5px;" type="text" name="notes" placeholder="Add note">
<br><br>
</td>
<td>
</td>
</tr>';
}
} else {
echo "0 results";
}
echo '</table>';
$conn->close();
?>
<script>
$(document).ready(function(){
$('input[type="radio"]').click(function(){
var home = $(this).val();
$.ajax({
url:"updateaddress.php",
method:"POST",
data:{home:home},
});
});
});
</script>
<?php
// Include config file
require_once 'config.php';
$id = mysqli_real_escape_string($conn, $_POST['id']);
$home = mysqli_real_escape_string($conn, $_POST['home']);
if(isset($_POST["home"])) {
$sql = "UPDATE addresses SET home='$home' WHERE id=$id";
if($conn->query($sql) === TRUE){
} else {
echo "error" . $sql . "<br>".$conn->error;
}
}
mysqli_close($conn);
header("Location: {$_SERVER['HTTP_REFERER']}");
exit;
?>
I can't figure out what I need to do to get this to work.
Please help.
You need to pass the id of the row in to that ajax page...
<!DOCTYPE html>
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
</head>
<?php
require_once 'config.php';
echo '<table style="margin:0 auto;">
<tr>
</tr>';
$sql = "SELECT id, address, suburb, lat, lng, day, date, time FROM addresses";
$result = $conn->query($sql);
if ($result->num_rows > 0) {
// output data of each row
while($row = $result->fetch_assoc()) {
echo '<tr>
<td><span style="font-weight:bold;">'. $row["address"].' '. $row["suburb"].'</span> <button style="float:right;" type="button">Go</button><br><br>
H<input type="radio" name="home['. $row["id"].']" id="'. $row["id"].'" value="1"/>
NH<input type="radio" name="home['. $row["id"].']" id="'. $row["id"].'" value="2"/>
<select style="padding:1.4px;">
<option></option>
<option>Mo</option>
<option>Tu</option>
<option>We</option>
<option>Th</option>
<option>Fr</option>
<option>Sa</option>
<option>Su</option>
</select>
<input type="text" name="time1" size="2">
<select style="padding:1.4px;">
<option></option>
<option>Mo</option>
<option>Tu</option>
<option>We</option>
<option>Th</option>
<option>Fr</option>
<option>Sa</option>
<option>Su</option>
</select>
<input type="text" name="time2" size="2"><br>
<input style="width:100%; margin-top:5px;" type="text" name="notes" placeholder="Add note">
<br><br>
</td>
<td>
</td>
</tr>';
}
} else {
echo "0 results";
}
echo '</table>';
$conn->close();
?>
<script>
$(document).ready(function(){
$('input[type="radio"]').click(function(){
var home = $(this).val();
var id = $(this).attr('id');
$.ajax({
url:"updateaddress.php",
method:"POST",
data:{home:home,id:id},
});
});
});
</script>
<?php
// Include config file
require_once 'config.php';
$id = mysqli_real_escape_string($conn, $_POST['id']);
$home = mysqli_real_escape_string($conn, $_POST['home']);
if(isset($_POST["home"])) {
$sql = "UPDATE addresses SET home='$home' WHERE id=$id";
if($conn->query($sql) === TRUE){
} else {
echo "error" . $sql . "<br>".$conn->error;
}
}
mysqli_close($conn);
header("Location: {$_SERVER['HTTP_REFERER']}");
exit;
?>
My code is: (Edited after a suggestion from an answer)
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>SomuFinance - Personal Finance Manager</title>
<link rel="stylesheet" type="text/css" href="indexStyle.css">
<script src="scripts/jquery-3.1.0.min.js"></script>
</head>
<body>
<form method="post" action="<?php echo $_SERVER['PHP_SELF']; ?>">
<div id="container">
<input type="submit" class="button" name="edit" value="Edit" />
<input type="button" class="button" name="delete" value="Delete" />
<input type="text" id="action" name="action">
<table id="listDB">
<tr>
<th>Select</th>
<th>ID</th>
<th>Category ID</th>
<th>Shop</th>
<th>Item</th>
<th>Quantity</th>
<th>Unit</th>
<th>Price Based On</th>
<th>MRP</th>
<th>Seller's Price</th>
<th>Last Updated On</th>
</tr>
<?php
$dbc = mysqli_connect('localhost','root','atlantis2016','itemDB')
or die("Error Connecting to Database");
if(isset($_POST['submit']))
{
echo "Action Set to ".$_POST['action'];
if($_POST['action']=='confirmDelete')
{
echo "Now Deleting!!";
foreach ($_POST['selected'] as $delete_id)
{
$query = "DELETE FROM grocery WHERE id = $delete_id";
mysqli_query($dbc, $query)
or die('Error querying database.');
}
}
}
$query1 = "SELECT DISTINCT category FROM grocery";
$result1 = mysqli_query($dbc, $query1)
or die("Error Querying Database");
while($row = mysqli_fetch_array($result1))
{
$category = $row['category'];
$query2 = "SELECT * FROM grocery WHERE category='$category' ORDER BY item ASC";
$result2 = mysqli_query($dbc, $query2)
or die("Error Querying Database");
echo '<tr>';
echo '<td class="catHead" colspan=11>'.$category.'</td>';
echo '</tr>';
$catCount=1;
while($inRow = mysqli_fetch_array($result2))
{
$id = $inRow['id'];
$shop = $inRow['shop'];
$item = $inRow['item'];
$qnty = $inRow['quantity'];
$unit = $inRow['unit'];
$price_based_on = $inRow['price_based_on'];
$mrp = $inRow['MRP'];
$sellers_price = $inRow['sellers_price'];
$last_updated_on = $inRow['last_updated_on'];
echo '<tr>';
echo '<td><input type="checkbox" value="' . $id . '" name="selected[]" /></td>';
echo '<td>'.$id.'</td>';
echo '<td>'.$catCount.'</td>';
echo '<td>'.$shop.'</td>';
echo '<td class="leftAligned">'.$item.'</td>';
echo '<td>'.$qnty.'</td>';
echo '<td>'.$unit.'</td>';
echo '<td>'.$price_based_on.'</td>';
echo '<td class="pri">₹'.$mrp.'</td>';
echo '<td class="pri">₹'.$sellers_price.'</td>';
echo '<td>'.$last_updated_on.'</td>';
echo '</tr>';
$catCount++;
}
}
mysqli_close($dbc);
?>
<input type="submit" value="Submit">
</table>
</div>
<div class="dialogBG">
<div id="deleteConfirmDialog" class="dialog">
<div class="closeDialog"></div>
<p>Sure you want to delete the selected Data?</p>
<input type="submit" id="confirmDelete" class="dialogButton" name="edit" value="Delete" />
<input type="button" class="dialogButton cancelButton" name="delete" value="Cancel" />
</div>
</div>
</form>
<script type="text/javascript">
$(document).ready(function(){
$('.button').click(function(){
if($(this).val()=="Delete")
{
$(".dialogBG").fadeIn(200);
$("#deleteConfirmDialog").show(200);
$("#action").val('confirmDelete');
}
else if($(this).val()=="Edit")
{
}
});
$('#confirmDelete').click(function(){
$(".closeDialog").trigger("click");
});
$('#cancelDelete').click(function(){
});
$(".closeDialog").click(function (e){
$(this).parent(".dialog").hide('200').parent(".dialogBG").fadeOut('200');
});
$(".cancelButton").click(function (e){
$(this).parent(".dialog").hide('200').parent(".dialogBG").fadeOut('200');
});
$("form").submit(function(e){
alert("Form is being sumbitted!");
});
});
</script>
</body>
</html>
I want the elements for which the checkbox is selected, contained in the php array selected[], to be deleted from the database. Before deletion, I want a confirmation dialog box to open up, which will contain the "submit" button. This will cause the actual deletion. However, for some reason the above code doesn't work. I can't even be sure if the post is being submitted, as the line echo "Action Set to ".$_POST['action']; doesn't return any output. Please help.
I believe this entire section of code is not working (from manual testing).
if(isset($_POST['submit']))
{
echo "PHP Working here!";
echo "Action Set to ".$_POST['action'];
if($_POST['action']=='confirmDelete')
{
echo "Now Deleting!!";
foreach ($_POST['selected'] as $delete_id)
{
$query = "DELETE FROM grocery WHERE id = $delete_id";
mysqli_query($dbc, $query)
or die('Error querying database.');
}
}
}
Any ideas why?
you need to put these inputs inside a form and set an action. like below:
<form action="<?php echo $_SERVER['PHP_SELF']; ?>" method="post" role="form">
<input></input>
<input></input>
</form>
this will be your code
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>SomuFinance - Personal Finance Manager</title>
<link rel="stylesheet" type="text/css" href="indexStyle.css">
<script src="scripts/jquery-3.1.0.min.js"></script>
</head>
<body>
<div id="container">
<form method="post" action="<?php echo $_SERVER['PHP_SELF']; ?>" role="form">
<input type="submit" class="button" name="edit" value="Edit" />
<input type="button" class="button" name="delete" value="Delete" />
<input type="text" id="action" name="action">
<table id="listDB">
<tr>
<th>Select</th>
<th>ID</th>
<th>Category ID</th>
<th>Shop</th>
<th>Item</th>
<th>Quantity</th>
<th>Unit</th>
<th>Price Based On</th>
<th>MRP</th>
<th>Seller's Price</th>
<th>Last Updated On</th>
</tr>
<?php
$dbc = mysqli_connect('localhost','root','atlantis2016','itemDB')
or die("Error Connecting to Database");
if(isset($_POST['submit']))
{
echo "Action Set to ".$_POST['action'];
if($_POST['action']=='confirmDelete')
{
echo "Now Deleting!!";
foreach ($_POST['selected'] as $delete_id)
{
$query = "DELETE FROM grocery WHERE id = $delete_id";
mysqli_query($dbc, $query)
or die('Error querying database.');
}
}
}
$query1 = "SELECT DISTINCT category FROM grocery";
$result1 = mysqli_query($dbc, $query1)
or die("Error Querying Database");
while($row = mysqli_fetch_array($result1))
{
$category = $row['category'];
$query2 = "SELECT * FROM grocery WHERE category='$category' ORDER BY item ASC";
$result2 = mysqli_query($dbc, $query2)
or die("Error Querying Database");
echo '<tr>';
echo '<td class="catHead" colspan=11>'.$category.'</td>';
echo '</tr>';
$catCount=1;
while($inRow = mysqli_fetch_array($result2))
{
$id = $inRow['id'];
$shop = $inRow['shop'];
$item = $inRow['item'];
$qnty = $inRow['quantity'];
$unit = $inRow['unit'];
$price_based_on = $inRow['price_based_on'];
$mrp = $inRow['MRP'];
$sellers_price = $inRow['sellers_price'];
$last_updated_on = $inRow['last_updated_on'];
echo '<tr>';
echo '<td><input type="checkbox" value="' . $id . '" name="selected[]" /></td>';
echo '<td>'.$id.'</td>';
echo '<td>'.$catCount.'</td>';
echo '<td>'.$shop.'</td>';
echo '<td class="leftAligned">'.$item.'</td>';
echo '<td>'.$qnty.'</td>';
echo '<td>'.$unit.'</td>';
echo '<td>'.$price_based_on.'</td>';
echo '<td class="pri">₹'.$mrp.'</td>';
echo '<td class="pri">₹'.$sellers_price.'</td>';
echo '<td>'.$last_updated_on.'</td>';
echo '</tr>';
$catCount++;
}
}
mysqli_close($dbc);
?>
</table>
</form>
</div>
<script type="text/javascript">
$(document).ready(function(){
$('.button').click(function(){
if($(this).val()=="Delete")
{
$(".dialogBG").fadeIn(200);
$("#deleteConfirmDialog").show(200);
$("#action").val('confirmDelete');
}
else if($(this).val()=="Edit")
{
}
});
$('#confirmDelete').click(function(){
$(".closeDialog").trigger("click");
});
$('#cancelDelete').click(function(){
});
$(".closeDialog").click(function (e){
$(this).parent(".dialog").hide('200').parent(".dialogBG").fadeOut('200');
});
$(".cancelButton").click(function (e){
$(this).parent(".dialog").hide('200').parent(".dialogBG").fadeOut('200');
});
});
</script>
<div class="dialogBG">
<div id="deleteConfirmDialog" class="dialog">
<div class="closeDialog"></div>
<p>Sure you want to delete the selected Data?</p>
<input type="submit" id="confirmDelete" class="dialogButton" name="edit" value="Delete" />
<input type="button" class="dialogButton cancelButton" name="delete" value="Cancel" />
</div>
</div>
</body>
</html>
The solution was simple. if(isset($_POST['confirmDelete'])) needs to be there instead of if(isset($_POST['submit'])) in the problem section in the question as there is no button called "submit" in the entire form.
I have 3 tables in my database (standards, courses, students). I want to display Fname and gender from students table enrolled in selected 'standard' and 'course' from dropdown - but the "submit" button doesn't seem to work. The code is as shown below. I am sure it is connected to the database as the dropdowns for 'courses' and 'standards' work:
<html>
<head>
<title>Courses</title>
<link rel="stylesheet" type="text/css" href="css/style.css">
</head>
<body>
<div id="container">
<div id="wrapper">
<h1> Students</h1>
<div id="data">
<form action="index.php" method="POST">
<select name="standards">
<option>Standard</option>
<?php
include 'includes/dbconnect.php';
$query1 = "SELECT * FROM standards";
$result1 = mysql_query($query1);
while($rows1 = mysql_fetch_array($result1)){
$standardID = $rows1['id'];
$rowsData1 = $rows1['standardName'];
?>
<option value="<?php echo $standardID; ?>">
<?php
echo $rowsData1; ?></option>
<?php
}
?>
</select>
</div>
<div id="data2">
<select name="courses">
<option>Courses</option>
<?php
$query2 = "SELECT * FROM courses";
$result2 = mysql_query($query2);
while($rows2 = mysql_fetch_array($result2)){
$coursesID = $rows2['id'];
$rowsData2 = $rows2['courseName'];
?>
<option value="<?php echo $courseID;?>">
<?php echo $rowsData2; ?></option> <?php }?>
</select>
</div>
<div id="submit">
<input type="submit" name="submit" id="submit" value="submit"/>
<table border="1" id="table1">
<tr>
<th>Student Name</th>
<th>Gender</th>
</tr>
<?php
if(isset($_POST['submit'])){
$standardName = $_POST['standards'];
$courseName = $_POST['courses'];
$query3 = "SELECT students.Fname, students.gender
FROM students
WHERE students.standardID = '$standardName'
AND students.courseID = '$courseName'";
$result3 = mysql_query($query3);
while($rows3 = mysql_fetch_array($result3)){
//$dataID = $rows3['id'];
$studentName = $rows3['FName'];
$gender = $rows3['gender'];
?>
<tr>
<td><?php echo $studentName; ?></td>
<td><?php echo $gender; ?></td>
<tr>
<?php
}
}
?>
</table>
</div>
</div>
</body>
</html>
Inscribe the input elements within a form tag with post as method. Input elements with type submit are used for submission of forms.
You only do anything with the submitted form data if that data includes a submit field.
if(isset($_POST['submit'])){
However you have:
<input type="submit" name="submit" id="submit"/>
Your submit button don't have a value, so nothing will be included in the form data for it.
subjects
course
chapters
I want to add 2 dynamic dropdown lists, one is for subjects, and one is for course. When I select subject, courses which is added to that subject should be loaded in the course dropdown list, and then add chapters to that courses.
How do I do that?
Any help would be appreciated.
Here is my code:
<div class="content-form-inner">
<div id="page-heading">Enter the details</div>
<div class="form_loader" id="thisFormLoader"></div>
<div id="error_message"></div>
<form name="thisForm" id="thisForm" action="editchapters.php?mode=<?php echo $_REQUEST['mode']; ?>&id=<?php echo $id; ?>" method="post" enctype="multipart/form-data">
<table border="0" cellpadding="0" cellspacing="0" id="id-form" >
<tr>
<th valign="top" style="width:0%"><span class="required">*</span>Subject</th>
<td style="width: 0%">
<select name="subject_name" class="select-form required " style="color:#000 !important;width:200px !important">
<option value="">Select</option>
<?php
$sql = "select * from mock_subject ";
$res = mysqli_query($dbhandle,$sql);
$numrows =mysqli_num_rows($res);
echo mysql_error();
if($numrows){
while($obj = mysqli_fetch_object($res)){
if($obj->status == 1){
if($subject == $obj->id){
echo '<option value="'.$obj->id.'" selected>'.($obj->subject_name).'</option>';
}
else{
echo '<option value="'.$obj->id.'">'.($obj->subject_name).'</option>';
}
}
}
}
?>
</select>
</td>
<td style="width: 0%;">
<div id="subject_id-error" class="error-inner"></div>
</td>
<td></td>
</tr>
<tr>
<th valign="top" style="width:0%"><span class="required">*</span>Course</th>
<td style="width: 0%">
<select name="course_name" class="select-form required " style="color:#000 !important;width:200px !important">
<option value="">Select</option>
<?php
$sql = "select * from mock_course ";
$res = mysqli_query($dbhandle,$sql);
$numrows =mysqli_num_rows($res);
echo mysql_error();
if($numrows){
while($obj = mysqli_fetch_object($res)){
if($obj->status == 1){
if($course == $obj->id){
echo '<option value="'.$obj->id.'" selected>'.($obj->course_name).'</option>';
}
else{
echo '<option value="'.$obj->id.'">'.($obj->course_name).'</option>';
}
}
}
}
?>
</select>
</td>
<td style="width: 0%;">
<div id="course_id-error" class="error-inner"></div>
</td>
<td></td>
</tr>
<tr>
<th><span class="required">*</span>Chapter</th>
<td><input type="text" name="chapter_name" class="inp-form required" value="<?php echo $chapter;?>" style="color:#000 !important;"></td>
<td>
<div></div>
</td>
</tr>
<tr>
<th> </th>
<td valign="top"><input type="submit" name="submit_button" value="<?php echo $mode=="edit"? "Update" : "Add" ?>" class="form-submit" />
<input type="reset" value="Reset" class="form-reset" />
</tr>
</table>
</form>
<div class="clear"></div>
</div>
One possible solution would, if your data set is comparatively small. Load all the data on page load, and use jquery to get value of dropdown, and based on that formulate the values for the other drop downs.
Second Solution would be to us AJAX and call data from your database for every action. and print using Angular.
I've attached a sample code for that.
This is my_script.js
var app = angular.module('myApp', []);
app.controller('customersCtrl', function($scope, $http) {
$(document).ready(function(){
callSetTimeout();
});
function callSetTimeout(){
setTimeout(function(){
update();
callSetTimeout();
},200);
}
function update(){
$http.get("http://localhost/WhatsOnYourMInd/db.php")
.success(function (response) {$scope.names = response.records;});
}
});
This is for db.php
<?php
$servername = "localhost";
$username = "root";
$password = "";
$dbname = "mind";
// Create connection
$conn = new mysqli($servername, $username, $password, $dbname);
// Check connection
if ($conn->connect_error) {
die("Connection failed: " . $conn->connect_error);
}
$sql = "SELECT * FROM data";
$result = $conn->query($sql);
$jsonString=array();
if ($result->num_rows > 0) {
// output data of each row
while($row = $result->fetch_assoc()) {
array_push($jsonString,array('id' =>$row['id'],'name' =>$row['name'],'message' =>$row['message']));
}
echo json_encode(array("records"=>$jsonString));
} else {
echo "0 results";
}
$conn->close();
?>
This is for index.html
<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8">
<title>Whats on your Mind</title>
<script src= "http://ajax.googleapis.com/ajax/libs/angularjs/1.3.14/angular.min.js"></script>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script>
</head>
<body>
<ul id="ajax"></ul>
<div ng-app="myApp" ng-controller="customersCtrl">
<ol>
<li ng-repeat="x in names">
{{ 'Id:'+x.id + ' Name:' + x.name +' Message:'+x.message}}
</li>
</ol>
</div>
<script src="my_script.js"></script>
</body>
</html>
Easiest way of creating dynamic dropdown is by using jquery inside the head tag.
Give onchange() event and guide the data to another page using jquery code, and then link 2 dropdowns. The code I did is like this, which I felt is the easiest way for dynamic dropdowns.
jquery which I included is
<script>
function ajaxDrp(data){
$.ajax({
method: "POST",
url: "chapterDropdown.php",
data: {
id: data
}
}).success(function(data) {
$('#selectCourse').empty();
$('#selectCourse').append(data);
});
}
</script>
#selectCourse is the id I have given to the other dropdown which have to be in sync with the first dropdown.
The given url in the jquery is the path where data of first dropdown is getting collected. In my case, the code is like this:
<?php
$id = $_REQUEST['id'];
$query = "SELECT * FROM `your table name` WHERE subject_id = " . $id;
$result = mysqli_query($dbhandle,$query);
$count = 0;
$option`enter code here` = '';
while($row = mysqli_fetch_assoc($result)) {
$option .= '<option
value="'.$row['id'].'">'.$row['course_name'].'</option>';
}
echo $option;
?>