ColorBox Style when i click image in grid

QuestionsColorBox Style when i click image in grid
Nooh asked 9 years ago

Hi Abu Ghufran

i need to show other page when i click in 'ViewMore' cell in colorBox mode style or any popup style , How can i do that ?

this is a Part of my code but not work :



<link media="screen" rel="stylesheet" href="../../../colorbox/colorbox.css" />

<script src="../../../colorbox/jquery.min.1.4.4.js"></script>

<script src="../../../colorbox/jquery.colorbox.js"></script>

<link rel="stylesheet" type="text/css" media="screen" href="../../lib/js/jqgrid/css/ui.jqgrid.css" />

<script src="../../lib/js/jquery.min.js" type="text/javascript"></script>
<script src="../../lib/js/jqgrid/js/i18n/grid.locale-ar.js" type="text/javascript"></script>
<script src="../../lib/js/jqgrid/js/jquery.jqGrid.min.js" type="text/javascript"></script>
<script src="../../lib/js/themes/jquery-ui.custom.min.js" type="text/javascript"></script>

<script type="text/javascript">


$(document).ready(function() {

onOpen:function(){ parent.document.getElementById('imain').height=430; },onClosed:function(){parent.document.getElementById('imain').height=430;}
,transition:"fade", width:"85%", height:"85%", iframe:false});

$("a[rel='example3']").colorbox({transition:"none", width:"75%", height:"75%"});
$(".example6").colorbox({iframe:true, innerWidth:470, innerHeight:300});


/// here is my column detail:

$col = array();
$col["title"] = "View More..";
$col["name"] = "button";
$col["width"] = "40";
$col["align"] = "center";
$col["search"] = false;
$col["sortable"] = false;

$col["default"] = "<a class='example6' target='_blank' href='driver_detail.php?x={id}'><input type='button' height=10 value='More..' /></a>";
$cols[] = $col;


it's work for any link out side the grid , but not work in a grid

i have full version , can you help me ?

5 Answers
Abu Ghufran answered 9 years ago

You need to connect the colorbox binding code in loadComplete event of grid.

$grid["loadComplete"] = "function(ids) { do_onload(ids); }";

and in html …

<script type="text/javascript">
function do_onload(){
jQuery(".example6").colorbox({iframe:true, innerWidth:470, innerHeight:300});

Nooh answered 9 years ago

Sorry , not work !! 🙁

can you give me complate example please.

Abu Ghufran answered 9 years ago

emailed you working demo.

Nooh answered 9 years ago

it's work 🙂

when i change your last code :

jQuery(".example6").colorbox({iframe:true, innerWidth:470, innerHeight:300});

to :

$(".example6").colorbox({iframe:true, innerWidth:470, innerHeight:300});

thanks Mr. Abu Ghufran

Nooh answered 9 years ago

Thank's Mr Abu

That was help 🙂

Your Answer

4 + 12 =

Login with your Social Id:

OR, enter

Attach code here and paste link in question.
Attach screenshot here and paste link in question.

How useful was this discussion?

Click on a star to rate it!

Average rating 0 / 5. Vote count: 0

No votes so far! Be the first to rate it.

We are sorry that this post was not useful for you!

Let us improve this post!

Tell us how we can improve this post?