我需要将jquery ID值传递到codeigniter中的est_model-> get_img()函数中,并在同一模式框中显示所有内容,我尝试了自己的逻辑,但它不起作用,请帮帮我,谢谢提前
下面是我的代码: 模态标签:
.hidden
{
display: none;
}
#boxx {
border: none;
box-shadow: 0 2px 2px 0 rgba(0,0,0,0.16), 0 0 0 1px rgba(0,0,0,0.08);
border-radius: 2px;
height: 46px;
outline: none;
transition: box-shadow 200ms cubic-bezier(0.4,0.0,0.2,1);
background-color: #fff;
border-radius: 3px;
border-top-color: rgb(160,160,160);
cursor: text;
display: inline-block;
font: 18px arial,sans-serif;
line-height: 36px;
max-width: 672px;
position: relative;
width: 100%;
border-bottom-left-radius: 0px;
}
#boxx>input {
padding-left: 50px;
padding-right: 50px;
background: transparent;
border: none;
bottom: 0;
box-sizing: border-box;
left: 0;
margin: 0;
outline: none;
position: absolute;
/* top: 2px; */
width: 100%;
height: 100%;
/* box-shadow: 0 2px 2px 0 rgba(0,0,0,0.16), 0 0 0 1px rgba(0,0,0,0.08); */
box-shadow: 2px 0 2px 0 rgba(0, 0, 0, 0.08), -2px 0 1px -1px rgba(0, 0, 0, 0.08);
}
.gb_pf.gb_rf {
visibility: inherit;
background: none;
border: none;
outline: none;
padding: 0 10px;
line-height: 0;
padding-top: 4px;
}
.clear_search .gb_pf.gb_rf {
padding: 0px 0px;
padding-top: 4px;
}
.clear_search {
float: right;
right: 2%;
top: 4%;
width: 6%;
/* height: 46px !important; */
color: grey;
text-align: center;
height: 90% !important;
background: #fff;
opacity: 0.54;
cursor: pointer;
z-index: 3;
position: relative;
}
我的jquery:
<link href="//cdnjs.cloudflare.com/ajax/libs/jqueryui/1.11.2/jquery-ui.css" rel="stylesheet"/>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="http://code.jquery.com/ui/1.10.2/jquery-ui.js" ></script>
<div class="mb-20 mt-10" id="boxx">
<input id="myInput" type="url" title="search" placeholder="Search" style="border-bottom: 0 !important;">
<span class="clear_search hidden" title="clear search">
<button class="gb_pf gb_rf" aria-label="Clear search" type="button">
<svg class="svg-style" focusable="false" height="38px" viewBox="0 0 24 24" width="24px" xmlns="http://www.w3.org/2000/svg"><path d="M19 6.41L17.59 5 12 10.59 6.41 5 5 6.41 10.59 12 5 17.59 6.41 19 12 13.41 17.59 19 19 17.59 13.41 12z"></path><path d="M0 0h24v24H0z" fill="none"></path></svg>
</button>
</span>
</div>
模式框:
<a href="#view_all_img_modal" data-toggle="modal" data-est-id="<?php echo $row->est_id;?>">View all</a>
答案 0 :(得分:4)
您的PHP文件无法从GET请求中读取ID,除非模态框实际上为admin/est_view.php
。但是我想我知道您要做什么,
步骤1:
创建一个名为admin/est_view.php
的文件,该文件仅包含php脚本,该脚本将从DB和foreach clause
提取数据以形成html响应,并且不要忘记它需要连接到数据库。
这是您可以使用或开发的示例:
<?php
try{
$pdo = new PDO("mysql:host=localhost;dbname=demo", "root", "passwd");
$pdo->setAttribute(PDO::ATTR_ERRMODE, PDO::ERRMODE_EXCEPTION);
} catch(PDOException $e){
die("ERROR: Could not connect. " . $e->getMessage());
}
try{
if(isset($_REQUEST["ID"])){
$sql = "SELECT * FROM images_table WHERE :ID";
$stmt = $pdo->prepare($sql);
$term = $_REQUEST["ID"] . '%';
$stmt->bindParam(":ID", $term);
$stmt->execute();
if($stmt->rowCount() > 0){
while($row = $stmt->fetch()){
echo "<img src=\"" . $row["url"] . "\">";
}
}
}
} catch(PDOException $e){
die("ERROR: Could not able to execute $sql. " . $e->getMessage());
}
unset($stmt);
unset($pdo);
?>
第2步:
现在您可以使用自己的JS了:
$('#view_all_images_modal').on('show.bs.modal', function(e) {
var est_id = $(e.relatedTarget).data('est-id');
$.ajax({url:"admin/est_view.php?ID="+est_id,cache:false,success:function(result){
$("#view_all_img_modal").html(result);
}});
});