codeigniter模态不起作用

时间:2016-02-18 11:24:38

标签: javascript php codeigniter

我有一个显示来自数据库的数据的视图,我的模态应该在点击时弹出,并显示视图中显示的更大的图片,没有任何反应当我点击我的图像任何想法如何我可以使这项工作?

控制器:

public function viewprod($id) {

$query = $this->db->query("SELECT * from product_table WHERE product_category = '$id'");
$r = $query->result();
return $r;

} 

我的模特:

<html>
    <head>
        <meta charset="UTF-8">
        <meta http-equiv="X-UA-Compatible" content="IE=edge">
        <meta name="viewport" content="width=device-width, initial-scale=1">

        <title>Products</title>

        <!-- Bootstrap -->

        <link href='https://fonts.googleapis.com/css?family=Raleway:200' rel='stylesheet' type='text/css'>

        <?php echo link_tag('css/Bootstrap.min.css')?>
        <?php echo link_tag('css/bootstrap-theme.min.css')?>
        <?php echo link_tag('css/STYLE01.css')?>
        <?php echo link_tag('css/NAVIGATION.css')?>
        <?php echo link_tag('assets/ICON.png')?>
        <style type="text/css">
            ::-webkit-scrollbar-thumb:vertical {
                background-color: #EF426F; /*color of main scrollbar*/
                height: 10px; /*height of scrollbar*/
            }
            ::-webkit-scrollbar {
                height: 0px;
                width: 4px; /*width of the slider*/
                background-color: #FFFFFF; /*color of the slider*/
            }
        </style>
    </head>

    <body>
   <center>

    <image src="<?php echo base_url() . 'assets/LOGO-(WHITE).png' ?> " width="890" height="220">
</center>
<div class="container_products">
    <div class="row">
        <center><br><br><br>

            <?php
            foreach ($products as $alls) {
               $id = $alls->product_id; 
$name = $alls->product_name; $description = $alls->product_description; 
$price = $alls->product_price; 
$picture = $alls->img_name. $alls->ext;
                ?>

       <div class="col-md-4"><a data-toggle="modal" data-target="#myModal">
                        <img class = "bread_img" id = "bread_img_<?php echo $id;?>" src="<?php echo base_url() . 'assets/' . $picture; ?>"  onMouseOut="this.src = '<?php echo base_url() . 'assets/' . $picture; ?>'" width="230" height="192"></a>
                        <input type ="hidden" id = "hidden_name_<?php echo $id;?>" value = "<?php echo $name;?>" >
                        <input type ="hidden" id = "hidden_desc_<?php echo $id;?>" value = "<?php echo $description;?>" >
                    <br><br> <h5 class="names" id="pname" src="<?php echo $name; ?>"><?php echo $name; ?></h5>₱&nbsp;<?php echo $price; ?>
                    <br><br><br><br><br>
                    <div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
                        <div class="modal-dialog modal-l">
                            <div class="modal-content">
                                <div class="modal-header">
                                    <button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
                                    <h4 class="modal-title" id="myModalLabel"> <?php echo $name; ?></h4>
                                </div>
                                <div class="modal-body">
                                    <img  src="<?php echo base_url() . 'assets/' . $picture; ?>" width="500" height="417" id = "modal_img">
                                    <br><br><h6 class="modal-title" id="myModalLabels"> <?php echo $description; ?></h6><br><br>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>

            <?php } ?>   



    </div> 
</div>

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
<script>

$(document.body).on('mouseover','.bread_img',function(){
    window.src_img = $(this).attr('src');   
    id = $(this).attr('id').replace('bread_img_','');
    window.name = $('#hidden_name_'+id).val();
     window.text = $('#hidden_desc_'+id).val();


   $('#myModalLabel').text(name);
   $('#myModalLabels').text(text);
    $(this).attr('src','assets/VIEW.png');


});


$(document.body).on('click','.bread_img', '.names',function(){
    $('#modal_img').attr('src',src_img);


});

</script> 

我的观点:

{{1}}

1 个答案:

答案 0 :(得分:-1)

请尝试此代码 您忘记在控制器功能中加载模型

<profiles>
    <profile>
        <id>Action type restriction</id>
        <activation>
            <property>
                <name>actionType</name>
            </property>
        </activation>
        <properties>
            <restriction.actionType>${actionType}</restriction.actionType>
        </properties>
    </profile>
</profiles>