geekisthenewsexy Posted December 15, 2010 Share Posted December 15, 2010 hi all. i have here a form which is shown when via toggled div. the entire form/page is also fetched via iframe by the main page. my problem is, when i'm on the main page and i click on a link to fetch the external page that contains the form, and on the fetched page when i click on the link to show the form,it won't show. it doesn't seem to work in FF when i click on a link to show it. it's fine in IE but not in FF..how come?here, please take a look at the entire code of the fetched page that contains the form: <?php include("dbconnection_wmsuipil.php"); ?> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/> <link rel="stylesheet" href="style.css"/> <link rel="stylesheet" href="js/style.css"/> </head> <body> <div id="sy_twrapper"> <div id="formtable">+ <a href="javascript: animatedcollapse.toggle('viewform');">Options</a> | <a href="javascript: window.location.reload();">Refresh</a> <br /> <br /> <div id="viewform" class="faq-ans"> <ul class="tabs"> <li class="active"><a href="#tab_sy_form" title="">Add schoolyear</a></li> <li class=""><a href="#tab_set_sy" title="Set schoolyear and semester">Set</a></li> </ul> <div class="tab_container"> <div style="display: none;" id="tab_sy_form" class="tab_content"> <h2><tr> <td><div align="center" class="note"><b>Note: Please fill in all required fields (*).</b></div></td> </tr></h2> <!--Start of add sy form--> <div class="form"> <form name="form_sy" method="post" action="_admin_adsy.php"> Add Schoolyear <i>*<b>from:</b></i> <input type="text" name="sy_from" size="10"/> <i>*<b>to:</b></i> <input type="text" name="sy_to" size="10"/> <input type="Submit" name="Submit" value=" Add schoolyear "/> <input type="reset" value="Clear fields"/> </form> <!--End--> </div> </div> <div style="display: none;" id="tab_set_sy" class="tab_content"> <!--Start of add sy form--> <iframe src ="_tab_set_sy.php" width="100%"> <p>Sorry for the inconvenience but your browser doesn't support iframes.</p> </iframe> <!--End--> </div> </div> </div> <div id="sy_theader"> <div class="query"> <select id="columns" onchange="sorter.search('query')"></select> <input type="text" id="query" name="query" onkeyup="sorter.search('query')" value="Search" onclick="this.value=''"/> </div> <span class="num_records"> <div>Records <span id="startrecord"></span>-<span id="endrecord"></span> of <span id="totalrecords"></span></div> <div><a href="javascript:sorter.reset()">Reset</a></div> </span> </div> <table cellpadding="0" cellspacing="0" border="0" id="table" class="sy_table"> <thead> <tr> <th><h3>SY_ID</h3></th> <th><h3>Schoolyear</h3></th> <th class="nosort"><h3></h3></th> </tr> </thead> <tbody> <?php $sql=mysql_query("SELECT * FROM admin_sy ORDER BY school_year ASC")or die(mysql_error()); $OutLine = array('id'=>'','school_year'=>''); while($row=mysql_fetch_array($sql)) { $OutLine['id'] = $row['id']; $OutLine['school_year'] = $row['school_year']; $countsy=0; if($row>$countsy) { echo "<td>".implode('<td/>',$OutLine); echo '<td align="center"><a href="#" onClick="window.open(\'_admin_edit_sy.php?id='.$row['id'].'&schoolyear='.$row['school_year'].'\',\'Edit\',\'width=350, height=300, menubar=yes\');return false;"><img src="images/edit.png" title="Edit schoolyear" width="16" height="16" border="0"></a> <a href="_admin_del_sy.php?id='.$row['id'].'&schoolyear='.$row['school_year'].'" title="Delete" onClick="return confirm(\'You are about to delete schoolyear '.$row['school_year'].'! You cannot undo this operation! Delete?\');return false;"><img src="images/del.png" width="16" height="16" border="0"></a></td>'; echo "</tr>"; } else { echo "<tr>"; echo "<td>No schoolyear has been added yet.</td>"; echo "</tr>"; } } ?> </tbody> </table> <div id="tablefooter"> <div id="tablenav"> <div> <img src="images/first.gif" width="16" height="16" title="First Page" onclick="sorter.move(-1,true)" /> <img src="images/previous.gif" width="16" height="16" title="First Page" onclick="sorter.move(-1)" /> <img src="images/next.gif" width="16" height="16" title="First Page" onclick="sorter.move(1)" /> <img src="images/last.gif" width="16" height="16" title="Last Page" onclick="sorter.move(1,true)" /> </div> <div> <select id="pagedropdown"></select> </div> <div> <a href="javascript:sorter.showall()">View all</a> </div> </div> <div id="tablelocation"> <div> <select onchange="sorter.size(this.value)"> <option value="5">5</option> <option value="10" selected="selected">10</option> <option value="20">20</option> <option value="50">50</option> <option value="100">100</option> </select> <span>Entries Per Page</span> </div> <div class="page">Page <span id="currentpage"></span>of <span id="totalpages"></span></div> </div> </div> <p> <center><a href="http://validator.w3.org/check?uri=referer"><img src="http://www.w3.org/Icons/valid-xhtml10" alt="Valid XHTML 1.0 Transitional" height="31" width="88" border="0"/></a></center> </p> </div> </div> <script type="text/javascript" src="script.js"></script> <script type="text/javascript"> var sorter = new TINY.table.sorter('sorter','table',{ headclass:'head', ascclass:'asc', descclass:'desc', evenclass:'evenrow', oddclass:'oddrow', evenselclass:'evenselected', oddselclass:'oddselected', paginate:true, size:5, colddid:'columns', currentid:'currentpage', totalid:'totalpages', startingrecid:'startrecord', endingrecid:'endrecord', totalrecid:'totalrecords', hoverid:'selectedrow', pageddid:'pagedropdown', navid:'tablenav', sortcolumn:1, sortdir:1, init:true }); </script> <script type="text/javascript" src="js/jquery.min.js"></script> <script type="text/javascript" src="js/animatedcollapse.js"></script> <script type="text/javascript">//^--Do not separate these two// animatedcollapse.addDiv('viewform', 'fade=1') animatedcollapse.ontoggle=function($, divobj, state){ //fires each time a DIV is expanded/contracted //$: Access to jQuery //divobj: DOM reference to DIV being expanded/ collapsed. Use "divobj.id" to get its ID //state: "block" or "none", depending on state } animatedcollapse.init() </script> <script type="text/javascript" src="js/jquery.js"></script> <script type="text/javascript"> $(document).ready(function() { //Default Action $(".tab_content").hide(); //Hide all content $("ul.tabs li:first").addClass("active").show(); //Activate first tab $(".tab_content:first").show(); //Show first tab content //On Click Event $("ul.tabs li").click(function() { $("ul.tabs li").removeClass("active"); //Remove any "active" class $(this).addClass("active"); //Add "active" class to selected tab $(".tab_content").hide(); //Hide all tab content var activeTab = $(this).find("a").attr("href"); //Find the rel attribute value to identify the active tab + content $(activeTab).fadeIn(); //Fade in the active content return false; }); }); </script> </body> </html> anyone please help?? Quote Link to comment Share on other sites More sharing options...
Recommended Posts
Join the conversation
You can post now and register later. If you have an account, sign in now to post with your account.