php echo mysql into javascript tabs will not appear -
please can me problem appreciated.
when use code outside div tabs works fine, when inside it, fails appear:
echo '<div id="product-desc">'.$obj->product_desc.'</div>'; here script page:
<?php session_start(); include_once("config.php"); ?> <!doctype html> <html> <head> <meta charset="utf-8"> <link href="style.css" rel="stylesheet" type="text/css"> <link href="style/normalise.css" rel="stylesheet" type="text/css"> <link href="style/style.css" rel="stylesheet" type="text/css"> </head> <body> <div id="page-wrapper"> <div id="product-page"> <div id="wrapper"> <?php $current_url = base64_encode($url="http://".$_server['http_host'].$_server['request_uri']); $results = $mysqli->query("select * products product_code='nikon002'"); if ($results) { $obj = $results->fetch_object(); echo '<div id="products-wrapper">'; echo '<form method="post" action="cart_update.php">'; echo '<div id="product-image"><img src="images/new folder/'.$obj->product_thumb_name.'"></div>'; echo '<div id="product-name"><h3>pc '.$obj->product_name.'</h3></div>'; echo '<div id="product-price">'.$currency.$obj->price.'</div>'; echo '<div id="product-buybttn"><br><button class="add_to_cart">buy</button></div>'; echo '<div id="tabcontainer">'; echo '<div id="tabs">'; echo '<ul>'; echo '<li id="tabheader_1">summary</li>'; echo '<li id="tabheader_2">details</li>'; echo '<li id="tabheader_3">specifications</li>'; echo '</ul>'; echo '</div>'; echo '<div id="tabscontent">'; echo '<div class="tabpage" id="tabpage_1">'; echo '<h2>summary</h2>'; echo '<p>im summary</p>'; echo '<div id="product-desc">'.$obj->product_desc.'</div>'; echo '<p>im summary</p>'; echo '</div>'; echo '<div class="tabpage" id="tabpage_2">'; echo ' <h2>details</h2>'; echo '<p>adfasfasfsafa</p>'; echo '<div id="product-desc">'.$obj->product_desc.'</div>'; echo '</div>'; echo '<div class="tabpage" id="tabpage_3">'; echo ' <h2>specifications</h2>'; echo '<div id="product-desc">'.$obj->product_desc.'</div>'; echo '</div>'; echo ' </div>'; echo ' </div>'; echo ' </div>'; echo ' </div>'; echo '<script src="tabs_old.js"></script>'; echo '</div>'; echo '</div>'; } ?> </div> and here javascript code:
window.onload=function() { // tab container var container = document.getelementbyid("tabcontainer"); var tabcon = document.getelementbyid("tabscontent"); //alert(tabcon.childnodes.item(1)); // set current tab var navitem = document.getelementbyid("tabheader_1"); //store tab on var ident = navitem.id.split("_")[1]; //alert(ident); navitem.parentnode.setattribute("data-current",ident); //set current tab class of activetabheader navitem.setattribute("class","tabactiveheader"); //hide 2 tab contents don't need var pages = tabcon.getelementsbytagname("div"); (var = 1; < pages.length; i++) { pages.item(i).style.display="none"; }; //this adds click event tabs var tabs = container.getelementsbytagname("li"); (var = 0; < tabs.length; i++) { tabs[i].onclick=displaypage; } } // on click of 1 of tabs function displaypage() { var current = this.parentnode.getattribute("data-current"); //remove class of activetabheader , hide old contents document.getelementbyid("tabheader_" + current).removeattribute("class"); document.getelementbyid("tabpage_" + current).style.display="none"; var ident = this.id.split("_")[1]; //add class of activetabheader new active tab , show contents this.setattribute("class","tabactiveheader"); document.getelementbyid("tabpage_" + ident).style.display="block"; this.parentnode.setattribute("data-current",ident); } </body> </html> i'm sure solution must pretty simple can't figure out programming novice!
thanks in advance!
Comments
Post a Comment