javascript - Open a fancybox when the hyperlinkfield of gridview is clicked -


i have gridview has hyperlinkfield.when field clicked,i want fancy box open , in fancy box want iframe display page hyperlinkfield has open.

my gridview is:

<asp:gridview id="gridview" runat="server" autogeneratecolumns="false"datakeynames="srnumber"                     onrowdatabound="gridview2_rowdatabound"                      width="100%"                     showfooter="false"                     enableviewstate="false"                     autopostback="true">                     <columns>       <asp:hyperlinkfield datanavigateurlfields="srnumber" datanavigateurlformatstring="newpage.aspx?srnumber={0}" datatextfield="note"  headertext=""/>                    <asp:templatefield headertext="note" sortexpression="note">                    <itemtemplate>                        <a id="ahrefclick" class="forpopup"  href="newpage.aspx?srnumber  <%#eval("srnumber")%>"><%#eval("note")%></a>                    </itemtemplate>                    </asp:templatefield>                     </columns>                 </asp:gridview>

currently,there 2 columns , both same. hyperlinkfiled taking me next page. , waa trying add fancy box logic gridview using template field.

the javascript code is:

 $("#ahrefclick").click(function (e) {          $(".forpopupgrid").fancybox({             'titleposition': 'inside',             'transitionin': 'elastic',             'transitionout': 'none'         });     });

i still not getting pop up.i new fancybox.please help!

thank you!

edit: jquery , fancybox links are:

    <link rel="stylesheet" href="http://code.jquery.com/ui/1.10.3/themes/smoothness/jquery-ui.css" />     <script src="http://code.jquery.com/jquery-1.9.1.js"></script>     <script src="http://code.jquery.com/ui/1.10.3/jquery-ui.js"></script>     <script src="http://fancybox.net/js/fancybox-1.3.4/jquery.fancybox-1.3.4.js" type="text/javascript"></script>      <link href="http://fancybox.net/js/fancybox-1.3.4/jquery.fancybox-1.3.4.css" rel="stylesheet"         type="text/css" />

try targeting class of actual link this

$(".forpopup").fancybox({    'titleposition': 'inside',    'transitionin': 'elastic',    'transitionout': 'none',    'type': 'iframe' //<-- if opening external pages });

... don't need click() method (fancybox triggered once selector bound it)


Comments

Post a Comment

Popular posts from this blog

php - get table cell data from and place a copy in another table -

two-part question: have 2 tables: 1 table items , other table selected items copied when add button clicked. after, when items wanted selected, there 'finished' button post items selected db. i started javascript didn't far @ because jquery seems better suited i'm not familiar it function addto() { var div = document.getelementbyid('fixeddiv','inside'); div.innerhtml = div.innerhtml + 'item added'; } <div id='fixeddiv'> <table align="center" id="tradee"> <th rowspan="2"> other item</th> <?php while($rowi =$item->fetch_assoc()) {?> <tr> <td> <?php echo $rowi['item_name']; ?> </td> <td><?php echo $rowi['item_description'];?></td> </tr> <?php } ?> </table> <br> <table align="center" id="tradetable"
Read more

javascript - Mootools wait with Fx.Morph start -

i trying var effect = new fx.morph(testmorph, { wait/delay 2 seconds before starting. ( fiddle here ) but when try .wait(2000) or .delay(2000) , or .wait(2000, effect) uncaught typeerror: object [object object] has no method 'delay' any ideas how working? code i'm using: var testmorph = document.id('testmorph'); var effect = new fx.morph(testmorph, { transition: 'back:out', duration: 900, link: 'chain' }).start({ 'top': 20, 'opacity': 1 }).start({ 'border-color': '#a80025', 'color': '#a80025' }); effect.delay(2000); you can use combination of chain() , delay() achieve desired effect. new fx.morph(testmorph, { transition: 'back:out', duration: 900, link: 'chain' }).start().chain(function(){ this.start.delay(2000,effect,{ //first }); }).chain(function(){ this.start({ //second }); }); the
Read more

php - Navigate throught databse rows -

i run image hosting site, , ive run problem. want make 2 buttons beside pic "next image" , "prev image". im new php/mysql , haveing troubles. check out got. use id (numbers) find correct row, have image name build next link. how make below query next , prev image names + ids? $query_next = ("select imageid, image_name images image_name = '$image_main' order imageid desc limit 1"); $query_prev = ("select imageid, image_name images image_name = '$image_main' order imageid asc limit 1"); // next $next = mysql_query($query_next); // prev $prev = mysql_query($query_prev); while ($row = mysql_fetch_assoc($next)) { $next = $row['image_name']; } while ($row = mysql_fetch_assoc($prev)) { $prev = $row['image_name']; } the html = > simple stuff. <a href="http://mysite.com/view_image/<?=$next?>">next image</a> <a href="http://mysite.com/view_image/<?=$pr
Read more