小贝子编程

如何通过PHP(代码点火器)和Jason在Ajax中处理多维数组



这是我想使用 ajax 显示数据库中数据的 Html

。
<div id="specContWrap">
<div id="overViewWrap" class="overViewTableCon">
<div class="overViewTable on">
<div class="tit">Overview</div>
<table class="infoTableType">
<caption>Overview Table</caption>
<tbody id="overview_details">
<tr>
<th scope="row">Category</th>
<td> Commercial</td>
</tr>
<tr>
<th scope="row">Product label</th>
<td> Select Trim </td>
</tr>
<tr>
<th scope="row">Model name</th>
<td> H-1</td>
</tr>
<tr>
<th scope="row">Seats</th>
<td>Select Trim</td>
</tr>
</tbody>
</table>
</div>
<!-- //.overViewTable -->
</div>
<!-- toggle : s -->
<div class="togListWrap small  sepcListWrap" id="overviewh1">
<div class="togList">
<button class="btnOpenClose ">Performance</button>
<div class="togCont " id="performanceWrap">
Select Trim
</div>
</div>
<div class="togList">
<button class="btnOpenClose ">Dimension</button>
<div class="togCont " id="dimensionWrap">
<div class="dimension on">
Select Trim
</div>
<!-- //demention -->
</div>
</div>
<div class="togList">
<button class="btnOpenClose ">Wheels</button>
<div class="togCont " id="wheelsWrap">
<div class="wheels on">
Select Trim
</div>
<!-- //wheels -->
</div>
</div>
</div>
</div>
<div id="htmSpecContWrap" class="hide">
</div

这是 j 查询更改函数

$(document).ready(function() {
$('#selTrim').change(function() {
var trim_id1 = $(this).val();
if (trim_id1) {
$.ajax({
type: 'POST',
url: '<?= base_url();?>H1_specifications/h1_trim_detail',
data: 'trim_id1=' + trim_id1,
datatype: 'Jason',
success: function(data) {
console.log(JSON.stringify(data));
// here i want to Display data up in the html,
//which had responded through controller.
}
});
}
});
});

这里 控制器功能

public function h1_trim_detail(){
$id = $_POST['trim_id1'];
if(isset($_POST['trim_id1']) !== NULL){
$this->load->model('Admin_panel');
$results['overview_details'] =$this->Admin_panel->select_h1_details_specification($id);
$results['cargo_details'] = $this->Admin_panel->select_h1_Cargo($id);
$results['engine_details'] =$this->Admin_panel->select_h1_engine($id);
$results['exterior_details'] =$this->Admin_panel->select_h1_exterior($id);
$results['feul_details'] =$this->Admin_panel->select_h1_feul_comsuption($id);
$results['weight_details'] =$this->Admin_panel->select_h1_weight($id);
$results['wheels_details'] =$this->Admin_panel->select_h1_wheels($id);
$results['transmission_details'] =$this->Admin_panel->select_h1_transmission($id);
exit(json_encode($results));
}
}

我想获取所有表数据并通过 ajax 显示它，jason，但我不知道如何处理编码为 jason 的多维数组 (php(，

你好，这里是 ajax 代码

$(document).ready(function(){
$('#selTrim').change(function(){
var trim_id1 = $(this).val();
if(trim_id1){
$.ajax({
type:'POST',
url:'<?= base_url();?>H1_specifications/h1_trim_detail',
data:'trim_id1='+trim_id1,
datatype:'Json',
success:function(response){
if(response.success==1){
$('#PlaceWhereYouWantToPlace').html(response.data);
}else{
$('#').text('No Data Found');
}
}
}); 
}
});
});

控制器

我总是在控制器中准备我的HTML代码，然后简单地放在视图中。在控制器中准备 ajax HTML 数据的原因是我可以轻松地更改和操作数据和 HTML 内容。

foreach($propertyAddedData as $propertyAddedData){
$table_data .= '<tr>
<td><a href='.base_url('property/property_details/'.base64_encode($propertyAddedData['data']['id'])).'>'.$propertyAddedData['data']['property_address'].'</a></td>
<td>$'.$propertyAddedData['data']['price'].'</td>
<td>'.$propertyAddedData['data']['bedrooms'].'</td>
<td>'.$propertyAddedData['data']['bathrooms'].'</td>
</tr>';
$error = 0; 
}else{
$error = 1; 
}
$propertyData = '<div class="mt-property-desc">
<table class="table-fixed">
<thead>
<tr>
<th>Address</th>
<th>Price</th>
<th>Beds</th>
<th>Baths</th>
</tr>
</thead>
<tbody>
<tr>
<td colspan="3"><span class="gap-50"></span></td>
</tr>
'.$table_data.'
</tbody>
</table>
</div>';
$data    = $propertyData;
echo json_encode(array('error'=>$error,'data'=>$data));
exit;

我希望它能让你清楚，但如果没有，请让我知道我会解释你

尝试：

success: function(data) {
console.log( data.overview_detail);
console.log( data.cargo_details);
... and so on
}

//从 php end 使用 json_encode(( 和 要在 JavaScript 中解码，请使用以下代码

var obj = JSON.parse(data);

这里 控制器功能

public function h1_trim_detail(){
$id = $_POST['trim_id1'];
if(isset($_POST['trim_id1']) !== NULL){
$this->load->model('Admin_panel');
$rows7 =$this->Admin_panel->select_h1_details_specification($id);
$rows = $this->Admin_panel->select_h1_Cargo($id);
$rows1 =$this->Admin_panel->select_h1_engine($id);
$rows2 =$this->Admin_panel->select_h1_exterior($id);
$rows3 =$this->Admin_panel->select_h1_feul_comsuption($id);
$rows4 =$this->Admin_panel->select_h1_weight($id);
$rows5 =$this->Admin_panel->select_h1_wheels($id);
$rows6 =$this->Admin_panel->select_h1_transmission($id);
echo "<div id='specContWrap'>";
if($rows7 !== false){
echo "<div id='overViewWrap' class='overViewTableCon'>";
echo "<div class='overViewTable on'>";
echo "<div class='tit'>Overview</div>";
echo "<table class='infoTableType'>";
echo "<caption>Overview Table</caption>";
echo "<tbody>";
echo "<tr>";
echo "<th scope='row'>Category</th>";
echo "<td>Commercial</td>";
echo "</tr>";
foreach($rows7 as $row){
echo "<tr>";
echo "<th scope='row'>Product label</th>";
echo "<td>".$row['name']."</td>";
echo "</tr>";
echo "<tr>";
echo "<th scope='row'>Model name</th>";
echo "<td>". $row['name_car']."</td>";
echo "</tr>";
echo "<tr>";
echo "<th scope='row'>Seats</th>";
echo "<td>". $row['seats']."</td>";
echo "</tr>";
}
echo "</tbody>";
echo "</table>";
echo "</div>";
echo "</div>";
}else{
echo "Not Found";
}

echo "<div class='togListWrap small  sepcListWrap' id='overviewh1'>";
echo "<div class='togList'>";
echo "<button class='btnOpenClose'>Performance</button>";
echo "<div class='togCont' id='performanceWrap'>";
echo "<div class='performance on'>";
if($rows1 !== false){
echo "<dl class='specList'>";
echo "<dt>Engine Specification</dt>";
foreach($rows1 as $row){
echo "<dd>";
echo "<dl>";
echo "<dt>".$row['label']."</dt>";
echo "<dd>".$row['descriptions']."</dd>";
echo "</dl>";
echo "</dd>";
}
echo "</dl><br>";
}else{
echo "<dt>Engine Specification Not Found</dt><br>";
}
if($rows3 !== false){
echo "<dl class='specList'>";
echo "<dt>Feul Comsuption Specification</dt>";
foreach($rows3 as $row){
echo "<dd>";
echo "<dl>";
echo "<dt>".$row['label']."</dt>";
echo "<dd>".$row['description']."</dd>";
echo "</dl>";
echo "</dd>";
}
echo "</dl><br>";
}else{
echo "<dt>Feul Comsuption Specification Not Found</dt><br>";
}
if($rows6 !== false){
echo "<dl class='specList'>";
echo "<dt>Transmission Specification</dt>";
foreach($rows6 as $row){
echo "<dd>";
echo "<dl>";
echo "<dt>".$row['label']."</dt>";
echo "<dd>".$row['descriptions']."</dd>";
echo "</dl>";
echo "</dd>";
}
echo "</dl><br>";
}else{
echo "<dt>Transmission Specification Not Found</dt><br>";
}
echo "</div>";
echo "</div>";
echo "</div>";
echo "<div class='togList'>";
echo "<button class='btnOpenClose'>Dimension</button>";
echo "<div class='togCont' id='DimensionWrap'>";
echo "<div class='Dimension on'>";
if($rows2 !== false){
echo "<dl class='specList'>";
echo "<dt>Exterior Specification</dt>";
foreach($rows2 as $row){
echo "<dd>";
echo "<dl>";
echo "<dt>".$row['label']."</dt>";
echo "<dd>".$row['description']."</dd>";
echo "</dl>";
echo "</dd>";
}
echo "</dl><br>";
}else{
echo "<dt>Exterior Specification Not Found</dt><br>";
}
if($rows4 !== false){
echo "<dl class='specList'>";
echo "<dt>Weight Specification</dt>";
foreach($rows4 as $row){
echo "<dd>";
echo "<dl>";
echo "<dt>".$row['label']."</dt>";
echo "<dd>".$row['description']."</dd>";
echo "</dl>";
echo "</dd><br>";
}
echo "</dl><br>";
}else{
echo "<dt>Weight Specification Not Found</dt><br>";
}
if($rows !== false){
echo "<dl class='specList'>";
echo "<dt>Cargo Specification</dt>";
foreach($rows as $row){
echo "<dd>";
echo "<dl>";
echo "<dt>".$row['label']."</dt>";
echo "<dd>".$row['description']."</dd>";
echo "</dl>";
echo "</dd>";
}
echo "</dl><br>";
}else{
echo "<dt>Cargo Specification Not Found</dt><br>";
}
echo "</div>";
echo "</div>";
echo "</div>";
echo "<div class='togList'>";
echo "<button class='btnOpenClose'>Wheels</button>";
echo "<div class='togCont' id='WheelsWrap'>";
echo "<div class='Wheels on'>";
if($rows5 !== false){
echo "<dl class='specList'>";
echo "<dt>Wheels Specification</dt>";
foreach($rows5 as $row){
echo "<dd>";
echo "<dl>";
echo "<dt>".$row['label']."</dt>";
echo "<dd>".$row['description']."</dd>";
echo "</dl>";
echo "</dd>";
}
echo "</dl><br>";
}else{
echo "<dt>Wheels Specification Not Found</dt><br>";
}
echo "</div>";
echo "</div>";
echo "</div>";
echo "</div>";
echo "</div>";
}
}

这是 j 查询更改函数

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$('#selTrim').change(function(){
var trim_id1 = $(this).val();
if(trim_id1){
$.ajax({
type:'POST',
url:'<?= base_url();?>H1_specifications/h1_trim_detail',
data:'trim_id1='+trim_id1,
success:function(data){
$('#specContWrap').html(data);
}
}); 
}
});
});
</script>

这是我想使用 ajax 显示数据库中数据的 HTML

<div class="specsContent" id="spec" data-modelyear="T9-2015">
<!-- specsContent : s -->
<div class="subTit2">Specification</div>
<div class="sortSelect">
<div class="tit">Choose a Trim</div>
<select title="Choose a Trim" id="selTrim" name="selTrim" class="bgLB">
<option disabled selected>Choose your Trim</option>
<?php
foreach($result as $row){
echo "<option value=".$row['trim_id'].">".$row['name']."</option>";
}
?>
</select>
</div>
<div id="specContWrap">
<div id="overViewWrap" class="overViewTableCon">
<div class="overViewTable on">
<div class="tit">Overview</div>
<table class="infoTableType">
<caption>Overview Table</caption>
<tbody>
<tr>
<th scope="row">Category</th>
<td> Commercial</td>
</tr>
<tr>
<th scope="row">Product label</th>
<td> Select Trim </td>
</tr>
<tr>
<th scope="row">Model name</th>
<td> H-1</td>
</tr>
<tr>
<th scope="row">Seats</th>
<td>Select Trim</td>
</tr>
</tbody>
</table>
</div><!-- //.overViewTable -->
</div>
<!-- toggle : s -->
<div class="togListWrap small  sepcListWrap" id="overviewh1">
<div class="togList">
<button class="btnOpenClose ">Performance</button>
<div class="togCont " id="performanceWrap">
Select Trim
</div>
</div>
<div class="togList">
<button class="btnOpenClose ">Dimension</button>
<div class="togCont " id="dimensionWrap">
<div class="dimension on">
Select Trim
</div><!-- //demention -->
</div>
</div>
<div class="togList">
<button class="btnOpenClose ">Wheels</button>
<div class="togCont " id="wheelsWrap">
<div class="wheels on">
Select Trim
</div><!-- //wheels -->
</div>
</div>
</div>
</div>
<div id="htmSpecContWrap" class="hide"></div>

相关内容

  • 没有找到相关文章

最新更新


热门标签：

javascript python java c# php android html jquery c++ css ios sql mysql arrays asp.net json python-3.x ruby-on-rails .net sql-server django objective-c excel regex ruby linux ajax iphone xml vba spring asp.net-mvc database wordpress string postgresql wpf windows xcode bash git oracle list vb.net multithreading eclipse algorithm macos powershell visual-studio image forms numpy scala function api selenium