there are two drop downs naming country and state.....so how to hold the values whwn error occurs in the form.i have used ajax to list the state value
<select name="country" onchange="getstate(this.value,'')">
<option value="">Select</option>
<?php $option="";
$query="select * from tbl_country";
$res=mysql_query($query);
while ($country=mysql_fetch_array($res)) {?>
<option value="<?php echo $country['id']; ?>"><?php echo $country['country']; ?></option>
<?php }?>
</select>
<select id="state" >
</select>
/////ajax code///////
<script type="text/javascript">
function getstate(id) {
$.ajax({
type : 'post',
url : 'ajax.php',
data : {
act : 'get_state',
country : id,
},
success : function(data) {
data = data.replace(/\s*\n\s*/g, '');
if (data) {
document.getElementById('state').innerHTML = data;
} else {
}
return true;
}
});
}
</script>
///////ajax.php/////
if($_REQUEST['act']=="get_state"){
$statelist=array();
$countryid=$_REQUEST['country'];
$query="select * from tbl_state where id_country=".$countryid;
$result=mysql_query($query);
$option.='<option value="">select</option>';
while ($state=mysql_fetch_array($result)) {
$option.= '<option value="'.$state["state"].'">'.$state["state"].'</option>';
}
echo $option;
}
I want to hold both the values of country and state at the time of form submit(error occurs). how to do that?
Related
Currently I have 2 select boxes called Country and City. Now I've made it so that the city data is populated according to the value selected in country using AJAX. To do this I've used the following code:
edit.php:
<select name="country" onchange="getcities($(this).val())" required>
<option value="<?php echo set_value('country'); ?>">Select Country</option>
<?php if($countries) foreach($countries as $country): ?>
<option value="<?php echo $country['id']; ?>" <?php echo ($listing[0]['country'] == $country['id'])?'selected="selected"':''?>><?php echo $country['name']; ?></option>
<?php endforeach; ?>
</select>
<label class="control-labels ">City</label>
<div id="emiratewrap">
<select name="emirate" id="emirate">
<option value="">Select City</option>
</select>
AJAX
$(document).ready(function () {
getcities($('#country').val());
});
function getcities(obj){
console.log(obj);
var dataString = new Object();
dataString.emirate = '<?php echo $property->emirate ?>';
$.ajax({
type: "get",
dataType:"json",
url: "<?php echo site_url('listings/ajaxgetcitiesedit'); ?>/"+obj,
data: dataString,
success: function(e) { $('#emiratewrap').html(e.result);
$bb = "<?php echo $property->status; ?>";
if($bb=="Y") {$("#emiratewrap select").addClass("disabled"); }
}
});
}
Controller:
function ajaxgetcitiesedit($country=''){
$emirate = $this->input->get('emirate');
if(!$country) return false;
$cities = $this->listings_model->get_activepair_cities(array('country_id'=>$country),'*','name asc');
$html = '<select name="emirate" id="emirate" class="form-control select2 required" onchange="oemirate(this);">';
$html .= ($emirate <1)? '<option value="">Select Emirate</option>':'';
foreach($cities as $city):
$html .= '<option value="'.$city['id'].'" '.($city['id'] == $emirate ? 'selected="selected"' : '').'>'.$city['name'].'</option>';
endforeach;
$html .= '<option value="Other">Other</option> </select><input type="text" id="other_emirate" name="other_emirate" class="form-control" style="display: none;" />';
echo json_encode(array('result'=>$html));
}
Now currently I'm working on edit page where it should initially show what value the user had selected while adding the entry. As of now the functionality of the second select works fine as intended as it changes its options when the 1st select data is changed and also gives the correct value in database when update is pressed.
Now the only problem here I have is that initially when loading into the page, it doesn't show anything in the second select box even though there is a value for it in the database. I performed a console.log(obj); in getcities(obj) and initially it returned undefined and everytime I change country, it gives a value in my log.
This code comes from a guide I've seen in YouTube.
I'm trying to populate the second dropdown based on the choices on the first dropdown, in my test page its working, however when I tried to attach it to my main page, the second dropdown is not turning into a dropdown.
I've tried to re-code it, but still the problem persist.
This is for the AJAX
<?php
include('db.php');
if($_POST['id']){
$id=$_POST['id'];
if($id==0){
echo "<option value='0'>Select Type</option>";
}else{
$sql = mysqli_query($con,"SELECT * FROM `ConcernType` WHERE Concern_Id='$id'");
while($row = mysqli_fetch_array($sql)){
echo '<option value="'.$row['ConcernType_id'].'">'.$row['ConcernType_name'].'</option>';
}
}
}
?>
This is for the index.php
<label>Concern Category :</label><select name="concerncategory" class="concerncategory">
<option value="0">Select Category</option>
<?php
include('db.php');
$sql = mysqli_query($con,"select * from ConcernCategory");
while($row=mysqli_fetch_array($sql))
{
echo '<option value="'.$row['Concern_Id'].'">'.$row['ConcernCategory_name'].'</option>';
} ?>
</select><br/><br/>
<label>Concern Type :</label><select name="concerntype" class="concerntype">
<option value="0">Select Type</option>
</select>
<br /><br />
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
<script type="text/javascript">
$(document).ready(function()
{
$(".concerncategory").change(function()
{
var Concern_Id=$(this).val();
var post_id = 'id='+ Concern_Id;
$.ajax ({
type: "POST", url: "ajax.php", data: post_id, cache: false,
success: function(Type) {
$(".concerntype").html(Type);
} }); }); });
</script>
Here are some screenshots.
https://ibb.co/2NTTdG8
https://ibb.co/fFXBzFS
I am working on 2 dependent dropdowns (Country, State). On the bases of previous selection, new drop-down options will open using ajax. My code works fine in localhost but on the server, it doesn't fetch any data(ajax not working on the server). I am using 2 files(Reg.php, getState.php) code is here, plz help.
Reg.php
<?php
require("../conn.php");
$query ="SELECT * FROM country";
$results=mysqli_query($con,$query);
?>
<html>
<head>
<script>
function getState(val) {
$.ajax({
type: "POST",
url: "getState.php",
data:'country_id='+val,
success: function(data){
$("#state-list").html(data);
getCity();
}
});
}
</script>
</head>
<body>
<select name="country" id="country-list" onChange="getState(this.value);">
<option value="">Select Country</option>
<?php
foreach($results as $country) {
?>
<option value="<?php echo $country["id"]; ?>"><?php echo
$country["country_name"]; ?></option>
<?php
}
?>
</select>
<select name="state" id="state-list" class="form-control" style="width:100%;" onChange="getCity(this.value);">
<option value="">Select State</option>
</select>
</body>
</html>
getState.php
<?php
require("../conn.php");
if (! empty($_POST["country_id"])) {
$query = "SELECT * FROM states WHERE countryID = '" . $_POST["country_id"] . "'";
$results=mysqli_query($con,$query);
?>
<option value disabled selected>Select State</option>
<?php
foreach ($results as $state) {
?>
<option value="<?php echo $state["id"]; ?>"><?php echo $state["name"]; ?>
</option>
<?php
}
}
?>
Please try this code for getting data from ajax.
function getState(val) {
$.ajax({
method: "POST",
url: "getState.php",
data: { country_id: val }
})
.done(function( data ) {
$("#state-list").html(data);
});
}
In the above code foreach loop working well on localhost but not on the server, I replace the foreach loop with while loop and get the country & city name. Thanks to everyone
I need help with my code. I want to select values from the database based on the first combo box selection.
The first combo box has subject ID, which I want to use in my SQL to find the value of the second combo box.
<form class ="form_group" id="form1" enctype="multipart/form-data" method="POST" action="uploadstudent.php">
StudentID:<br>
<input type="text" name="StudentID" value="<?php echo $_SESSION['login_user'];?>"readonly>
<br><br>
Subject ID:<br>
<select id="soflow" name="SubjectID" onChange="getState(this.value);">
<option>
<?php
mysql_connect("localhost", "id503120_course", "12345678");
mysql_select_db('id503120_course_db');
$StudentID=$_SESSION['login_user'];
$Course = mysql_query("SELECT course FROM student WHERE StudentID = '".$StudentID."'");
$result = mysql_fetch_assoc($Course);
$newcourse = implode($result);
$query=mysql_query("SELECT SubjectID FROM subjects WHERE Course= '".$newcourse."' AND SubStatus = 'Y'");
if(!$numrows=mysql_num_rows($query)==0)
{
while($row=mysql_fetch_assoc($query))
{ ?>
<option value="<?php echo $row['SubjectID']; ?>">
<?php echo $row['SubjectID']; ?>
</option>
<?php }
}
else{
echo "No submissions are currently open for you";
}
?>
</select>
<script>
function getState(val) {
$.ajax({
type: "POST",
url: "submission.php",
data:'SubjectID='+val,
success: function(data){
$('#soflow2').html(data);
}
});
}
</script>
Assign number: <br><select id="soflow2" name="AssessmentNum">
<option>
<?php
mysql_connect("localhost", "id503120_course", "12345678");
mysql_select_db('id503120_course_db');
if(!empty($_POST["SubjectID"])) {
$query ="SELECT AssignNum FROM subjects WHERE SubjectID = '".$_POST['SubjectID']."'";
while($row=mysql_fetch_assoc($query))
{ ?>
<option value="<?php echo $row['AssignNum']; ?>">
<?php echo $row['AssignNum']; ?>
</option>
<?php }
}
?>
Here in assign number, I am not able to view any information at all.
Please help me.
The problem is in the parameter SubjectID in the ajax request. try this:
function getState(val) {
$.ajax({
type: "POST",
url: "submission.php",
data:{'SubjectID' :val},
success: function(data){
$('#soflow2').html(data);
}
});
}
I am trying to create a dependent dynamic drop down box on three input fields. At the moment the each input field is getting their data from their individual tables called tour_type, countries and destination. This is the form:
<label>Tour Type </label>
<select id="tourtype" name="tourtype" required>
<option value="" selected="selected">--Select--</option>
<?php
$sql=mysql_query("Select tour_type_id,tour_name from tour_type");
while($row=mysql_fetch_array($sql))
{
$tour_type_id=$row['tour_type_id'];
$name=$row['tour_name'];
echo "<option value='$tour_type_id'>$name</option>";
}
?>
</select>
<label>Country </label>
<select id="country" name="country" class="country" required>
<option value="" selected="selected">-- Select --</option>
<?php
$sql=mysql_query("SELECT * FROM `countries` where `tour_type_id` = ?"); //what should i put in here?
while($row=mysql_fetch_array($sql))
{
$cid=$row['countries_id'];
$name=$row['countries_name'];
echo "<option value='$cid'>".$name."</option>";
}
?>
</select>
<label>Destination </label>
<select id="destination" name="destination" class="destination" required>
<option value="" selected="selected">-- Select --</option>
<?php
$sql=mysql_query("SELECT * FROM `destination` where `countries_id` = ?");//what should i put in here?
while($row=mysql_fetch_array($sql))
{
$destination_id=$row['destination_id'];
$name=$row['destination_name'];
echo "<option value='$destination_id'>".$name."</option>";
}
?>
</select>
This is the javascript at the top of the form
<script type="text/javascript">
$(document).ready(function()
{
$(".country").change(function()
{
var id=$(this).val();
var dataString = 'id='+ id;
$.ajax
({
type: "POST",
url: "ajax.php",
data: dataString,
cache: false,
success: function(html)
{
$(".destination").html(html);
}
});
});
});
</script>
Finally these are the 3 tables i.e. tour_type, countries and destination respectively:
Can anyone help me on this?
How do I make each drop down box dependable on each other? For e.g. If i select Culture on the 1st drop down, then only Holland and Belgium should show in the 2nd drop down. So now if i select Holland from 2nd drop down, then Amsterdam should show in the 3rd drop down.
This is the ajax.php which i am not too sure if it is right.
<?php
include('../config.php');
if($_POST['']) //what should i put in here?
{
$id=$_POST['']; //what should i put in here?
$sql=mysql_query //this is where i do not know what to put;
while($row=mysql_fetch_array($sql))
{
//And what should i be placing here
}
}
?>
This is what the web front end form looks like after implementing the code provided by dianuj. I still can not select the 2nd and 3rd drop down boxes:
So first you have the tour type select box. So just move the code for fetching countries based on tour type to ajax.php. Also include one more parameter to distinguish which type(tour type,country etc) you are posting. so you will get the id and based on the type parameter you can fetch from different tables. Then create a selectbox HTML snippet and output it. This will return for the AJAX call and you can insert the HTML.
You can use ajax get here and can use the shorthand version like
$.get('ajax,php?id=idhere&type=country', function(data) {
$('#country_result').html(data);
});
Where result is the id of div to which the select box has to be inserted.
So the HTML part will be like
<div id="country_result"></div> //Country select box goes here
<div id="destination_result"></div> //Country select box goes here
The simplest approach is to fetch select options from the server when the selections change, like so:
$('#tour_type').change(function() {
// load country options
});
$('#country').change(function() {
// load destination options
});
The server should simply return a snippet of HTML containing the available options for country and destination.
here you go you have to fetch the options from the ajax.php do not place the query in second dropdown
<label>Tour Type </label>
<select id="tourtype" name="tourtype" required>
<option value="" >--Select--</option>
<?php
$sql=mysql_query("Select tour_type_id,tour_name from tour_type");
while($row=mysql_fetch_array($sql))
{
$tour_type_id=$row['tour_type_id'];
$name=$row['tour_name'];
echo "<option value='$tour_type_id'>$name</option>";
}
?>
</select>
<label>Country </label>
<select id="country" name="country" class="country" required>
<option value="">-- Select --</option>
</select>
<label>Destination </label>
<select id="destination" name="destination" class="destination" required>
<option value="">-- Select --</option>
</select>
initially country and destination drop down should be empty here your js goes
$('#tour_type').change(function() {
var id=$(this).val();
$.ajax
({
type: "POST",
url: "ajax.php",
data: "&id="+id+"&get_countries=1",
success: function(html)
{
$("#country").append(html);
}
});
});
$('#country').change(function() {
var id=$(this).val();
$.ajax
({
type: "POST",
url: "ajax.php",
data: "&id="+id+"&get_destination=1",
success: function(html)
{
$("#destination").append(html);
}
});
});
And your ajax.php
<?php
if($_REQUEST['get_countries']){
$sql=mysql_query("SELECT * FROM `countries` where `tour_type_id`=".$_REQUEST['id']);
$countries="";
while($row=mysql_fetch_array($sql))
{
$cid=$row['countries_id'];
$name=$row['countries_name'];
$countries.= "<option value='".$cid."'>".$name."</option>";
}
echo $countries;
}elseif($_REQUEST['get_destination']){
$destination="";
$sql=mysql_query("SELECT * FROM `destination` where `country_id` =".$_REQUEST['id'])
while($row=mysql_fetch_array($sql))
{
$destination_id=$row['destination_id'];
$name=$row['destination_name'];
$destination.= "<option value='".$destination_id."'>".$name."</option>";
}
echo $destination;
}
?>
Hope it works fine
<label>Tour Type </label>
<select id="tourtype" name="tourtype" required onchange="get_country($(this).val())">
<option value="" selected="selected">--Select--</option>
<?php
$sql=mysql_query("Select tour_type_id,tour_name from tour_type");
while($row=mysql_fetch_array($sql))
{
$tour_type_id=$row['tour_type_id'];
$name=$row['tour_name'];
echo "<option value='$tour_type_id'>$name</option>";
}
?>
</select>
<label>Country </label>
<select id="country" name="country" class="country" required onchange="get_destination($(this).val())">
<option value="" selected="selected">-- Select --</option>
</select>
<label>Destination </label>
<select id="destination" name="destination" class="destination" required>
<option value="" selected="selected">-- Select --</option>
</select>
<script>
function get_country(tour_type)
{
$.post("ajax.php",{get_country:tour_type},function(data){
var data_array = data.split(";");
var number_of_name = data_array.length-1;
var value;
var text;
var opt;
var temp_array;
for(var i=0; i<number_of_name; i++)
{
value=temp_array[i];
//alert(value);
text=temp_array[i];
opt = new Option(text,value);
$('#country').append(opt);
$(opt).text(text);
}
$("#country").prop("disabled", false);
});
}
//same way script for getting destination
</script>
// now in ajax file
if(isset($_POST["get_country"]))
{
$tour_type = str_replace("'","",stripslashes(htmlentities(strip_tags($_POST["get_country"]))));
$country_select = mysql_query("select * from country where tour_type_id = '$tour_type'");
$country="";
while($country_row = mysql_fetch_array($country_select))
{
$country = $country.$country_row["country"].";";
}
echo $country;
}
// same way ajax for destination