javascript - 如何在jquery中附加返回值

标签 javascript php jquery html

这里我从数据库中选择了匹配的记录,然后我返回到上一页,这里我得到了所有值,但我不知道如何在这个页面中附加这个返回值,我需要像ROOM 2那样,房间 3...value.room_number 中附加值,在 value.bg_id 中附加PG 名称

<小时/>

我有这样的值(value)观

var res =jQuery.parseJSON(data);
         console.log(res);

count:2 data:Array[2] 0:Object 1:Object

booking_status:"1"

id:"2"

pg_id:"1"

rent:"4000"

room_number:"Room 2"

room_sharing:"2"


booking_status:"1"

id:"3"

pg_id:"1"

rent:"4000"

room_number:"Room 3"

room_sharing:"2"

index.php
<script>
function showDiv(toggle){
var sharing=$("#sharing").val();
$.ajax({
	     type: "POST",
		 url: "pg_details.php",
	     data: "sharing_id="+sharing,
		 success: function(data) {
		 var res =jQuery.parseJSON(data);
		 console.log(res);

		 if(res['return'] == 1){
			   var htmlString=''; 
			   $.each( res['data'], function( key, value ){
			  htmlString ='<div id="toggle"><div class="container" style=" margin-bottom: 30px;"><div class="row"><h4 style="margin-left:15px;">'+value.pg_id+'</h4><div class="col-sm-10"><div class="btn-group" id="btnmar"><a href="register.php?id=2"><button  type="button" class="btn btn-primary" style=" width: 71px; ">'+value.room_number+'</button></a>&nbsp;&nbsp;</div></div><div class="col-sm-2"><div class="panel-group"><div class="panel panel-primary"><div class="panel-heading"> Premium Facility</div><div class="panel-body" style=" padding-top: 5px; padding-bottom: 5px;"><i class="fa fa-television" aria-hidden="true" style="margin-right:15px;"></i>T.V.</div><div class="panel-body" style=" padding-top: 5px; padding-bottom: 5px;"><i class="fa fa-wifi" aria-hidden="true" style="margin-right:15px;"></i>Wifi</div><div class="panel-body" style=" padding-top: 5px; padding-bottom: 5px;"><i class="fa fa-bed" aria-hidden="true" style="margin-right:15px;"></i>Bed</div><div class="panel-body" style=" padding-top: 5px; padding-bottom: 5px;"><i class="fa fa-shopping-basket" aria-hidden="true" style="margin-right:15px;"></i>Washing Machine</div></div></div></div></div></div></div>';
				
			});
			$(".view_room").prepend(htmlString);
			
		}
	     }
	  });
}
</script>

pg_details.php

<?php
include_once("admin/config.php");
include("functions.php");
//$pg_name=Getpg($_POST['pg_id']);
$sharing=$_POST['sharing_id'];//Getting Sharing Value

$sql=mysql_query("SELECT * FROM rooms WHERE room_sharing='$sharing'");
$count = mysql_num_rows($sql);
if($count > 0){
	while($row=mysql_fetch_assoc($sql)){
	$data[]= $row;
	}
	$pg_type= array("return"=>1,"count" =>$count,"data" =>$data);
    echo $pg_type = json_encode($pg_type);
}else{
	$pg_type= array("return"=>0,"count" =>0,"data" =>"");
    echo $pg_type = json_encode($pg_type);
}
?>
<div class="view_room"></div>

最佳答案

尝试以下操作:

$.ajax({
  type: "POST",
  url: "pg_details.php",
  data: "sharing_id=" + sharing,
  success: function(data) {
    var res = jQuery.parseJSON(data);

    $.each(res.data, function(key, value) {
     el = $('[data-id='+value.pg_id +']');
     if (el.length) {
         el.find('.btnmar').append(' <a href="register.php?id='+value.id +'">
            <button type="button" class="btn btn-primary" style=" width: 71px; ">'+value.room_number+'</button>
          </a>&nbsp;&nbsp;');
      } else {
     var htmlString =  '<div id="toggle" data-id="'+value.pg_id +'">
 <div class="container" style=" margin-bottom: 30px;">
    <div class="row">
      <h4 style="margin-left:15px;">'+value.pg_id +'</h4>
      <div class="col-sm-10">
        <div class="btn-group btnmar">
          <a href="register.php?id='+value.id +'">
            <button type="button" class="btn btn-primary" style=" width: 71px; ">'+value.room_number+'</button>
          </a>&nbsp;&nbsp;
        </div>
      </div>
      <div class="col-sm-2">
        <div class="panel-group">
          <div class="panel panel-primary">
            <div class="panel-heading"> Premium Facility</div>
            <div class="panel-body" style=" padding-top: 5px; padding-bottom: 5px;"><i class="fa fa-television" aria-hidden="true" style="margin-right:15px;"></i>T.V.</div>
            <div class="panel-body" style=" padding-top: 5px; padding-bottom: 5px;"><i class="fa fa-wifi" aria-hidden="true" style="margin-right:15px;"></i>Wifi</div>
            <div class="panel-body" style=" padding-top: 5px; padding-bottom: 5px;"><i class="fa fa-bed" aria-hidden="true" style="margin-right:15px;"></i>Bed</div>
            <div class="panel-body" style=" padding-top: 5px; padding-bottom: 5px;"><i class="fa fa-shopping-basket" aria-hidden="true" style="margin-right:15px;"></i>Washing Machine</div>
          </div>
        </div>
      </div>
    </div>
  </div>
</div>';
   $(".view_room").prepend(htmlString);}
    });


  }
});

pg_name 的 php:

while($row=mysql_fetch_assoc($sql)){
    $row['pg_name'] = Getpgname($row['pg_id']);
    $data[]= $row;
    }

或使用连接查询返回名称和数据

关于javascript - 如何在jquery中附加返回值,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/39738457/

相关文章:

php - Laravel 迁移 Postgres 错误 SQLSTATE[08006]

jquery - 如何让滚动条只以固定的时间间隔滚动?

javascript - 使用 WebGL 进行实时 DEM 数据渲染

javascript - 如何按日期对数组中的项目进行分组?

javascript - 如何将配置从 jshint 和 jscs 转换为 eslint?

javascript - 创建一条垂直线,覆盖所有 html 内容并在特定时间段内在页面上移动(javascript)

jquery - 如何通过按 Enter 键触发输入类型按钮

javascript - 使用正则表达式计算字符串中句号和逗号的数量

php - Curl 不适用于 Nagios

php - 仅限于相关结果 - MYSQL