YePix Posted November 15, 2018 Share Posted November 15, 2018 Hello guys and girls, does any of you have experience with thickbox? I want a page opened in a css popup. I tried to link it but without success. Can someone help me ? <?php $option_popup_open = '<a href="'; $option_popup_open .= tep_href_link('product_popup.php', tep_get_all_get_params(array('action')) . 'products_id=' . $list_price['products_id']); $option_popup_open .= '" target="_blank" rel="thickbox" title="' . $list_price['products_name'] . '">' . tep_draw_button(TEXT_LOGIN_INFO, 'fa fa-question', tep_href_link('login.php'), null, null, 'btn-reviews btn-block btn-pls') . '</a>'; echo '<span class="pls_option">' . $option_popup_open . '</span>'; ?> Link to comment Share on other sites More sharing options...
♥raiwa Posted November 15, 2018 Share Posted November 15, 2018 It's easier to use the bootstrap build in modal pop-up: https://www.w3schools.com/bootstrap/bootstrap_modal.asp About Me: http://www.oscommerce.com/forums/user/249059-raiwa/ Need help? How To Get The Help You Need Is your version of osC up to date? You'll find the latest osC community version CE Phoenix here. Public Phoenix Change Log Cheat Set on Google Sheets Link to comment Share on other sites More sharing options...
ArtcoInc Posted November 15, 2018 Share Posted November 15, 2018 @YePix Which version of osCommerce are you using? If you are using the Community Edition, which is based on the Bootstrap platform, could you use the Bootstrap Modal ? M Link to comment Share on other sites More sharing options...
YePix Posted November 15, 2018 Author Share Posted November 15, 2018 Bottstrap EDGE Link to comment Share on other sites More sharing options...
YePix Posted November 15, 2018 Author Share Posted November 15, 2018 it is the product_info.php only with attributes and purchase button which should be opened in the layer. Link to comment Share on other sites More sharing options...
ArtcoInc Posted November 15, 2018 Share Posted November 15, 2018 @YePix Then yes, as both @raiwa and I suggested, the Bootstrap Modal would be a much easier and simpler way to go. M Link to comment Share on other sites More sharing options...
ArtcoInc Posted November 15, 2018 Share Posted November 15, 2018 @YePix 1 minute ago, YePix said: it is the product_info.php only with attributes and purchase button which should be opened in the layer. Can you explain that a little more? Product_info.php already has the attributes and purchase button in it. I'm confused 🤨 M Link to comment Share on other sites More sharing options...
YePix Posted November 15, 2018 Author Share Posted November 15, 2018 Yes. the layer should be opened directly from the product_listing.php via button and not forwarded to the product_info.php. Link to comment Share on other sites More sharing options...
YePix Posted November 15, 2018 Author Share Posted November 15, 2018 <a href='<?php echo tep_href_link('product_popup.php', 'products_id=' . $all_products['products_id']); ?>', target="_blank" onclick="window.open(this.href,this.target,'toolbar=no,location=no,directories=no,status=no,menubar=no,scrollbars=yes,resizable=yes,copyhistory=no,width=420,height=780,screenX=150,screenY=150,top=5,left=650'); return false;"><?php echo tep_draw_button(IMAGE_BUTTON_POPUP, 'plusthick');?></a> that's it. but I do not want a new window but something nice with css layer open Link to comment Share on other sites More sharing options...
ArtcoInc Posted November 15, 2018 Share Posted November 15, 2018 @YePix product_listing.php is used by : specials.php, products_new.php, and advanced_search_results.php ... all to display a list of products that meets the specified requirements. product_listing.php does display the purchase button. If I understand what you want, you want to replace the purchase button with a button that pops open *something* that has the attribute choices and the purchase button, without opening the product_info.php screen. Right? If so ... 1) What if a product doesn't have any attributes? Why pop up anything when your customer could just click on the purchase button? 2) You want "something nice". What about a Modal isn't nice? You could alter the way a Modal is displayed with CSS. M Link to comment Share on other sites More sharing options...
YePix Posted November 15, 2018 Author Share Posted November 15, 2018 just like that. if a product has attributes, it is called up via layer in the extra window. products without attributes normal from the product_info.php Link to comment Share on other sites More sharing options...
♥raiwa Posted November 15, 2018 Share Posted November 15, 2018 You can do this with Bootstrap Modal pop up. - retrieve the options/attributes info for each product, you have the code example in product_info.php - place the options/attributes menus code in the modal - place the add to cart button in the modal. You have the example in product_info.php Place the modal in a simple condition "if product has attributes" else use the standard button/link to product_info.php About Me: http://www.oscommerce.com/forums/user/249059-raiwa/ Need help? How To Get The Help You Need Is your version of osC up to date? You'll find the latest osC community version CE Phoenix here. Public Phoenix Change Log Cheat Set on Google Sheets Link to comment Share on other sites More sharing options...
YePix Posted November 15, 2018 Author Share Posted November 15, 2018 that's the problem. I've been working on it for some time now and just can not keep up. Link to comment Share on other sites More sharing options...
YePix Posted November 15, 2018 Author Share Posted November 15, 2018 from the product_info.php works without problems. but outside I can not get any further. <?php if (SHOW_BUTTON_OPTION_IMAGE == 'true') { $optionsimage = tep_image('images/' . 'prod_button_attribute.png');}?> <?php $transimage = tep_image('images/' . 'pixel_trans.gif', '1', '12');?> <?php if ( (tep_session_is_registered('customer_id') == true) || ($id != $customer_id) ) {?> <div align="center"> <div class="col-sm-6" align="left"><div class="pls_infopanel"> <h4><?php echo TEXT_PRODUCT_OPTIONS . ' ' . $attribute_prod_name; ?></h4> <?php echo $gender_text . ' ' . $addresses['lastname'] . ', ' . TEXT_PRODUCTS_ATTRIBUTE_PRODUCT_INFO ;?><?php echo $pls_separator_nb; ?> </div></div> <span id="myBtn"><div class="CustomButton button1"> <i class="fa fa-calculator"></i> <?php echo TEXT_PRODUCT_OPTIONS_DROPDOWN_POPUP . '<br>' . $product_info['products_name'] . ' ' . TEXT_PRODUCT_OPTIONS_LAST . ' ' . $anrede_text . ' ' . $addresses['lastname'] . $optionsimage;?> </div></span> </div> <?php echo $transimage; ?> <?php }else{?> <div align="center"> <div class="col-sm-6" align="left"><div class="pls_infopanel"> <h4><?php echo TEXT_PRODUCT_OPTIONS . ' ' . $attribute_prod_name; ?></h4> <?php echo TEXT_ATTRIBUTE_GUEST . ' ' . TEXT_PRODUCTS_ATTRIBUTE_PRODUCT_INFO ;?><?php echo $pls_separator_nb; ?> </div></div> <span id="myBtn"><div class="button button1"> <i class="fa fa-calculator"></i> <?php echo TEXT_GUEST_PRODUCT_OPTIONS_DROPDOWN_POPUP . '<br>' . $product_info['products_name'] . ' ' . TEXT_PRODUCT_OPTIONS_LAST . $optionsimage;?> </div></span> </div> <?php echo $transimage; ?> <?php }?> <div id="myModal" class="modal"> <div class="modal-content"> <p> <!------- -------> <h4><?php echo TEXT_PRODUCT_OPTIONS . ' ' . $attribute_prod_name; ?></h4> <?php if ( (tep_session_is_registered('customer_id') == true) || ($id != $customer_id) ) {?> <?php echo $gender_text . ' ' . $addresses['lastname'] . ', ' . TEXT_PRODUCTS_ATTRIBUTE_INFO . $pls_separator_nb ;?> <?php }else{ echo TEXT_ATTRIBUTE_GUEST . ' ' . TEXT_PRODUCTS_ATTRIBUTE_INFO; }?> <p> <div class="pls_panel"> <?php $products_options_name_query = tep_db_query("select distinct popt.products_options_id, popt.products_options_name from " . TABLE_PRODUCTS_OPTIONS . " popt, " . TABLE_PRODUCTS_ATTRIBUTES . " patrib where patrib.products_id='" . (int)$_GET['products_id'] . "' and patrib.options_id = popt.products_options_id and popt.language_id = '" . (int)$languages_id . "' order by popt.products_options_name"); $numberofopt = tep_db_num_rows($products_options_name_query); $opt_count = 0; $products_attributes = array(); while ($products_options_name = tep_db_fetch_array($products_options_name_query)) { array_push($products_attributes,$products_options_name['products_options_id']); $opt_count++; $products_options_array = array(); $products_options_query = tep_db_query("select pov.products_options_values_id, pov.products_options_values_name, pa.options_values_price, pa.price_prefix from " . TABLE_PRODUCTS_ATTRIBUTES . " pa, " . TABLE_PRODUCTS_OPTIONS_VALUES . " pov where pa.products_id = '" . (int)$_GET['products_id'] . "' and pa.options_id = '" . (int)$products_options_name['products_options_id'] . "' and pa.options_values_id = pov.products_options_values_id and pov.language_id = '" . (int)$languages_id . "' order by pa.attribute_sort"); while ($products_options = tep_db_fetch_array($products_options_query)) { $products_options_array[] = array('id' => $products_options['products_options_values_id'], 'text' => $products_options['products_options_values_name']); if ($products_options['options_values_price'] != '0') { $products_options_array[sizeof($products_options_array)-1]['text'] .= ' (' . $products_options['price_prefix'] . $currencies->display_price($products_options['options_values_price'], tep_get_tax_rate($product_info['products_tax_class_id'])) .') '; } } if (is_string($_GET['products_id']) && isset($cart->contents[$_GET['products_id']]['attributes'][$products_options_name['products_options_id']])) { $selected_attribute = $cart->contents[$_GET['products_id']]['attributes'][$products_options_name['products_options_id']]; } else { $selected_attribute = false; } ?> <strong><?php echo $products_options_name['products_options_name'] . ':'; ?></strong><br /> <?php /* Optionen-Bilder start */ ?> <?php $products_options_images_query = tep_db_query("select image, image_name from " . TABLE_PRODUCTS_OPTIONS_IMAGES . " where options_id = '" . (int)$products_options_name['products_options_id'] . "' "); ?> <div id="piGal"> <?php if (tep_db_num_rows($products_options_images_query) > 0) { $options_images_counter = 0; while ($options_images = tep_db_fetch_array($products_options_images_query)) { $options_images_counter++; $option_images_out = '<a href="'; $option_images_out .= tep_href_link('images/' . 'optionsimages/' . $options_images['image'], '', 'NONSSL', false); $option_images_out .= '" target="_blank" rel="colorbox" title="' . $options_images['image'] . '">' . tep_draw_button(TEXT_SHOW_IMAGE . ' ' . $options_images['image_name'] . tep_image('images/' . 'optionsimages/' . $options_images['image'], '8%', '8%'), null, null, 'btn btn-default btn-lg') . '</a>'; echo '<span class="pls_optionimage">' . $option_images_out . '</span>'; } } ?> <script type="text/javascript"> $("#piGal a[rel^='colorbox']").colorbox({ cyclic: true }); </script></div> <?php /* Optionen-Bilder ende */ ?> <?php $comma = ""; $all_option_js = "["; for($t = 1;$t<=$numberofopt; $t++) { $all_option_js .= $comma.'document.getElementById(\'cmbooption_'.$t.'\').value'; $comma = ","; } $all_option_js .= "]"; echo tep_draw_pull_down_menu('id[' . $products_options_name['products_options_id'] . ']', $products_options_array, $selected_attribute,' id="cmbooption_'.$opt_count.'" onChange="getPrice('.$v_new_price.','.$v_products_price.','.(int)$_GET['products_id'].','.$all_option_js.')"'); } ?></div> <!------- -------> </p><?php echo $pls_separator_nb;?> <span class="InfoTextBottom"><?php echo TEXT_PRODUCTS_ATTRIBUTE_PRODUCT_INFO_BOTTOM;?></span><?php echo $pls_separator_nb;?> <span class="close" style="float: left;"><?php echo TEXT_FINISH;?></span><br><br> <br><br> </div> </div> <script> // Get the modal var modal = document.getElementById('myModal'); // Get the button that opens the modal var btn = document.getElementById("myBtn"); // Get the <span> element that closes the modal var span = document.getElementsByClassName("close")[0]; // When the user clicks the button, open the modal btn.onclick = function() { modal.style.display = "block"; } // When the user clicks on <span> (x), close the modal span.onclick = function() { modal.style.display = "none"; } // When the user clicks anywhere outside of the modal, close it window.onclick = function(event) { if (event.target == modal) { modal.style.display = "none"; } } </script> Link to comment Share on other sites More sharing options...
ArtcoInc Posted November 20, 2018 Share Posted November 20, 2018 @YePix If you are still having difficulties with this, you could post a RFQ in the commercial support area of the forum, and have a developer do this for you. M Link to comment Share on other sites More sharing options...
Recommended Posts
Archived
This topic is now archived and is closed to further replies.