We Keep Coding

How can I insert an Ajax result into an input value?

How can I insert an Ajax result into an input value?
HTML/PHP
<select id="getcategory" name='categoryname' ><option>SELECT---</option>
<?php
$getcat = mysqli_query($con,"SELECT * FROM category ORDER BY categoryname ASC");
while($rec = mysqli_fetch_assoc($getcat)) { ?>
<option><?php echo $rec['categoryname']; ?></option><?php } ?>
</select><br>
<input class='categoryprefix' type='text' name='subcatprefix' />
Ajax
<script type="text/javascript">
$(document).ready(function(){
$("#getcategory").change(function(){
var cprefix = $(this).val();
$.ajax({
url: 'getCategory.php',
type: 'post',
data: {categoryname: cprefix},
success: function(data) {
$(".categoryprefix").append(data);
}
});
});
});
</script>
Note:
File getCategory.php is good

ajax not working displaying data into text area on dropdown change in php

i am trying to display data inside using ajax in php, i have done the following code:
<table>
<select id="staff" name="staff">
<option value="#N">N</option>
<option value="#R">R</option>
<option value="#S">S</option>
<option value="#J">J</option>
<option value="#So">So</option>
<option value="#Sr">Sr</option>
<option value="#Jo">Jo</option>
<option value="#Sc">Sc</option>
<option value="#P">P</option>
</select>
<textarea id="show" rows="8" name="notice" class="form-control"></textarea>
</table>
$('#customer').change(function () {
var id = $(this).val();
$.ajax({
type: "GET",
url: "page2.php",
data: "pass_id=" + id,
success: function (data) {
alert(data);
document.getElementById("show").innerHTML = data;
}
});
});
below is my page2.php which fetches the data from database:
<?php
echo $get_id = $_GET['pass_id'];
include("db.php");
$sql = "select notice from admin where username='$get_id'";
while ($row = mysqli_fetch_array($sql)) {
echo $row['notice'];
}
?>
but this is not giving me any data in textbox area , can anyone please tell me what is wrong in my code?

You are using 'customer' instead of 'staff' please change and try
$('#staff').change(function () {
var id = $(this).val();
$.ajax({
type: "GET",
url: "page2.php",
data: "pass_id=" + id,
success: function (data) {
console.log(data);
document.getElementById("show").innerHTML = data;
}
});
});
<?php
$data = [];
$get_id = $_GET['pass_id'];
include("db.php");
$sql = "select notice from admin where username='$get_id'";
while ($row = mysqli_fetch_array($sql)) {
$data[] = $row['notice'];
}
echo json_encode($data);
?>

Use $('#staff').change(function () {
because your Id is staff not customer.

Change your id customer to staff
$('#staff').change(function () {
var id = $(this).val();
$.ajax({
type: "GET",
url: "page2.php",
data: "pass_id=" + id,
success: function (data) {
alert(data);
document.getElementById("show").innerHTML = data;
}
});
});
And also there is a mistake in your query, please try the below code.
<?php
$get_id = $_GET['pass_id'];
include("db.php");
$sql = "select notice from admin where username='$get_id'";
$result = mysqli_query($con,$sql);
while ($row = mysqli_fetch_array($result)) {
echo $row['notice'];
}
?>
Hope it will help.

codeigniter with ajax json_encode not working

i need help please ....
the probelm is the codes do nothing, i don't know what the problem
this is my code in View
<div id="ysfhkm_slc_country">
<select name="ysfhkm_slc_country" id="">
<option value="ts1" selected>Test</option>
</select >
</div>
<div id="ysfhkm_slc_negh">
<select name="ysfhkm_slc_negh" id="">
<option value="ts1" selected>Test</option>
</select >
</div>
<div id="ysfhkm_slc_city">
<select name="ysfhkm_slc_city" id="">
<option value="ts1" selected>Test</option>
</select >
</div>
this is my code 'Js' in View
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<script type="application/javascript">
/* hkm */
$(document).ready(function(){
$("#ysfhkm_slc_negh select").change(function () {
var state_value = $(this).val();
var country_valueee = $("#ysfhkm_slc_country select").val();
$.ajax({
url:'https://www*mysite*com/Search_controller/GetCitiesOfState',
method: 'POST',
data: {state_val: state_value, country_id: country_valueee},
dataType: 'json',
success: function(data){
$('#ysfhkm_slc_city select').html(data);
}
});
return false;
});
// get states of country
$("#ysfhkm_slc_country select").change(function () {
var country_value = $(this).val();
$.ajax({
url:'https://www*mysite*com/Search_controller/GetStatesOfCountry',
method: 'post',
data: {country_val: country_value },
dataType: 'json',
success: function(data){
$('#ysfhkm_slc_negh select').html(data);
console.log('done');
},
error: function (reponse) {
console.log('Problem with ajax');
}
});
$.ajax({
url:'https://www*mysite*com/Search_controller/GetCitiesOfState',
method: 'POST',
data: {state_val: 'ts1', country_id: country_value},
dataType: 'json',
success: function(data){
$('#ysfhkm_slc_city select').html(data);
}
});
return false;
});
});
/* end hkm */
</script>
this my Code Search_controller
the probelm is the codes do nothing, i don't know what the problem
i made models codes to comments to testing firt ajax+controller but
not working
<?php
class Search_controller extends CI_Controller{
public function index(){
}
public function GetCitiesOfState(){
/* comments
if($this->input->post('state_val') && $this->input->post('country_id')){
$postData = $this->input->post('state_val');
$country_id = $this->input->post('country_id');
$this->load->model('locationhkm_model');
$data = $this->locationhkm_model->getUserCitiesOfState($postData,$country_id);
echo json_encode($data);
}
*/
$postData = $this->input->post('state_val');
$country_id = $this->input->post('country_id');
$data = '<option value="222">citiessssssss</option>';
echo json_encode($data);
}
public function GetStatesOfCountry(){
/* comments
if($this->input->post('country_val')){
$postData = $this->input->post('country_val');
$this->load->model('locationhkm_model');
$data = $this->locationhkm_model->getUserStatesOfCounrty($postData);
echo json_encode($data);
}
*/
$postData = $this->input->post('country_val');
$data = '<option value="444" >statessssssss</option>';
echo json_encode($data);
}
}
?>

The problem is in your controller GetStatesOfCountry function return value. Change it like this
public function GetStatesOfCountry(){
$postData = $this->input->post('country_val');
//your logic
$data['value'] ="444"
$data['text'] ="statessssssss"
echo json_encode($data);
}
Change your URL as
url:"<?php echo base_url()?>index.php/Search_controller/testing_controller",
And inside your ajax success function,
success: function(data){
var return = $.parseJSON(data);
optionText = return.value;
optionValue = return.text;
$('#ysfhkm_slc_city').append(`<option value="${optionValue}">
${optionText}
</option>`);
}
To append a new option tag to select, you can use
var select = document.getElementById('ysfhkm_slc_city');
var opt = document.createElement('option');
opt.value = return.value;
opt.innerHTML = return.text;
select.appendChild(opt);

change event not triggered from dynamic selection

Let me put this as simple as possible. I have a ajax call which loads the dropdown dynamically. I have another ajax call which is used to display details when any item is clicked.
Problem: I cant trigger the event of second ajax call.
If second ajax call is working it has to atleast display triggered when the change event happens. But the change event not even triggers.
Code:
First ajax call
<select id="name">
<option selected disabled>Please select</option>
</select>
<?php if (isset($_GET['place']) && $_GET['place'] != '') { ?>
<script src="https://code.jquery.com/jquery-3.2.1.min.js"></script>
<script>
$.ajax({
type: "POST",
data: {place: '<?= $_GET["place"] ?>'},
url: 'listplace.php',
dataType: 'json',
success: function (json) {
if (json.option.length) {
var $el = $("#name");
$el.empty(); // remove old options
for (var i = 0; i < json.option.length; i++) {
$el.append($('<option>',
{
value: json.option[i],
text: json.option[i]
}));
}
}else {
alert('No data found!');
}
}
});
</script>
Continued 2nd ajax call with closing php..
<script src="https://code.jquery.com/jquery-3.2.1.min.js"></script>
<script>
$("#name").on('change',function (e) {
var name1 = this.value;
$.ajax ({
data:{name1: name1},
type: 'POST',
url: 'dataprod.php',
success: function (response) {
console.log(response);
$('.products-wrp').html('');
$('.products-wrp').hide();
$('.products-wrp').html(response);
$('.products-wrp').show();
},
});
});
</script>
<?php } ?>
output from dataprod.php
dataprod.php for reference
<?php
session_start(); //start session
include("config.inc.php"); //include config file
?>
<?php
$name1 = $_POST['name1'];
echo $name1;
$results = $mysqli_conn->query("SELECT product_name, product_desc, product_code,
product_image, product_price FROM products_list where product_name='$name1'");
$products_list = '<ul id ="products_list" class="products-wrp">';
while($row = $results->fetch_assoc()) {
$products_list .= <<<EOT
<li>
<form class="form-item">
<h4>{$row["product_name"]}</h4>
<div>
<img src="images/{$row["product_image"]}" height="62" width="62">
</div>
</form>
</li>
EOT;
}
$products_list .= '</ul></div>';
echo $products_list;
echo 'triggered';
?>

Choosing a chained select option with jquery using Codeigniter

I'm not much good at jquery and ajax, and I'm now having difficulties on a select box. I use CI and My code is below.
Another select box "category" data will be show according to the "brand". How can I carry data from "brand" and show data in "category" with jquery?
View
<select name="brand" class="form-control" id="brand" required>
<?php
if($items) {
foreach($items as $key) {
?>
<option value="<?php echo $key->brand_id ?>">
<?php echo $key->brand_name ?>
</option>
<?php
}
}
?>
</select>
<select name="category" class="form-control" id="category" required>
</select>
Ajax
<script>
$(function() {
$("#brand").on('change', function() {
var brand = $(this).val();
$.ajax ({
type: "post",
url: "<?php echo base_url(); ?>receiving/showCategory",
dataType: 'json',
data: 'brand='+brand,
success: function(msg) {
var options;
for(var i = 0; i<msg.length; i++) {
options = '<option>'+msg.category[i].category_name+'</option'>;
}
$('#category').html(options);
}
});
});
});
</script>
Controller
function showCategory() {
$brand_id = $this->input->post('brand');
$data['category'] = $this->item_model->category($brand_id);
echo json_encode($data);
}
My category table contains: category_id, category_name, brand_id.

use ajax onchange. .in your view file..
<select name="brand" class="form-control" id="brand" required onchange="brand(this.value,'divid')">
<?php
if($items) {
foreach($items as $key) {
?>
<option value="<?php echo $key->brand_id ?>">
<?php echo $key->brand_name ?>
</option>
<?php
}
}
?>
</select>
<div id="divid">
<select name="category" class="form-control" id="category" required>
<option>Select Category</option>
</select>
</div>
<script>
function brand(id,divid)
{
$.ajax({
type: "POST",
data: "pid="+id,
url: '<?php echo base_url(); ?>receiving/showCategory ?>',
success: function(html){
$('#'+divid).html(html);
}
});
}
</script>
in your function showCategory() :
<div id="divid">
<select name="category" class="form-control" id="category" required>
$brandid = $this->input->post('pid');
//you can pass this brand id to your query and echo the category in option value//
<option>//your result //</option>
</select>
</div>

You need to concat the all values in success function like
options += '<option>'+msg.category[i].category_name+'</option'>;
$('#category').html(options);

Look like your code is correct, but need to change a little bit in ajax request.
You need to parse the data return into parseJson first. The options variable in for loop should concatenate with += code. See example below:
<script>
$(function() {
$("#brand").on('change', function() {
var brand = $(this).val();
$.ajax ({
type: "post",
url: "<?php echo base_url(); ?>receiving/showCategory",
dataType: 'json',
data: 'brand='+brand,
success: function(msg) {
var data = $.parseJSON(msg),options;
for(var i = 0; i<data.length; i++) {
options += '<option>'+data.category[i].category_name+'</option'>;
}
$('#category').html(options);
}
});
});
});
</script>
In case you have a problem with this code, you should change variable in codeigniter part for the variable that hold the results. You can see my working code below as an example :
Js Code
$.ajax({
type : 'POST',
url : '<?php echo base_url();?>controller/function_name',
dateType : 'json',
data : {depart_id : _depart_id.val()},
success : function(data){
var json_data = $.parseJSON(data),
options;
for(var i = 0; i<json_data.length; i++){
options += '<option value="'+json_data[i].destination_id+'">'+json_data[i].location+'</option>';
}
_destination_id.html(options);
}
});
Here is codeigniter code(php)
$destination = $this->custom_model->get_destination_distinct($table,$where);
echo json_encode($destination);