I'm currently using Select2 for my dropdown. When I initiate the dropdown, it renders the original dropdown and the select2 dropdown. How can I fix this?
$('#itemSelect1').select2();
<select class="itemSelect1">
<option value="">Select an item</option>
<?php if (!empty($material)) {?>
<?php foreach ($material as $key => $value) { ?>
<option value="<?php echo $value['material_unique_key']; ?>" data-price="<?php echo $value['material_price']; ?>">
<?php echo $value['material_name'] ?>
</option>
<?php } ?>
<?php } ?>
</select>
Related
I searched a lot about this topic and found difficult approaches mostly not working. I have 2 Select boxes (class & student) which should be dynamically generated. After selecting the Class, the 2nd Select Box should show the Option Values from the Students Table.
<form action="" class="form-horizontal" method="POST">
<h4>Issue Book: </h4><hr>
<label class="control-label" for="class">Class</label>
<select id="class" name="class" class="form-control">
<option value="">Select Class</option>
<?php
$class_query = "SELECT * FROM `classes` ";
$class_result = mysql_query($class_query);
do{
$class_row = mysql_fetch_array($class_result);
if($class_row){
$class_id = $class_row['id'];
$class_name = $class_row['class'];
?>
<option value="<?php echo $class_id; ?>"><?php echo $class_name; ?></option>
<?php
}
}while($class_row);
?>
</select>
<label class="control-label" for="student">Student</label>
<select id="student" name="student" class="form-control">
<option value="">Select Student</option>
</select>
<!-- Submit -->
<button type="submit" name="issue_book">Issue Book</button>
</form>
Kindly help with this, I have no knowledge of JS or JQuery. I shall be very thankful.
first this is your html code
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
<form action="" class="form-horizontal" method="POST">
<h4>Issue Book: </h4>
<hr>
<label class="control-label" for="class">Class</label>
<select id="class" name="class" class="form-control" onchange="getStudentOption(this)">
<option value="">Select Class</option>
<option value="class1">Class 1</option>
<option value="class2">Class 2</option>
<option value="class3">Class 3</option>
<option value="class4">Class 4</option>
</select>
<label class="control-label" for="student">Student</label>
<select id="student" name="student" class="form-control">
<option value="">Select Student</option>
</select>
<!-- Submit -->
<button type="submit" name="issue_book">Issue Book</button>
</form>
added a onchange function
<script>
function getStudentOption(input) {
var class_name = input.value;
$.ajax({
type: "GET",
data: 'class=' + class_name,
url: 'demo.php',
dataType: 'text',
success: function (text) {
$('#student').html(text);
},
});
}
</script>
here demo is the file name which file give you all student data so you can change this file name and path also
and this is your demo file content
<?php
if (isset($_GET) && ($_GET['class'] != '')) {
/*$class_value = $_GET['class'];
$query = "SELECT * FROM students WHERE class_name=" . $class_value;
$result = mysql_query($query);
$total_refs = mysql_num_rows($result);
if ($total_refs > 0) {
?>
<option value="">Select Student</option>
<?php
while ($line = mysql_fetch_array($result)) {
$student_name = $line['student_name'];
$student_id = $line['student_id'];
?>
<option
value="<?php echo $student_id; ?>"><?php echo $student_name; ?></option>
<?php
}
?>
<?php
} else { ?>
<option value="">Select Student</option>
<?php
}*/?>
<option value="">Select Student</option>
<option value="1">Student 1</option>
<option value="2">Student 2</option>
<option value="3">Student 3</option>
<?php }
?>
i have added some demo content you can update data which code i have added, i am not sure which your table structure so just update condition value and filed value
I would like to hide an option value if one value is selected in first dropdown.
I have added below the dropdown code:
<select name="time_hour" class="span6">
<option value="00" <?php if(date('H',strtotime($time_gap[0]->time_gap_time)) == '00'){ echo "selected";} ?>>00</option>
<option value="01" <?php if(date('H',strtotime($time_gap[0]->time_gap_time)) == '01'){ echo "selected";} ?>>01</option>
<option value="02" <?php if(date('H',strtotime($time_gap[0]->time_gap_time)) == '02'){ echo "selected";} ?>>02</option>
<option value="03" <?php if(date('H',strtotime($time_gap[0]->time_gap_time)) == '03'){ echo "selected";} ?>>03</option>
<option value="04" <?php if(date('H',strtotime($time_gap[0]->time_gap_time)) == '04'){ echo "selected";} ?>>04</option>
<option value="05" <?php if(date('H',strtotime($time_gap[0]->time_gap_time)) == '05'){ echo "selected";} ?>>05</option>
<option value="06" <?php if(date('H',strtotime($time_gap[0]->time_gap_time)) == '06'){ echo "selected";} ?>>06</option>
<option value="07" <?php if(date('H',strtotime($time_gap[0]->time_gap_time)) == '07'){ echo "selected";} ?>>07</option>
<option value="08" <?php if(date('H',strtotime($time_gap[0]->time_gap_time)) == '08'){ echo "selected";} ?>>08</option>
<option value="09" <?php if(date('H',strtotime($time_gap[0]->time_gap_time)) == '09'){ echo "selected";} ?>>09</option>
<option value="10" <?php if(date('H',strtotime($time_gap[0]->time_gap_time)) == '10'){ echo "selected";} ?>>10</option>
<option value="11" <?php if(date('H',strtotime($time_gap[0]->time_gap_time)) == '11'){ echo "selected";} ?>>11</option>
<option value="12" <?php if(date('H',strtotime($time_gap[0]->time_gap_time)) == '12'){ echo "selected";} ?>>12</option>
<option value="13" <?php if(date('H',strtotime($time_gap[0]->time_gap_time)) == '13'){ echo "selected";} ?>>13</option>
<option value="14" <?php if(date('H',strtotime($time_gap[0]->time_gap_time)) == '14'){ echo "selected";} ?>>14</option>
<option value="15" <?php if(date('H',strtotime($time_gap[0]->time_gap_time)) == '15'){ echo "selected";} ?>>15</option>
<option value="16" <?php if(date('H',strtotime($time_gap[0]->time_gap_time)) == '16'){ echo "selected";} ?>>16</option>
<option value="17" <?php if(date('H',strtotime($time_gap[0]->time_gap_time)) == '17'){ echo "selected";} ?>>17</option>
<option value="18" <?php if(date('H',strtotime($time_gap[0]->time_gap_time)) == '18'){ echo "selected";} ?>>18</option>
<option value="19" <?php if(date('H',strtotime($time_gap[0]->time_gap_time)) == '19'){ echo "selected";} ?>>19</option>
<option value="20" <?php if(date('H',strtotime($time_gap[0]->time_gap_time)) == '20'){ echo "selected";} ?>>20</option>
<option value="21" <?php if(date('H',strtotime($time_gap[0]->time_gap_time)) == '21'){ echo "selected";} ?>>21</option>
<option value="22" <?php if(date('H',strtotime($time_gap[0]->time_gap_time)) == '22'){ echo "selected";} ?>>22</option>
<option value="23" <?php if(date('H',strtotime($time_gap[0]->time_gap_time)) == '23'){ echo "selected";} ?>>23</option>
</select>
And the second dropdown is
<select name="time_min" id="time_min" class="span6">
<option value="00" <?php if(date('i',strtotime($time_gap[0]->time_gap_time)) == 00){ echo "selected";} ?>>00</option>
<option value="15" <?php if(date('i',strtotime($time_gap[0]->time_gap_time)) == 15){ echo "selected";} ?>>15</option>
<option value="30" <?php if(date('i',strtotime($time_gap[0]->time_gap_time)) == 30){ echo "selected";} ?>>30</option>
<option value="45" <?php if(date('i',strtotime($time_gap[0]->time_gap_time)) == 45){ echo "selected";} ?>>45</option>
</select>
So, for example, If I select 00 in first dropdown, 00 should be hide in second dropdown. I am trying to get this possibility. Please help.
use JQuery and set id="time_hour" attribute for first select tag:
$("#time_hour").change(function (){
$("#time_min").find("option").css('display','')
$("#time_min").find("option[value="+$(this).val()+"]").css('display','none')
});
I want to choose province on the basis of state selected. This option is working fine, but when I add a new dropdown box for district that depends on the province option, and so on, all other option are not working and are displaying all values from the database not on the basis of the selected drop down menu ...[![enter image description here][1]][1]
include.php code:
<?php
$con=mysql_connect('localhost','root','') or die('Mysql not connected');
mysql_select_db('location',$con) or die('DataBase not connected');
?>
<html>
<head>
<script type="text/javascript" src="js/ajax.js"></script>
<script type="text/javascript" src="js/ajax1.js">
</script>
</head>
<body>
<h1>Address<br/></h1>
<form>
<select name="state" style="padding:10px;width:200px;font-size:20px;" onChange="display(this.value)">
<option value="" selected="selected">-- Select Country --</option>
<?php
$query1="select * from tbl_state";
$query1_result=mysql_query($query1)or mysql_error();
while($row=mysql_fetch_array($query1_result))
{
?>
<option value="<?php echo $row['id']; ?>"><?php echo $row['state_name']; ?></option>
<?php
}
?>
</select>
<div id="show_city">
<select name="city" style="padding:10px;width:200px;font-size:20px; " onChange="display1(this.value)">
<option value="" selected="selected">-- Select Province --</option>
</select>
</div>
<br>
<div id1="show_Dist">
<select name="dist" style="padding:10px;width:200px;font-size:20px;">
<option value="" selected="selected">-- Select Dist --</option>
<?php
$query="select * from tbl_dist";
$query_result=mysql_query($query)or mysql_error();
while($row=mysql_fetch_array($query_result))
{
?>
<option value="<?php echo $row['Dist_id']; ?>"><?php echo $row['Dist_Name']; ?></option>
<?php
}
?>
</select>
</div>
<br>
<div id1="show_Dist">
<select name="dist" style="padding:10px;width:200px;font-size:20px;">
<option value="" selected="selected">-- Select Tehsil --</option>
<br>
<?php
$query="select * from tbl_tehsil";
$query_result=mysql_query($query)or mysql_error();
while($row=mysql_fetch_array($query_result))
{
?>
<option value="<?php echo $row['tehsil_id']; ?>"><?php echo $row['tehsil_Name']; ?></option>
<?php
}
?>
</select>
</div>
<br>
<div id1="show_UC">
<select name="dist" style="padding:10px;width:200px;font-size:20px;">
<option value="" selected="selected">-- Select Union Concil--</option>
<br>
<?
$query="select * from tbl_tehsil";
$query_result=mysql_query($query)or mysql_error();
while($row=mysql_fetch_array($query_result))
{
?>
<option value="<?php echo $row['tehsil_id']; ?>"><?php echo $row['tehsil_Name']; ?></option>
<?php
?>
</select>
</div>
<br>
<div id1="show_Villages">
<select name="dist" style="padding:10px;width:200px;font-size:20px;">
<option value="" selected="selected">-- Select Villages--</option>
<br>
<?php
$query="select * from tbl_tehsil";
$query_result=mysql_query($query)or mysql_error();
while($row=mysql_fetch_array($query_result))
{
?>
<option value="<?php echo $row['tehsil_id']; ?>"><?php echo $row['tehsil_Name']; ?></option>
<?php
}
?>
</select>
</div>
</form>
</body>
</html>
getcity code:
<?php
$con=mysql_connect('localhost','root','') or die('Mysql not connected');
mysql_select_db('location',$con) or die('DataBase not connected');
$state_id=$_REQUEST['state_id'];
$query="select * from tbl_city where state_id='$state_id'";
?>
<select name="city" style="padding:10px;width:200px;font-size:20px;">
<option value="" selected="selected">-- Select city --</option>
<?php
$query_result=mysql_query($query)or mysql_error();
while($row=mysql_fetch_array($query_result))
{
?>
<option value="<?php echo $row['id']; ?>"><?php echo $row['city_name']; ?></option>
<?php
}
?>
</select>
getdist.php code:
<?php
$con=mysql_connect('localhost','root','') or die('Mysql not connected');
mysql_select_db('location',$con) or die('DataBase not connected');
$city_id=$_REQUEST['city_id'];
$query="select * from tbl_Dist where city_id='$city_id'";
echo "Error";
?>
<select name="city" style="padding:10px;width:200px;font-size:20px;">
<option value="" selected="selected">-- Select Dist --</option>
<?php
$query_result=mysql_query($query)or mysql_error();
while($row=mysql_fetch_array($query_result))
{
?>
<option value="<?php echo $row['Dist_id']; ?>"><?php echo $row['Dist_Name']; ?></option>
<?php
}
?>
</select>
ajax file:
// JavaScript Document
var XMLHttpRequestObject=false;
function display(state_id)
{
if(window.XMLHttpRequest)
{
XMLHttpRequestObject=new XMLHttpRequest();
}
else if(window.ActiveXObject)
{
XMLHttpRequestObject=new ActiveXObject("Microsoft.XMLHTTP");
}
XMLHttpRequestObject.onreadystatechange=function()
{
if (XMLHttpRequestObject.readyState==4 && XMLHttpRequestObject.status==200)
{
document.getElementById("show_city").innerHTML=XMLHttpRequestObject.responseText;
}
}
XMLHttpRequestObject.open("GET","getcity.php?state_id="+state_id,true);
XMLHttpRequestObject.send();
}
ajax1 file:
var XMLHttpRequestObject=false;
function display1(dist_id)
{
if(window.XMLHttpRequest)
{
XMLHttpRequestObject=new XMLHttpRequest();
}
else if(window.ActiveXObject)
{
XMLHttpRequestObject=new ActiveXObject("Microsoft.XMLHTTP");
}
XMLHttpRequestObject.onreadystatechange=function()
{
if (XMLHttpRequestObject.readyState==4 && XMLHttpRequestObject.status==200)
{
document.getElementById("show_Dist").innerHTML=XMLHttpRequestObject.responseText;
}
}
XMLHttpRequestObject.open("GET","getdist.php?city_id="+city_id,true);
XMLHttpRequestObject.send();
}
How can I use the AJAX file properly?
See I Can't go through all your codes. I'm having my code. Just go through it.
Try using this. Use little brain. And, you will not have any problem.
~ #imDEnam
View.php
<select class='form-control City' name='StoreCity' required>
<option value="">Select City</option>
<?
$QueryCity=mysql_query("SELECT * FROM AubreeCities");
while($RowCt=mysql_fetch_array($QueryCity))
{?>
<option value="<?echo $RowCt['ACityNo'];?>"><?echo $RowCt['ACName'];?></option>
<?}?>
</select>
<div class='Stores'>
//Here, we will show all details which is coming from AjaxSelectStores.php Page..
</div>
**Ajax Call**
$('.City').change(function(){
var CityNo= $('.City').val();
$.ajax({url:"AjaxSelectStores.php?CityNo="+CityNo,cache:false,success:function(result){
$('.Stores').html(result);
}});
});
AjaxSelectStores.php
<?
include("open-db-connection.php");
extract($_GET);
$RecentMonth=date("F");
?>
<div class='row'>
<div class='col-md-2'><label>Select Store</label></div>
<div class='col-md-4'>
<select class='form-control' name='StoreNo'>
<option value="">Select Store</option>
<?
$QueryStore=mysql_query("SELECT * FROM AubreeStores WHERE AStoreCity='$CityNo' ");
while($RowS=mysql_fetch_array($QueryStore))
{?>
<option value="<?echo $RowS['AStoreNo'];?>"><?echo $RowS['AStoreName'];?></option>
<?}?>
</select>
</div>
</div>
Drop down, when item of dropdown is selected I need it to go to download page based on the advanced custom fields value.
Code:
<select name="download" onChange="download(this.value)">
<option value="0">Select template to download</option>
<option value="<?php the_field('download_template_1_link', 'option'); ?>"><?php the_field('download_template_1_title', 'option'); ?></option>
<option value="<?php the_field('download_template_2_link', 'option'); ?>"><?php the_field('download_template_2_title', 'option'); ?></option>
<option value="<?php the_field('download_template_3_link', 'option'); ?>"><?php the_field('download_template_3_title', 'option'); ?></option>
<option value="<?php the_field('download_template_4_link', 'option'); ?>"><?php the_field('download_template_4_title', 'option'); ?></option>
<option value="<?php the_field('download_template_5_link', 'option'); ?>"><?php the_field('download_template_5_title', 'option'); ?></option>
<script>
function download(val) {
window.location
}
</script>
</select>
use window.location.href to go to download page.
<script>
function download(val) {
window.location.href = val;
}
</script>
function download(url) {
if (url.length !== 0) {
window.location.href = url;
}
}
<select onChange="download(this.value)">
<option value="">-- Select --</option>
<option value="http://apple.com">Apple</option>
<option value="http://bing.com">Bing</option>
</select>
The code to populate combo box from database
<td>Item Name:</td>
<td><select name="items">
<option value="0" selected="selected"> Choose</option>
<?php
while($row = mysql_fetch_assoc($query))
{
$category = $row["ItemName"];
echo "$category";
?>
<option value= <?php $category ?> > <?php echo $category ?> </option>
<?php
}?>
</select></td>
Code for submit
<td><input type="submit" name="newItem" value="New Item"/></td>
PHP code is:
<?php
if(isset($_POST['newItem']))
{
$item=$_POST['items'];
$sel=mysql_query("select ItemID from itemmaster where ItemName='$item'");
while($row2 = mysql_fetch_array($sel))
{
//code
}
Value should be inside quotes
change:
<option value= <?php $category ?> > <?php echo $category ?> </option>
to
<option value= "<?php $category ?> "> <?php echo $category ?> </option>