Multiple Options/MYSQL Records to input box - javascript

I wondered if anyone would be able to help me with this as I just can't for the life of me, get it to work.
any help would be most appreciated.
Thanks in advance
$('#options').change(function () {
var optionname=$(this).find('option:selected').attr('data-value');
var optionprice=$(this).find('option:selected').attr('data-price');
$('#optionname').val(optionname);
$('#optionprice').val(optionprice);
});
<select name="options[]" id="options" class="form-control" required>
<option value="">Select Option</option>
<?php
$results99 = $mysqli->query("SELECT * FROM productoptions WHERE productid = '$prod_id' AND cat = 1");
while($rows99 = $results99->fetch_assoc()) {
?>
<option data-value="<?php echo $rows99['optionname']; ?>" data-price="<?php echo $rows99['price']; ?>"><?php echo ucwords(strtolower($rows99['optionname'])); ?> (+<?php echo $rows99['price']; ?>)</option>
<?php
//$results99->free();
}
?>
</select>
<?php } ?>
<input type="text" name="optionname" id="optionname" />
<input type="text" name="optionprice" id="optionprice" />
I just can't get it to work properly

Related

changing select box on another select box value not working in codeigniter

i have a codeigniter website, where there is a form for user to select category and subcategory, when a user selects category the subcategory dropdown should show accordingly, i did the following code:
public function subcategories() {
$category = $this->input->post('category');
$query = $this->db->query('SELECT name FROM subcategory WHERE parentcategory='.$category);
$data['subcategories'] = $query->result_array();
$this->load->view('homecontroller/subcategories', $data);
echo $category;
}
in subcategories.php
<?php foreach ($subcategories as $c): ?>
<option value="<?php echo $c['name'] ?>"><?php echo $c['name'] ?></option>
<?php endforeach; ?>
and in my view:
$(document).ready(function() {
$('#sl_countries').change(function() {
$('#sl_cities').load("<?php echo site_url('index.php/homecontroller/subcategories') ?>", {
category: $(this).val()
});
});
});
<div class="form-group col-md-6">
<label for="inputEmail4">Product Category</label>
<select id="sl_countries" class="form-control" name="cname" aria-label="Default select example">
<?php
foreach($listcategory as $val){
echo '<option value="'.$val->name.'">'.$val->name.'</option>';
}?>
</select>
</div>
<div class="form-group col-md-6">
<label for="inputEmail4">Sub Category</label>
<select class="form-control" name="sname" id="sl_cities"></select>
</div>
however this is not working, i get an error like below when i checked the console:
You have an error in your SQL syntax; check the manual that corresponds to your MariaDB server version for the right syntax to use near '' at line 1
SELECT name FROM subcategory WHERE parentcategory=
can anyone please tell me what is wrong here, thanks in advance
use this way:-
jQuery Ajax code :-
<script>
$(document).ready(function(){
$('#country').change(function(){
var country_id = $('#country').val();
if(country_id != '')
{
$.ajax({
url:"<?php echo base_url(); ?>dynamic_dependent/fetch_state",
method:"POST",
data:{country_id:country_id},
success:function(data)
{
$('#state').html(data);
$('#city').html('<option value="">Select City</option>');
}
});
}
else
{
$('#state').html('<option value="">Select State</option>');
$('#city').html('<option value="">Select City</option>');
}
});
});
</script>
Controller Code :-
<?php if ( ! defined('BASEPATH')) exit('No direct script access allowed');
class Dynamic_dependent extends CI_Controller {
function fetch_state()
{
if($this->input->post('country_id'))
{
echo $this->dynamic_dependent_model->fetch_state($this->input->post('country_id'));
}
}
}
?>
Model Code :-
<?php
class Dynamic_dependent_model extends CI_Model
{
function fetch_state($country_id)
{
$this->db->where('country_id', $country_id);
$this->db->order_by('state_name', 'ASC');
$query = $this->db->get('state');
$output = '<option value="">Select State</option>';
foreach($query->result() as $row)
{
$output .= '<option value="'.$row->state_id.'">'.$row->state_name.'</option>';
}
return $output;
}
}
?>
View Code :-
<div class="form-group">
<select name="country" id="country" class="form-control input-lg">
<option value="">Select Country</option>
<?php
foreach($country as $row)
{
echo '<option value="'.$row->country_id.'">'.$row->country_name.'</option>';
}
?>
</select>
</div>
<br />
<div class="form-group">
<select name="state" id="state" class="form-control input-lg">
<option value="">Select State</option>
</select>
</div>

Loop onchange function to manipulate the target class name

I used php and jquery. I have to generate multiple select tag depends on the value of condition. I need to manipulate both html,php and and jquery by using loop but I can't find the answer for this to work.
php html code... I like to populate multiple select tag with different classname
<?php $count = 2; ?>
<div id="comments" hidden><?php echo htmlspecialchars($count); ?></div>
<?php for($i = 1; $i <= $count; $i++){ ?>
<input type="text" readonly="readonly" class="resone<?php echo $i; ?>" id="resone">
<select name="artist_1" class="part<?php echo $i; ?>" id="part">
<option value="" disabled selected>Select Category</option>
<option value="1">medicine</option>
<option value="2">shoes</option>
</select>
<?php }?>
jquery. I like to put the onchange function into the loop to manipulate the target class value
<script>
$(function() {
var count = document.getElementById("comments").textContent;
for (var i = 1; i <= count; i++) {
$('.part' + i).change(function() {
var display = $('.part' + i).find(":selected").val();
$('.resone' + i).val(display);
})
}
})
</script>
I hope you could help me with this one.
You are overcomplicating things and abusing the class by adding a counter to it.
Here is my suggestion - you can actually ignore the IDs and the script does not care about the count, just about how many ".part" there are
$(function() {
$(".part").on("change", function() {
$(this).prev(".resone").val(this.value);
})
})
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<input type="text" readonly="readonly" class="resone" id="resone0">
<select name="artist_1" class="part" id="part0">
<option value="" disabled selected>Select Category</option>
<option value="1">medicine</option>
<option value="2">shoes</option>
</select>
<hr/>
<input type="text" readonly="readonly" class="resone" id="resone1">
<select name="artist_1" class="part" id="part1">
<option value="" disabled selected>Select Category</option>
<option value="1">medicine</option>
<option value="2">shoes</option>
</select>
PHP: - the IDs are not even used
<?php for($i = 1; $i <= $count; $i++){ ?>
<input type="text" readonly="readonly" class="resone" id="resone<?php echo $i; ?>">
<select name="artist_1" class="part" id="part<?php echo $i; ?>">
<option value="" disabled selected>Select Category</option>
<option value="1">medicine</option>
<option value="2">shoes</option>
</select>
<?php }?>
You don't need to use a for loop, just give the select a common class and do like this:
$(function() {
$('.part').change(function() {
var display = $(this).val();
$(this).next('.resone').val(display);
})
})
Since I can't see the element with the class resone i can't make sure if $(this).next('.resone').val(display) works.
Code example
$(function() {
$('.part').change(function() {
var display = $(this).val();
$(this).next('.resone').val(display);
})
})
<?php $count = 2; ?>
<div id="comments" hidden>
<?php echo htmlspecialchars($count); ?>
</div>
<?php for($i = 1; $i <= $count; $i++){ ?>
<select name="artist_1" class="part" >
<option value="" disabled selected>Select Category</option>
<option value="1">medicine</option>
<option value="2">shoes</option>
</select>
<?php }?>

Set Button id from javascript

I have a dropdown list which filled with the data fetched from db. I need to assign the selected index value of this dropdown list as the ID of a button.
Is it really possible?
my code
<select name="customer" onchange="getCustomer()" id="customer" class="form-control" style="width: 180px !IMPORTANT;">
<option value="">--Select Customer--</option>
<?php
$sql = mysqli_query($db,"SELECT * FROM customer ");
while($row= mysqli_fetch_array($sql))
{
?>
<option value="<?php echo $row['custid'];?>"><?php echo $row['customername'];?></option>
<?php
}
?>
</select>
</div>
<button name="custbt" id="1" class="label-text col-form-label userinfo">Show customer details</button>
<script>
function getCustomer()
{
var e = document.getElementById("customer");
var cust = e.options[e.selectedIndex].value;
// alert(cust);custbt
//document.getElementByName("custbt").id=cust;
document.getElementByName(custbt).id=cust;
}
</script>
Might be this will solve your problem. I have added a class on btn call CustomerModalBttn .
Try this
<select name="customer" id="customer" class="form-control" style="width: 180px !IMPORTANT;">
<option value="">--Select Customer--</option>
<?php
$sql = mysqli_query($db,"SELECT * FROM customer ");
while($row= mysqli_fetch_array($sql)){
?>
<option value="<?php echo $row['custid'];?>"><?php echo $row['customername'];?></option>
<?php
}
?>
</select>
<button name="custbt" id="1" class="label-text col-form-label userinfo CustomerModalBttn">
Show customer details
</button>
<script>
$(document).ready(function(){
$('#customer').on('change',function(){
$('.CustomerModalBttn').attr('id',$(this).val());
});
});
</script>
IDs must begin with a letter.
<button name="custbt" id="a1" class="label-text col-form-label userinfo">Show customer details</button>
var customer = document.getElementById("customer");
var a1 = document.getElementById("a1");
customer.addEventListener("change",function(){
a1.removeAttribute("id");
a1.setAttribute("id",customer.value);
});
Just add some condition if ($row['custid'] == $_GET['custid']) echo 'selected', if you pass the customer id from url, and then get it with $_GET param.
...
while($row= mysqli_fetch_array($sql))
{ ?>
<option <?php if ($row['custid'] == $_GET['custid']) echo 'selected'; ?> value="<?php echo $row['custid'];?>">
<?php echo $row['customername'];?>
</option>
<?php } ?>
...

How to show selected option in select tag of html?

I am using a select tag from html to show some list. Now when I select one of the option from select tag, I want to load the form again and by the selected option I am running another query and showing the values of another query in another select tag.
Its working properly after selecting any option I am posting a type from which I am getting another data in another select tag, but when I click suppose option TSgt and the form reloads with the TSgt type data, but the option selected in select tag shows as MSgt which is not the one I selected.
If I don't check if the $type is set in _POST array and just show the select tag without an select value like follow :
<option value="1">SSgt</option>
<option value="2">TSgt</option>
<option value="3">MSgt</option>
Then, default selected value shows SSgt,I want to show the value in select tag which user has selected.
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>MCQ Questions</title>
</head>
<body>
<?php
session_start();
$dbh = new PDO('mysql:host=174.75.54;dbname=handbook', 'airman', 'airman');
$type = $_POST['type'];
$question = $_SESSION["question"];
$optionA = $_SESSION["opt1"];
$optionB = $_SESSION["opt2"];
$optionC = $_SESSION["opt3"];
$optionD = $_SESSION["opt4"];
$ans = $_SESSION["ans"];
$chapter = $_SESSION["chapter"];
?>
<form method="post" action="mcq.php" enctype="multipart/form-data">
<p> Enter the question :</p> <input name="question" type="text"> <br><br>
Select question type :
<select name="type" id="type" onchange="this.form.submit()">
<?php if(isset($_POST['type']))
{ ?>
<option value="1" selected=<?=($type==1?"checked":"");?>>SSgt</option>
<option value="2" selected=<?=($type==2?"checked":"");?>>TSgt</option>
<option value="3" selected=<?=($type==3?"checked":"");?>>MSgt</option>
</select>
<?php
}
else
{
?>
<option value="1">SSgt</option>
<option value="2">TSgt</option>
<option value="3">MSgt</option>
</select>
<?php
}
?>
<br><br>
<?php if(isset($optionA))
{ ?>
<p> Enter options :</p>
Enter option A : <input name="opt1" type="text" value = "<?php echo $optionA?>"</input> <br><br>
<?php
}
else{
?>
<p> Enter options :</p>
Enter option A : <input name="opt1" type="text"> <br><br>
<?php
}
?>
Enter option B : <input name="opt2" type="text"> <br><br>
Enter option C : <input name="opt3" type="text"> <br><br>
Enter option D : <input name="opt4" type="text"> <br><br>
Select correct answer :
<select name="ans" id="type">
<option value="A">A</option>
<option value="B">B</option>
<option value="C">C</option>
<option value="D">D</option>
</select>
<br><br>
Select Chapter :
<select name="chapters" id="chapters">
<?php
if(isset($_POST['type']))
{
$stmt = $dbh->prepare("SELECT * FROM chapters where type = :type");
$stmt->bindParam("type", $type);
$stmt->execute();
$results = $stmt->fetchall(PDO::FETCH_ASSOC);
if(count($results > 0)){
foreach($results as $row):?>
<option value="<?php echo $row['id'];?>"><?php echo $row['title'];?></option>
<?php
endforeach;
}else{?>
<option value="0">No data found</option>
<?php
}
}
else{
$stmt = $dbh->prepare("SELECT * FROM chapters where type = 1");
$stmt->execute();
$results = $stmt->fetchall(PDO::FETCH_ASSOC);
if(count($results > 0)){
foreach($results as $row):?>
<option value="<?php echo $row['id'];?>"><?php echo $row['title'];?></option>
<?php
endforeach;
}else{?>
<option value="0">No data found</option>
<?php
}
}
?>
</select> <br><br>
<input type="submit" value = "Submit">
</form>
</body>
</html>
<?php
// escape post variables
$question = $_POST['question'];
$option1 = $_POST['opt1'];
$option2 = $_POST['opt2'];
$option3 = $_POST['opt3'];
$option4 = $_POST['opt4'];
$ans = $_POST['ans'];
$chapter = $_POST['chapters'];
if(!empty($ans) and !empty($question) and !empty($option1) and !empty($option2) and !empty($option3) and !empty($option4) and !empty($type) and !empty($chapter))
{
$stmt = $dbh->prepare("INSERT INTO questions (question,answer_a,answer_b,answer_c,answer_d,answer,type,chapterId) VALUES (?, ?, ?, ?, ?, ?, ?,?)");
$stmt->execute(array($question, $option1, $option2, $option3, $option4, $ans,$type,$chapter));
if ($dbh->lastInsertId())
{
echo 'Question submitted.';
echo 'Upload another question.';
session_destroy();
}
else
{
echo 'Question could not submit.';
}
}
else{
$_SESSION["question"] = $question;
$_SESSION["chapter"] = $chapter;
$_SESSION["ans"] = $ans;
$_SESSION["opt1"] = $option1;
$_SESSION["opt2"] = $option2;
$_SESSION["opt3"] = $option3;
$_SESSION["opt4"] = $option4;
echo 'Fill all fields.';
}
?>
I dont know what is going wrong here. Can anyone help me out please?
Thank you.
selected=checked is wrong. selected is enough.
The syntax is <option value="1" selected>SSgt</option>
Change the code to
<option value="1" <?php echo($type==1?"selected":"");?>>SSgt</option>
<option value="2" <?php echo($type==2?"selected":"");?>>TSgt</option>
<option value="3" <?php echo($type==3?"selected":"");?>>MSgt</option>

how to write onChange in this script??can anyone tell me the correct syntax

how to write onChange in this script??can anyone tell me the correct syntax?
I want to add these phpcode to my script
Javascript code:
ih+='<div class="form-group drop_bottom" id="select_one_'+extra_num+'"><select name="sizes_'+extra_num+'" style="position:absolute;top:0px;left:0px;width:200px; height:25px;line-height:20px;margin:0;padding:0;" id="sizes_'+extra_num+'" onChange="+document.getElementById("displayValue").value=this.options[this.selectedIndex].text;+document.getElementById("sizes_'+extra_num+'").value=this.options[this.selectedIndex].value;this_total(this,1);grand_total(this)"><option value="0">Select One</option>
here is the php code:
<div style="position:relative;width:200px;height:25px;border:0;padding:0;margin:0;" id="select_one_0" class="form-group drop_bottom">
<select name="sizes_0" id="sizes_0" style="position:absolute;top:0px;left:0px;width:200px; height:25px;line-height:20px;margin:0;padding:0;" onChange="document.getElementById('displayValue').value=this.options[this.selectedIndex].text; document.getElementById('select_sizes_0').value=this.options[this.selectedIndex].value;this_total(this,1);grand_total(this)" > <option value="0" >Select One</option>
<?php
$get_banner_tyes = Get_banner_tyes();
if($get_banner_tyes != false)
{ while($row_get_banner_tyes = mysql_fetch_array($get_banner_tyes))
{
?>
<option value="<?php echo $row_get_banner_tyes['banner_type_value'] * $_SESSION['secondary_currency_value']; ?>_<?php echo $row_get_banner_tyes['banner_type_id']; ?>"><?php echo $row_get_banner_tyes['banner_type_name']; ?></option>
<?php } ?>
<?php }
?>
</select>
<input name="displayValue" placeholder="Width*Height value" id="displayValue" style="position:absolute;top:0px;left:0px;width:183px;width:180px\9;#width:180px;height:23px; height:21px\9;#height:18px;border:1px solid #556;" onFocus="this.select()" type="text">
<input name="idValue" id="select_sizes_0" type="hidden" >
<input type="hidden" name="select_sizes_0" id="select_sizes_0">
<input type="hidden" name="select_elements_0" id="select_elements_0"></div>
Use single quote instead of double quote and add backslash before the quotes.
onChange="(document.getElementById(\'displayValue\').value=this.options[this.selectedIndex].text; document.getElementById(\'sizes_'+extra_num+'\').value=this.options[this.selectedIndex].value;this_total(this,1);grand_total(this);)"

Categories