自动选择器根据父选择器选择进行更新

时间:2020-05-20 07:26:06

标签: javascript php jquery ajax codeigniter

我已经在mvc上设计了所有内容,但是我不知道从respone json检索数据的语法。

这是父选择器,其位置代码将在以后检索:

<div class="form-group row">
	<label for="kode_lokasi" class="control-label col-lg-2"> Kode Lokasi</label>
	<div class="col-lg-3">
		<?php echo form_dropdown("input[kode_lokasi]", $arr_combo_kode_lokasi, set_value("input[kode_lokasi]"), 'id="kode_lokasi" class="form-control chosen" onChange="lokasi_ajax()"  data-placeholder="Pilih"  required');?>
		<?php echo form_error('input[kode_lokasi]','<span class="label label-danger">','</span>'); ?>
	</div>
</div>

这是选择器,它将在存在获得的位置代码后包含项目数据:

<select class="form-control chosen" id="repkodebarang">
			<option>1</option>
			<option>2</option>
			<option>3</option>
		</select>	

Js:

function lokasi_ajax() {
		var kode_lokasi = $('#kode_lokasi').val();

		$.ajax({
			url : '<?= base_url() ?>index.php/asset/asset_dijual_proses/lokasi_ajax',
			data: 'kode_lokasi='+kode_lokasi,
			success : function (data) {
				var json = data;
				value = JSON.parse(json);

				$.each(value, function (i, data) {
					$("#repkodebarang").appends('<option>'+value.item_barang+'</option>');				
				})
				
			}
		});
	}

Php控制器:

function lokasi_ajax()
	{
		$kode_lokasi = $_GET['kode_lokasi'];
		$data =array();

		$query = $this->db->query("SELECT id_reg, item_lokasi, item_barang FROM asset_item 
			WHERE item_lokasi= '$kode_lokasi'");
		foreach ($query->result() as $row) {
			$data[] = array(
				// 'kode_aset' => $row->id_reg,
				// 'item_lokasi' => $row->item_lokasi,
				'item_barang' => $row->item_barang 
			);
		}
		echo json_encode($data);
	}

json的响应数据如下所示: Json Data Response

,但是数据仍然无法添加到我的选择器中: The problem

1 个答案:

答案 0 :(得分:0)

我为您的问题写了一个可能的解决方案,在必要时会提及您的评论,以查看是否对您有帮助。

success : function (data) {
    var json = data;
    value = JSON.parse(json);
    let $html = ''; // initialize a variable to store html
    $.each(value, function () {
        $html += '<option>' + value.item_barang + '</option>';  // append new data on each iteration        
    })
    $('#repkodebarang').append($html); // append the element to the select element
}