[英]How to connect two columns from the table to the selected column showing only related results? Php, Javascript, Jquery
First look my database. 首先看一下我的数据库。 https://imgur.com/QWgN9UA Marka and model is only important for you.
https://imgur.com/QWgN9UA标记和模型仅对您很重要。 When user select 'AJP' marka, I need only show him model for that mark.
当用户选择“ AJP”标记时,我只需要向他显示该标记的模型。 Example when select from dropdown AJP get model "PR4 125 ENDURO" , PR4 125 SUPERMOTOAD" and "PR4 200". I already do anythink but I show user all model from database I need to show only related for selected mark. I show my code , I would like someone to help me without much change of the existing code, if possible.
从下拉列表AJP中选择的示例获取模型“ PR4 125 ENDURO”,“ PR4 125 SUPERMOTOAD”和“ PR4 200”。我已经做了任何思考,但是我向用户显示了数据库中的所有模型,我只需要显示与所选标记相关的模型。 ,如果可能的话,我希望有人在不更改现有代码的情况下为我提供帮助。
My Php code to get Marka 我的PHP代码可获取Marka
public function get_marka_data() {
$query = $this->db->query("
SELECT DISTINCT mo.marka
FROM " . DB_PREFIX . "model mo
GROUP BY mo.marka
")->rows;
$data = array_map(function($row){
return array('value'=>$row['marka'],'label'=>$row['marka']);
}, $query);
if (isset($this->request->server['HTTP_ORIGIN'])) {
$this->response->addHeader('Access-Control-Allow-Origin: ' . $this->request->server['HTTP_ORIGIN']);
$this->response->addHeader('Access-Control-Allow-Methods: GET, PUT, POST, DELETE, OPTIONS');
$this->response->addHeader('Access-Control-Max-Age: 1000');
$this->response->addHeader('Access-Control-Allow-Headers: Content-Type, Authorization, X-Requested-With');
}
$this->response->addHeader('Content-Type: application/json');
$this->response->setOutput(json_encode($data));
}
My code for retrieve model 我的检索模型代码
public function get_model_data() {
$query = $this->db->query("
SELECT DISTINCT mo.model
FROM " . DB_PREFIX . "model mo
GROUP BY mo.model
")->rows;
$data = array_map(function($row){
return array('value'=>$row['model'],'label'=>$row['model']);
}, $query);
if (isset($this->request->server['HTTP_ORIGIN'])) {
$this->response->addHeader('Access-Control-Allow-Origin: ' . $this->request->server['HTTP_ORIGIN']);
$this->response->addHeader('Access-Control-Allow-Methods: GET, PUT, POST, DELETE, OPTIONS');
$this->response->addHeader('Access-Control-Max-Age: 1000');
$this->response->addHeader('Access-Control-Allow-Headers: Content-Type, Authorization, X-Requested-With');
}
$this->response->addHeader('Content-Type: application/json');
$this->response->setOutput(json_encode($data));
}
My code in template file for fetch that data with ajax 我的模板文件中的代码用于使用Ajax提取数据
<script type="text/javascript">
$.ajax({
url: 'index.php?route=api/reifenmontage/get_marka_data',
context: document.body,
success: function(data) {
const selectControl = $('#result');
selectControl.html(data.map(ExtractData).join(''));
}
});
function ExtractData(item) {
return ` <option value="${item.value}">${item.label}</option>`;
}
</script>
<script type="text/javascript">
$.ajax({
url: 'index.php?route=api/reifenmontage/get_model_data',
context: document.body,
success: function(data) {
const selectControl = $('#result2');
selectControl.html(data.map(ExtractData).join(''));
}
});
</script>
And finally my template html 最后是我的模板html
<div id="additionalRow" class="row termin_row">
<div class="col-sm-4 col-xs-12">
<div class="row"><label>Marke und model</label></div>
</div>
<div class="col-xs-12 col-sm-3" style="margin-right:30px;">
<div class="row">
<select class="form-control" id="result">
</select>
</div>
</div>
<div class="col-xs-12 col-sm-4">
<div class="row">
<select class="form-control" id="result2">
</select>
</div>
</div>
</div>
Problem is in the query, instead of GROUP BY... , use WHERE m.marka = '', pass the marka to the script. 问题出在查询中,而不是GROUP BY ...,请使用WHERE m.marka ='',将marka传递给脚本。
First render the markas to the page, when some marka is selected send the request to the server (first add first parameter to the function get_marka_data($marka)) with this query 首先将标记渲染到页面上,选择了某些标记后,将请求发送到服务器(首先将第一个参数添加到函数get_marka_data($ marka)中)
SELECT DISTINCT mo.marka
FROM " . DB_PREFIX . "model mo
WHERE mo.marka = " . $marka
When you get the response render it to the page in some dropdown 当您获得响应时,将其下拉到页面
Don't forget to validate!! 别忘了验证!!
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.