2017-04-10 8 views
0

ビューページでスライダを正常に実装しましたが、jqueryレスポンスでスライダが動いていないとわかりません。実際には、データベースから来ているjqueryレスポンスにデータをロードしました。jqueryレスポンスでスライダを表示できません

<div class="modal fade bs-example-modal-lg" tabindex="-1" role="dialog" aria-labelledby="myLargeModalLabel" aria-hidden="true"> 
    <div class="modal-dialog modal-lg" style="width:640px;"> 
    <div class="modal-content"> 
     <div id="carousel-example-generic" class="carousel slide" data-ride="carousel"> 



    <!-- Wrapper for slides --> 
    <div class="carousel-inner" id="slider"> 
    <?php $count=1; if($inspection_images !=''){ foreach($inspection_images as $img){?> 
    <div class="item <?php if($count==1){ echo 'active'; } ?>"> 
    <img class="img-responsive" src="<?php echo base_url();?>uploads/inspection/<?php echo $img->attachment_saved_name; ?>" alt="..."> 
     <div class="carousel-caption"> 
     <?php echo $img->attachment_name.' ('.$img->column_name.')'; ?> 
     </div> 
    </div> 
    <?php $count++; }} ?> 
    </div> 

    <!-- Controls --> 
    <a class="left carousel-control" href="#carousel-example-generic" role="button" data-slide="prev"> 
    <span class="glyphicon glyphicon-chevron-left"></span> 
    </a> 
    <a class="right carousel-control" href="#carousel-example-generic" role="button" data-slide="next"> 
    <span class="glyphicon glyphicon-chevron-right"></span> 
    </a> 
</div> 
    </div> 
    </div> 
</div> 

正常にこの生成します: enter image description here

、今私はスライダーでそれらのデータを設定するためにjqueryのREPONSEで同じことをしたい。ここ

は、スライダのための私の成功のビューページであります:

function galleryselectetemplate() 
{ 
    var c = $('#gallery option:selected').val(); 
    var gt = $('#templategallery option:selected').val(); 
// alert(gt); 
    $.ajax({ 
     cache: false, 
     dataType:'json', 
     type: 'POST', 
     url: site_url+'Gallery/inspection_gallery', 
     data: {client:c,gt:gt}, 
     success: function(resp) 
     { 
     // alert((JSON.stringify(resp))); 
      // var count=1; 
      var json_arr = JSON.parse(JSON.stringify(resp)); 
      <?php $count=1; ?> 
      if(json_arr != null) 
      { 
       <?php $count=1; ?> 
       $('#img').empty(); 
       for(var ind = 0;ind < json_arr.length;ind++) 
       { 
       /* $('#img').append('<a href=""><img src="<?php echo base_url(); ?>uploads/inspection/'+json_arr[ind]['attachment_saved_name']+'" class="img-responsive"></img></a>');*///shows fit smaller image 

        $('#img').append('<a onclick="viewImage(\''+json_arr[ind]['attachment_saved_name']+'\')" title="'+json_arr[ind]['attachment_original_name']+'" href="javascript:;"><img src="<?php echo base_url(); ?>uploads/inspection/'+json_arr[ind]['attachment_saved_name']+'" width="300" height="200" class="img-responsive"></img></a>');//showing very larger img and i dont know y it is not getting in viewImage? 

      /*  $('#slider').append('<img class="img-responsive " src="<?php echo base_url();?>uploads/inspection/'+json_arr[ind]['attachment_saved_name']+'" alt="..."></img>');*/ 

        $('#slider').html('<div class="item <?php if($count==1){ echo 'active'; } ?>"><img class="img-responsive " src="<?php echo base_url();?>uploads/inspection/'+json_arr[ind]['attachment_saved_name']+'" alt="..."></img></div>'); 

        <?php $count++; ?> 

       } 
      } 
     } 
     }); 
// var ins= $("#inspectionid").val(); 
// alert(c); 
// alert(gt); 
// alert(ins); 
} 

が、私はこれだけを取得:

enter image description here

スライダーは動いていません。私のjqueryのどこに間違っているの?あなたはスライダーのdivにHTMLをバインドするとき

答えて

0

Ajaxの応答の後、あなたは同じ結果が起こっては、Yを知らないNT $('.carousel').carousel();

function galleryselectetemplate() 
{ 
    var c = $('#gallery option:selected').val(); 
    var gt = $('#templategallery option:selected').val(); 
// alert(gt); 
    $.ajax({ 
     cache: false, 
     dataType:'json', 
     type: 'POST', 
     url: site_url+'Gallery/inspection_gallery', 
     data: {client:c,gt:gt}, 
     success: function(resp) 
     { 
     // alert((JSON.stringify(resp))); 
      // var count=1; 
      var json_arr = JSON.parse(JSON.stringify(resp)); 
      <?php $count=1; ?> 
      if(json_arr != null) 
      { 
       <?php $count=1; ?> 
       $('#img').empty(); 
       for(var ind = 0;ind < json_arr.length;ind++) 
       { 
       /* $('#img').append('<a href=""><img src="<?php echo base_url(); ?>uploads/inspection/'+json_arr[ind]['attachment_saved_name']+'" class="img-responsive"></img></a>');*///shows fit smaller image 

        $('#img').append('<a onclick="viewImage(\''+json_arr[ind]['attachment_saved_name']+'\')" title="'+json_arr[ind]['attachment_original_name']+'" href="javascript:;"><img src="<?php echo base_url(); ?>uploads/inspection/'+json_arr[ind]['attachment_saved_name']+'" width="300" height="200" class="img-responsive"></img></a>');//showing very larger img and i dont know y it is not getting in viewImage? 

      /*  $('#slider').append('<img class="img-responsive " src="<?php echo base_url();?>uploads/inspection/'+json_arr[ind]['attachment_saved_name']+'" alt="..."></img>');*/ 

        $('#slider').html('<div class="item <?php if($count==1){ echo 'active'; } ?>"><img class="img-responsive " src="<?php echo base_url();?>uploads/inspection/'+json_arr[ind]['attachment_saved_name']+'" alt="..."></img></div>'); 

        <?php $count++; ?> 

       } 
      } 

      $('.carousel').carousel(); 

     } 
     }); 
// var ins= $("#inspectionid").val(); 
// alert(c); 
// alert(gt); 
// alert(ins); 
} 
+0

を呼び出す必要がありますか? – user3162878

関連する問題