Setting a default value when populating dropdown with Ajax - javascript

I've some code I've been working on, which uses AJAX to generate a second dropdown based on information in the database.
For example
If you select BMW
it will populate the second list with all available BMW models, this is working correctly, but I would like one of the fields in the second drop down to remain SELECT, or ANY, so that they can search solely on car Make.
I've had a look online and the solutions seem very complicated for what I would hoped was a simple fix, I'm now stuck on how to fix the issue, should I just add a separate form for just make? Although this wouldn't be as user friendly.
<div class="row">
<div class="col-sm-10 col-sm-offset-1">
<form id="fitment_search" action="gallery.php" method="GET">
<div class="col-sm-5">
<div class="col-sm-4">
<h5>Vehicle Make:</h5>
</div>
<div class="col-sm-8">
<div class="select">
<select name="make" onchange="get_model(this.value)">
<option value="make">SELECT</option>
<?php while ($row = mysqli_fetch_assoc($makeResult)) : ?>
<option
value="<?php echo $row['make']; ?>"><?php echo $row['make']; ?></option>
<?php endwhile; ?>
</select>
<div class="select__arrow"></div>
</div>
</div>
</div>
<div class="col-sm-5">
<div class="col-sm-4">
<h5>Model:</h5>
</div>
<div class="col-sm-8">
<div class="select">
<select name="model" id="fitment_model">
<option value="">SELECT</option>
</select>
<div class="select__arrow"></div>
</div>
</div>
</div>
<div class="col-sm-2">
<button type="submit" class="btn btn-default btn-sm btn-primary"><i
class="fa fa-pencil"></i> Search Now
</button>
</div>
</form>
</div>
Heres the code form the seperate php file.
$make=$_GET["make"];
$sql2 = "SELECT `model` FROM `fitment` WHERE `make` = '$make' ORDER BY `model` ASC";
$result = mysqli_query($db, $sql2);
?>
<select name="models"> <?php
while($row = mysqli_fetch_array($result)) { ?>
<option value="<?php echo $row['model']?>"><?php echo $row['model'] ?></option><?php
} ?>
</select>

just change:
<select name="models"> <?php
TO
<select name="models">
<option value="" >Select</option>
<?php

Related

want to disable selected checkboxes

I want to disable the checkboxes selected by user1 so that if another user logins the page he should not able to make any changes on the selectedcheckboxes.It is somewhat like restaurant table booking system
<?php
$st = "select * from seat where hotel='$test'";
$q= mysqli_query($conn,$st);
$tester = mysqli_fetch_array($q);
$tab = $tester['two'];
?>
<form method="post">
<input type="submit" name="bookbtn" value="Book Your table">
<div id="mask2"style="float:left;width:20%;">
<?php $i=1;
while ($i<=$tab)
{?>
<div class="TWO">
<div class="check"style="height:40px;width:120px;">
<div class="seconda">
</div>
<div class="secondb">
<input type ="checkbox"name="checky[]"
style="width:30px;height:30px;"
value="<?php echo "two".$i;?>"
<?php if (in_array("two".$i, $expcheck)) {?>
checked="checked"<?php }else {echo "none";}?>>
</div>
<div class="secondc">
</div>
</div>
</div>
After you have determined that it has been selected:
document.getElementByID('yourcheckboxID').setAttribute("disabled", "true");
just written disabled and it works
<form method="post">
<input type="submit" name="bookbtn" value="Book Your table">
<div id="mask2"style="float:left;width:20%;">
<?php $i=1;
while ($i<=$tab)
{?>
<div class="TWO">
<div class="check"style="height:40px;width:120px;">
<div class="seconda">
</div>
<div class="secondb">
<input type ="checkbox"name="checky[]"
style="width:30px;height:30px;"
value="<?php echo "two".$i;?>"
<?php if (in_array("two".$i, $expcheck)) {?>
checked="checked"<?php }else {echo "none";}?>disabled>
</div>
<div class="secondc">
</div>
</div>
</div>

3 dynamic combobox use php and jquery

Need help...
How if I want to make 3 select options use jquery,
Parent
Child
Grandchild
Can anyone help?
I will appreciate your help...
This is my code:
<?php
$parentQuery = $db->query("SELECT * FROM kategori WHERE parent = 0 ORDER BY nama_kategori");
$kategori = ((isset($_POST['parent']) && !empty($_POST['parent']))?sanitize($_POST['parent']):'');
?>
<div class="form-group col-md-3">
<label for="parent">Kategori 1:</label>
<select class="form-control" id="parent" name="parent">
<option value="" <?php echo (($kategori =='')?'selected':''); ?>> Select</option>
<?php while($p = mysqli_fetch_assoc($parentQuery)): ?>
<option value="<?php echo $p['id_kategori'];?>" <?php echo (($kategori == $p['id_kategori'])?'selected=':''); ?>>
<?php echo $p['nama_kategori'];?>
</option>
<?php endwhile; ?>
</select>
</div>
<div class="form-group col-md-3">
<label for="child">Kategori 2:</label>
<select class="form-control" name="child" id="child"></select>
</div>
<div class="form-group col-md-3">
<label for="child">Kategori 3:</label>
<select class="form-control" name="grandchild" id="grandchild"></select>
</div>

How to parse large strings of html into Javascript with php echo variable

I have a javascript function that displays html code that is stored in the mysql database into CKeditor <textarea>. When a user selects any of the options, the mysql query is meant to echo the chunk of html code into the javascript as a php variable.
The select option works really fine in selecting the echoed variables from the javascript. The problem here is that, when i saved plain text into the database they were displayed but when i saved html codes into the database, the javascript refuses to display it.
I have tried several ways to echo the html string into the javascript such as:
<?php echo json_encode($fbilling); ?> \\Accepts Only Plain Texts Not HTML Codes
'<?php echo decodeURI(rawurlencode($freply)); ?>' \\Refuses To load Page
'<?php echo htmlspecialchars_decode(rawurlencode($freply)); ?>' \\Changes HTML Codes To Characters Like :%3Ctable%20data-module%3D%22header%22%20data
'<?php htmlspecialchars(json_encode($freply)); ?>' \\ No Value is Displays, Just Empty
'<?php echo htmlspecialchars(json_encode($freply)); ?>' \\ No Value is Displays, Just Empty
'<?php echo htmlspecialchars(rawurlencode($freply)); ?>' \\Changes HTML Codes To Characters Like :%3Ctable%20data-module%3D%22header%22%20data
This is my code:
var Code = new Array("", <?php echo json_encode($fwelcome); ?>, <?php echo json_encode($fbilling); ?>, <?php echo json_encode($freply); ?>, <?php echo json_encode($fdelivery); ?>);
function change() {
var ID = formconteudo.message.options[formconteudo.message.selectedIndex].value;
CKEDITOR.instances.editor1.setData('<p>' + Code[ID] + '</p>');
}
<div class="col-md-4">
<div class="form-group">
<?php
$sql3="SELECT * FROM email WHERE id='1'";
$result3=mysql_query($sql3) or die(mysql_error());
$rwsf= mysql_fetch_array($result3);
$fwelcome= $rwsf[3];
$freply= $rwsf[2];
$fbilling= $rwsf[1];
$fdelivery= $rwsf[4];
?>
<label>Email Templates: </label>
<select name="message" onChange="change();" class="form-control select2 required" style="width: 100%;">
<option disabled selected>Click To Select</option>
<option value="1">Welcome Email</option>
<option value="2">Billing Email</option>
<option value="3">Basic Reply Email</option>
<option value="4">Delivery Process Email</option>
</select>
</div>
</div>
</div>
<div class="row">
<div class="col-md-12">
<div class="form-group">
<input type="text" name="subject" placeholder="Subject" class="form-control required">
</div>
</div>
</div>
<textarea id="editor1" name="editor1" rows="10" cols="80">Select your mail design from the 'Email' drop down list above.</textarea><br>
<div class="form-wizard-buttons">
<button type="submit" class="btn btn-success" style="border:0px"><i class="fa fa-send"> Send Mail</i></button>
</div>
Hi as you have html content, you can follow below process to get html and send it to the function as parameter.
<div class="col-md-4">
<div class="form-group">
<?php
$sql3="SELECT * FROM email WHERE id='1'";
$result3=mysql_query($sql3) or die(mysql_error());
$rwsf= mysql_fetch_array($result3);
$fwelcome= $rwsf[3];
$freply= $rwsf[2];
$fbilling= $rwsf[1];
$fdelivery= $rwsf[4];
?>
<label>Email Templates: </label>
<select name="message" onChange="change();" class="form-control select2 required" style="width: 100%;">
<option disabled selected>Click To Select</option>
<option value="1">Welcome Email</option>
<option value="2">Billing Email</option>
<option value="3">Basic Reply Email</option>
<option value="4">Delivery Process Email</option>
</select>
</div>
</div>
</div>
<div class="row">
<div class="col-md-12">
<div class="form-group">
<input type="text" name="subject" placeholder="Subject" class="form-control required">
</div>
</div>
</div>
<textarea id="editor1" name="editor1" rows="10" cols="80">Select your mail design from the 'Email' drop down list above.</textarea><br>
<div class="form-wizard-buttons">
<button type="submit" class="btn btn-success" style="border:0px"><i class="fa fa-send"> Send Mail</i></button>
</div>
<div name="fwelcome_content">
<?php echo $fwelcome; ?>
</div>
<div name="fbilling_content">
<?php echo $fbilling; ?>
</div>
<div name="freply_content">
<?php echo $freply; ?>
</div>
<div name="fdelivery_content">
<?php echo $fdelivery; ?>
</div>
and then in javascript
var Code = new Array();
window.onload = function(e){
Code = new Array("", getHTMLContent("fwelcome_content"), getHTMLContent("fbilling_content"), getHTMLContent("freply_content"), getHTMLContent("fdelivery_content"));
}
function change() {
var ID = formconteudo.message.options[formconteudo.message.selectedIndex].value;
CKEDITOR.instances.editor1.setData('<p>' + Code[ID] + '</p>');
}
function getHTMLContent(elementId){
var htmlContent = document.getElementsByName(elementId)[0].innerHTML;
document.getElementsByName(elementId)[0].remove();
return htmlContent;
}

i always get the last selected value in hidden field

I am trying to pass the selected value into a hidden field but I always get the last value of option.
<div class="form-group">
<label class="col-sm-3 control-label"><?php echo get_phrase('section');?></label>
<div class="col-sm-5">
<select name="section_id" class="form-control selectboxit" style="width:100%;">
<?php
foreach($sections as $row):
?>
<option value="<?php echo $row['section_id'];?>"><?php echo $row['name'];?></option>
<?php endforeach;?>
</select>
</div>
</div>
<input type="text" name="section_id" value="<?php echo $row['section_id']?>">
<div class="form-group">
<label class="col-sm-3 control-label"><?php echo get_phrase('subject');?></label>
<div class="col-sm-5">
<select name="subject_id" class="form-control selectboxit" style="width:100%;">
<?php
$subjects = $this->db->get_where('enroll' , array('section_id' => $section_id))->result_array();
foreach($subjects as $row):
?>
<option value="<?php echo $row['student_id'];?>"><?php echo $row['name'];?></option>
<?php endforeach;?>
</select>
</div>
</div>
i want to pass the hidden field value to query inside the second dropdown how to do this
You can not directly pass section_id value to a text field, because it will always give last section_id. You should use below jquery to assign selected option value to text field:
$(document).ready(function () {
$('.selectboxit').on('change', function() {
$('#section_id').val(this.value);
})
});

The selected option must shown after the function of onchange

I have 2 dropdowns, just like the title.. The selected option must shown after the function of onchange meaning when it automatically refreshes the selected option must stay and show the selected options . The problem is when I select an option from the 2nd dropdown which has onchange function it refreshes and it gets back to the default option.
Here's the code
<div id="page-wrapper">
<div class="container-fluid">
<div class="row">
<div class="col-lg-12">
<div class="col-lg-10">
<h1 class="page-header">
BRANCHES
</h1>
</div>
<div class="col-lg-2">
<a class="btn btn-default bad-marg" href="index.php?act=abr" role="button">Add Branch</a>
</div>
</div>
</div>
<div class="row">
<div class="col-lg-12">
<div id="form">
<form action="func_vbrs.php" method="POST" class="form-horizontal">
<fieldset>
<div class="row">
<div class="col-lg-4">
<div class="form-group">
<label for="bl" class="control-label col-xs-3"><p class="left">Branch</p></label>
<div class="col-xs-8">
<div class="req">
<select name="bid" class='form-control'>
<option value='' default style='color:gray;'>Branch</option>
<?php
include_once "config.php";
$sql="select branchID, b, bl from branch where b!='HOK'";
$stmt=$con->prepare($sql);
$stmt->execute();
$stmt->bind_result($bid, $b, $bl);
$stmt->store_result();
while($stmt->fetch()){
echo '<option value="'.$bid.'">'.$b.'-'.$bl.'</option>';
}
?>
</select>
</div>
</div>
<div class="col-xs-1">
</div>
</div>
</div>
<div class="col-lg-4">
<div class="form-group">
<label for="cat" class="control-label col-xs-3"><p class="left">Category</p></label>
<div class="col-xs-8">
<div class="req">
<select name="brcat" class="form-control" onchange='this.form.submit()'>
<option value="" default style="color:gray;">Category</option>
<option value="Stock">Stock</option>
<option value="Sales">Sales</option>
<option value="Stock Transfer">Stock Transfer</option>
</select>
</div>
</div>
<div class="col-xs-1">
</div>
</div>
</div>
<div class="col-lg-4">
</div>
</div>
<noscript><input type="submit" value="Submit"></noscript>
</fieldset>
</form>
</div>
</div>
</div>
</div>
</div>
As you can see the 2nd drop down is category, If a user already selects an option after the automatic refresh or onchange function, it gets back to default option.
You need to cross check against post on page load, and add a selected tag appropriately. There are more elegant solutions with less bulky code if you use a loop to create your options, but that's another question.
<?PHP
if (!empty($_POST['brcat'])){
$selected_item = $_POST['brcat'];
} else { $selected_item = Null; }
function selcheck($item1, $item2){
if ($item1 == $item2){
$ret = " selected=\"selected\" ";
} else {
$ret = "";
}
return($ret);
}
?>
<select name="brcat" class="form-control" onchange='this.form.submit()'>
<option value="" default style="color:gray;">Category</option>
<?PHP
$sel = selcheck("Stock",$selected_item);
?>
<option value="Stock"<?=$sel?>>Stock</option>
<?PHP
$sel = selcheck("Sales",$selected_item);
?>
<option value="Sales"<?=$sel?>>Sales</option>
<?PHP
$sel = selcheck("Stock Transfer",$selected_item);
?>
<option value="Stock Transfer"<?=$sel?>>Stock Transfer</option>

Categories

Resources