Here is my code I made a script to get values in "list_cust_city" from selected item in "list_cust_name" through query in php. I didnt get any values in "list_cust_city" for city. I made city.php.
<script>
$('#list_cust_name').change(function(){
alert("heyyy");
$.ajax({
url:'city.php',
data:{cust_name:$( this ).val()},
success: function( data ){
$('#list_cust_city').html( data );
}
});
});
</script>
<label style="color:#000">Name </label>
<?php
$query_name = "SELECT DISTINCT cust_name FROM customer_db ORDER BY cust_name"; //Write a query
$data_name = mysql_query($query_name); //Execute the query
?>
<select id="list_cust_name" name="list_cust_name">
<?php
while($fetch_options_name = mysql_fetch_assoc($data_name)) { //Loop all the options retrieved from the query
$customer=$fetch_options_name['cust_name'];
?>
<option value="<?php echo $fetch_options_name['cust_name']; ?>"><?php echo $fetch_options_name['cust_name']; ?></option>
<?php
}
?>
</select>
city.php
<body>
<?php
include('dbconnect.php');
db_connect();
$cust_name1=$_GET['cust_name']; //passed value of cust_name
$query_city = "SELECT DISTINCT cust_city FROM customer_db WHERE cust_name='$cust_name1'ORDER BY cust_city"; //Write a query
$data_city = mysql_query($query_city); //Execute the query
while($fetch_options_city = mysql_fetch_assoc($data_city)) { //Loop all the options retrieved from the query
?>
<option value="<?php echo $fetch_options_city['cust_city']; ?>"><?php echo $fetch_options_city['cust_city']; ?></option>
<?php
}
?>
</body>
You must use document ready because the DOM isn't load.
$( document ).ready(function() {
$('#list_cust_name').change(function(){
alert("heyyy");
$.ajax({
url:'city.php',
data:{cust_name:$( this ).val()},
success: function( data ){
$('#list_cust_city').html( data );
}
});
});
});
PHP uses . to concat strings. Change your query to:
$query_city = 'SELECT DISTINCT cust_city FROM customer_db WHERE cust_name="'.$cust_name1.'"ORDER BY cust_city';
Also add this to your first php file:
<select id="list_cust_city" name="list_cust_city"></select>
Here's full code.
php 1:
<script src="http://code.jquery.com/jquery-latest.min.js"></script>
<script>
$(function() {
$('#list_cust_name').change(function(){
$.ajax({
url:'city.php',
data:{cust_name:$( this ).val()},
success: function( data ){
$('#list_cust_city').html( data );
}
});
});
});
</script>
<label style="color:#000">Name </label>
<?php $data_name = mysql_query("SELECT DISTINCT cust_name FROM customer_db ORDER BY cust_name");?>
<select id="list_cust_name" name="list_cust_name">
<?php while($fetch_options_name = mysql_fetch_assoc($data_name)) { ?>
<option value="<?php=$fetch_options_name['cust_name']; ?>"><?php=$fetch_options_name['cust_name']; ?></option>
<?php } ?>
</select>
<select id="list_cust_city" name="list_cust_city"></select>
city.php:
<?php
include('dbconnect.php');
db_connect();
$cust_name1=$_GET['cust_name'];
$data_city = mysql_query('SELECT DISTINCT cust_city FROM customer_db WHERE cust_name="'.$cust_name1.'" ORDER BY cust_city');
while($fetch_options_city = mysql_fetch_assoc($data_city)) {
?>
<option value="<?php=$fetch_options_city['cust_city'];?>"><?php=$fetch_options_city['cust_city'];?></option>
<?php
}
?>
Related
I have fetched some car brand names in a while loop and then for each brand name I make a select menu for the car names in another while loop by using the "brand id" as foreign key. And then I want to show the car names in a box each time someone changes the dropdown select options. Here's my code below :
$query = "SELECT * FROM brands";
$result = $db->query($query);
// Outer while loop
while($row = $result->fetch(PDO::FETCH_OBJ)){
$brand_id = $row->id;
?>
<div id="result"></div> <!-- The Ajax result will be shown here -->
<div><?php echo $row->brand_name ?></div>
<?php
$query2 = "SELECT * FROM cars WHERE brand_id = ?";
$result2 = $db->prepare($query);
$result2->execute(array($brand_id));
<select name="car" id="car">
// Inner while loop
while($row2 = $result2->fetch(PDO::FETCH_OBJ)){
?>
<option value="<?php echo $row2->id ?>"><?php echo $row2->car_name ?></option>
<?php
} // Closing Inner while loop
?>
</select>
<!-- Ajax -->
<script>
$(document).ready(function(){
$('#car').change(function(e){
e.preventDefault();
var car = $(this).val();
$.ajax({
url: "ajax.php",
type: "post",
data: {car: car},
success: function(data){
$('#result').html(data);
}
});
});
});
</script>
<?php
} // Closing outer while loop
In the ajax.php I have written the following code to echo the car name
$carName = $_POST['car'];
echo $carName;
But the issue is - it is just executed for the first option selected inside first inner loop of the first outer loop. I mean the ajax code only runs for the first iteration of the both loops.
I also tried to make the select menu and the result div unique by adding the "brand id" as follow :
<div id="result<?php echo $brand_id ?>"></div>
and
<select name="car" id="car<?php echo $brand_id ?>">
<option value="<?php echo $row2->id ?>"><?php echo $row2->car_name ?></option>
</select>
and also the ajax as following :
$('#car<?php echo $brand_id ?>').change(function(e){
e.preventDefault();
var car = $(this).val();
$.ajax({
url: "ajax.php",
type: "post",
data: {car: car},
success: function(data){
$('#result<?php echo $brand_id ?>').html(data);
}
});
But it didn't work. Please suggest your best possible solutions. Thank you.
Try my code
$query = "SELECT * FROM brands";
$result = $db->query($query);
// Outer while loop
while($row = $result->fetch(PDO::FETCH_OBJ)){
$brand_id = $row->id;
?>
<div id="result<?php echo $brand_id;?>"></div> <!-- The Ajax result will be shown here -->
<div><?php echo $row->brand_name ?></div>
<?php
$query2 = "SELECT * FROM cars WHERE brand_id = ?";
$result2 = $db->prepare($query);
$result2->execute(array($brand_id));
// Inner while loop
while($row2 = $result2->fetch(PDO::FETCH_OBJ)){
?>
<select name="car[]" id="car<?php echo $row2->id ?>">
<option value="<?php echo $row2->id ?>"><?php echo $row2->car_name ?></option>
</select>
<!-- Ajax -->
<script>
$(document).ready(function(){
$('#car<?php echo $row2->id ?>').change(function(e){
e.preventDefault();
var car = $(this).val();
$.ajax({
url: "ajax.php",
type: "post",
data: {car: car},
success: function(data){
console.log(data);
$('#result<?php echo $brand_id;?>').html(data);
}
});
});
});
</script>
<?php
}
}
The select and ajax code should be out of while loop. just check the code below
<?php $query = "SELECT * FROM brands";
$result = $db->query($query);
// Outer while loop
while($row = $result->fetch(PDO::FETCH_OBJ)){
$brand_id = $row->id;
?>
<div id="result"></div> <!-- The Ajax result will be shown here -->
<div><?php echo $row->brand_name ?></div>
<?php
$query2 = "SELECT * FROM cars WHERE brand_id = ?";
$result2 = $db->prepare($query);
$result2->execute(array($brand_id)); ?>
<select name="car" id="car">
<?
// Inner while loop
while($row2 = $result2->fetch(PDO::FETCH_OBJ)){
?>
<option value="<?php echo $row2->id ?>"><?php echo $row2->car_name ?></option>
<?php
} // Closing Inner while loop
?>
</select>
<!-- Ajax -->
<script>
$(document).ready(function(){
$('#car').change(function(e){
e.preventDefault();
var car = $(this).val();
$.ajax({
url: "ajax.php",
type: "post",
data: {car: car},
success: function(data){
$('#result').html(data);
}
});
});
});
</script>
<?php
} // Closing outer while loop
?>
``
You need not call ajax() in a while loop.
Simply you can call .change() on
<select name="car" onchange="getCar(this.value)">
<script type="text/javascript">
function getCar(car) {
$.ajax({
url: "ajax.php",
type: "post",
data: {car: car},
success: function(data){
$('#result').html('');
$('#result').html(data);
}
});
}
</script>
<div id="result"></div>
I am banging my head against a wall with this now so any help will go a long way with this one.
I am trying to get some data from a drop down list and update a database with the data selected.
This is my drop down list:
<form method="post" data-remote="true">
<select class="selectpicker" data-live-search="true" name="status[]">
<?php while($test3 = sqlsrv_fetch_array($test2, SQLSRV_FETCH_ASSOC)) : ?>
<option data-tokens="<?php echo $test3['Name']; ?>" value="<?php echo $test3['Name']; ?>">
</option
<?php endwhile; ?>
</select>
View Area
This is my ajax:
$(document).on('click', '#sim-area', function() {
$.ajax({
type: "POST",
url: 'sim-area.php',
data: {changeStatus: status},
success: function() {
"area switched"
}
});
});
and this is my page that is updating the databse (sim-area.php):
<?php
$userID = $user['userID'];
$selectedArea = $_GET['changeStatus'];
$queryAreaName = "
SELECT UserID, Name, U_NB, U_RTN
FROM Table
WHERE UserID = '$userID' AND Name = '$selectedArea'";
$getAreaname = sqlsrv_query($sapconn2, $queryAreaName);
$areaSwitch = sqlsrv_fetch_array($getAreaname, SQLSRV_FETCH_ASSOC);
$areaNB = $test2['U_NB'];
$areaRTN = $test2['U_RTN'];
//UPDATE TABLE
?>
No matter what I try I get an undefined error, I have changed it to hard code the values and in inserts fine, so I know everything is working fine, It just isn't passing the data through
Looks you are not passing data correctly to ajax call.
Below is updated code for dropdown (changed name of select and added id attribute):
<form method="post" data-remote="true">
<select class="selectpicker" data-live-search="true" name="status" id="changeStatus">
<?php while($test3 = sqlsrv_fetch_array($test2, SQLSRV_FETCH_ASSOC)) : ?>
<option data-tokens="<?php echo $test3['Name']; ?>" value="<?php echo $test3['Name']; ?>">
</option
<?php endwhile; ?>
</select>
Updated code for jquery (changed code for passing value of data):
$(document).on('click', '#sim-area', function() {
$.ajax({
type: "POST",
url: 'sim-area.php',
data: {changeStatus: $('#changeStatus').val()},
success: function() {
"area switched"
}
});
});
I have a drop menu that includes some category every category has their own subcategory i want to show them buy selecting category name
but it's not working, did i miss something or am i doing it completely wrong?
<script type="text/javascript">
$(function() {
$("#error").hide();
$("#category").change(function(){
$("#error").hide();
var category = $("#category").val();
if (category == "") {
$("#error").show();
return false;
}
var data = $("#form").serialize();
$.ajax({
type:"POST",
url:"index.php",
data:data,
success: function(){
}
});
return false;
});
});
</script>
<form id="form" name="form">
<label for="category" id="error">Empty</label>
<select name="category" id="category">
<option></option>
<option value="News">News</option>
<option value="Items">Items</option>
<option value="Updates">Updates</option>
</select>
</form>
<?php
include("connect.php");
if(!empty($_POST['category'])){
$sql=$con->prepare("SELECT * FROM categorys WHERE category=:category ");
$sql->bindparam(":category",$_POST['category']);
$sql->execute();
while($r=$sql->fetch()){
echo $r['subcategory'];
}
}
?>
SomePage.php
<form id="form" name="form">
<div id='category'>
<label for="category" id="error">Empty</label>
<select name="category" id="category">
<option></option>
<option value="News">News</option>
<option value="Items">Items</option>
<option value="Updates">Updates</option>
</select>
</div>
<div id='subcategory'>
</div>
</form>
<script>
$('#category').change(function(){
var CatName= $('#category').val();
$.ajax({url:"AjaxSelectCategory.php?CatName="+CatName,cache:false,success:function(result){
$('#subcategory').html(result);
}});
});
</script>
Create New Page AjaxSelectCategory.php
[NOTE: If you want to change this page name. Change in <script></script> tag too. Both are related.]
<?php
include("connect.php");
if(!empty($_GET['CatName']))
{
$sql=$con->prepare("SELECT * FROM categorys WHERE category=:category ");
$sql->bindparam(":category",$_GET['CatName']);
$sql->execute();
?>
<select name='subcategory'>
<?php
while($r=$sql->fetch())
{?>
<option value="<?php echo $r['subcategory'];?>"><?php echo $r['subcategory'];?></option>
</select>
<?php }
}?>
Try like this,
$.ajax({
type:"POST",
url:"get_subcategory.php",
data:data,
success: function(data){
alert(data)// this will have the second dropdown. add to desired place in your view.
}
});
In get_subcategory.php
$sql = "Select * from table_name where catregory = ".$_POST'category'];
// execute the query.
$sub = "<select name='sub-category'>";
foreach(result from database as $row) {
$sub .= "<option value='$row->id'>$row->name</option>";
}
$sub .= "</select>";
echo $sub;
My Code:
select name="accttype">
<?php foreach($query as $row)
{
$act=$row->accounttype;
?>
<option value="<?php echo$act;?>"><?php echo$act;?></option>
<?php
}
?>
</select>
When I select the dropdown list I want to to redirect different functions to load different pages, like:
<option value="<?php echo site_url('Controller_n/function'><?php echo$act;?></option>
Is this possible?
Check this sample:
<select id="accttype" name="accttype">
<?php foreach($query as $row)
{
$act=$row->accounttype;
?>
<option value="<?php echo $act ?>"><?php echo $act ?></option>
<?php } ?>
</select>
<script>
$(function(){
// bind change event to select
$('#accttype').on('change', function () {
var url = $(this).val(); // get selected value
if (url) { // require a URL
window.location = url; // redirect
}
return false;
});
});
</script>
Give a id to your select like below
<select id="accttype">
<?php foreach($query as $row)
{
$act=$row->accounttype; ?>
<option value="<?php echo$act;?>"><?php echo$act;?></option>
<?php } ?>
</select>
// add jquery library if you not added already
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>
<script>
$(document).ready(function(){
$('#accttype').change(function(){
window.location = $(this).val();
});
});
</script>
Hope it will help you.
I want to selected value from "list_cust_name" and want to pass it to another query to get the list of "list_cust_city". This list will show city of the customer which is selected from "list_cust_name". My table contains cust_id,cust_name,cust_city_cust_state.
<script src="http://code.jquery.com/jquery-latest.min.js"></script>
<script>
$(function() {
$('#list_cust_name').change(function(){
$.ajax({
url:'city.php',
data:{cust_name:$( this ).val()},
success: function( data ){
$('#list_cust_city').html( data );
}
});
});
});
</script>
<label style="color:#000">Name </label>
<?php $data_name = mysql_query("SELECT DISTINCT cust_name FROM customer_db ORDER BY cust_name");?>
<select id="list_cust_name" name="list_cust_name">
<?php while($fetch_options_name = mysql_fetch_assoc($data_name)) { ?>
<option value="<?php=$fetch_options_name['cust_name']; ?>"><? php=$fetch_options_name['cust_name']; ?></option>
<?php } ?>
</select>
<select id="list_cust_city" name="list_cust_city"></select>
city.php
<?php
include('dbconnect.php');
db_connect();
$cust_name1=$_GET['cust_name'];
$data_city = mysql_query('SELECT DISTINCT cust_city FROM customer_db WHERE cust_name="'.$cust_name1.'" ORDER BY cust_city');
while($fetch_options_city = mysql_fetch_assoc($data_city)) {
?>
<option value="<?php=$fetch_options_city['cust_city'];?>"><?php=$fetch_options_city['cust_city'];?></option>
<?php
}
?>
I removed the id="list_cust_city" from the select, put it for a div that contains the select, the made the ajax return a full Select and put it inside that div. And added mysql_real_escape_string for the $GET to protect from mysql injection. You should consider starting to use mysqli or PDO as mysql* is deprecated.
<script src="http://code.jquery.com/jquery-latest.min.js"></script>
<script>
$(function() {
$('#list_cust_name').change(function(){
$.ajax({
url:'city.php',
data:{cust_name:$( this ).val()},
success: function( data ){
$('#list_cust_city').html( data );
}
});
});
});
</script>
<label style="color:#000">Name </label>
<?php $data_name = mysql_query("SELECT DISTINCT cust_name FROM customer_db ORDER BY cust_name");?>
<select id="list_cust_name" name="list_cust_name">
<?php while($fetch_options_name = mysql_fetch_assoc($data_name)) { ?>
<option value="<?php=$fetch_options_name['cust_name']; ?>"><? php=$fetch_options_name['cust_name']; ?></option>
<?php } ?>
</select>
<div id="list_cust_city">
<select name="list_cust_city"></select>
</div>
city.php
<?php
include('dbconnect.php');
db_connect();
$cust_name1=mysql_real_escape_string($_GET['cust_name']);
$data_city = mysql_query("SELECT DISTINCT cust_city FROM customer_db WHERE cust_name='$cust_name1' ORDER BY cust_city");
?>
<select name="list_cust_city">
<?php
while($fetch_options_city = mysql_fetch_assoc($data_city)) {
?>
<option value="<?php=$fetch_options_city['cust_city'];?>"><?php=$fetch_options_city['cust_city'];?></option>
<?php
}
?>
</select>