Customize modal popup after "add to cart"

So after you click "add to cart" my client wants a modal pop-up to work like Targets.
http://www.target.com/p/apple-ipod-touch-16gb-mp3-player-4th-generation-with-touch-screen- wi-fi-black-me178ll-a/-/A-14000297#prodSlot=medium_1_1 (click add to cart)
The big thing is to have a VIEW CART button on this modal. I read the page that says how to change the text for the modal pop-up, but not how to insert images or button. Anyone have any ideas?
- Also being able to add "recomended items" for this modal as well

Liam is right. This is some heavy coding. However, if you want to take stab at it, Here are a few starting points.
1) js.cookie
2) your favorite modal code
3) you will have to run a seperate function along with the add to cart function
4) you may have to supress the alert window when adding an item to cart
5) as far as view cart in the window, this would be the easy part.
With a little research and firebug you can figure it out.

Similar Messages

Return to products page after Add to Cart

hi,
is it possible to return the the current catalog products page after the user presses Add to Cart?
thanks in advance.
Frank.

thanks.
had i think about it and what i really need is for the javascript to be refreshed on the Large Product page after clicking Add to Cart.
Frank.
edit: i searched the forum and found this:
<script type="text/javascript">
function AddProductExtras(){
document.location.reload(true);
</script>
and also tried to refresh the js using this:
<script type="text/javascript">
function AddProductExtras(){
javascript:location.reload(true);
</script>
but both get rid of the "items added to cart" message and both reload the whole page which looks and feels rubbish!
i've decided to go to the shop cart using tag_buynow and added a continue shopping button using {module_goback,image}.
it's not the way i wanted the site to work but it's better than having clunky reloads and js not working.

Postcode popup field on shopping cart page.

Hi,
Can the postcode (Australia Post) popup field, where you input your postcode, be a static field not popup on the shopping cart page? It pops up without a button to submit etc at the moment and you have to click your mouse button or press enter to apply your postcode? Or can I add a radio button with Express or Normal Post instead?
Regards,
Ray.

The BADI BBP_CREATE_BE_PO_NEW gets executed after approval as well. It is part of the PO creation process and allows you to modify the PO document before it is finalized.
Hope this helps.

Customize "Continue Shopping" URL in empty cart

How do I customize the "continue shopping" URL. This would be after the shopping cart is emptied.
Also, is there a way to customize the empty shopping cart page? Right now, its just a link on an empty page. For exmaple, go here: http://dataimpressionsebeam.businesscatalyst.com/ add a product to the cart. Then clear the cart.

Upon clearing your cart, you will go to the Shopping Cart empty page (currently there is no template associated) but as what Liam said, You can only edit this via CSS or Javascript. So if you look into the HTML file of the Cart empty page, you will see this:
<div id="catCartDetails"><a href="/test-1" class="cartLink" target="_top">Shopping cart is empty. Continue Shopping.</a></div>
What you can do is create a CSS style for
#catCartDetails a { }
You can also do a Javascript to change the text using the div id="catCartDetails"

Problem with JavaScript code in Page Attributes, modal popup...

Hello all!
I'm encountering a problem with a modal popup I wrote in JavaScript.
h3.
The situation*
A user sees an interactive report with rows that are clickable, so these rows are links. Upon clicking the name of something in a row, some items get a certain value and a modal popup shows on the screen. In this modal popup, there are details regarding that particular row the user has clicked, but the problem_ here is...
The modal popup closes itself only seconds after it has been opened.
This must be because I've probably made a mistake somewhere in my code, but I just can't figure out where... It also appears that when I click on a row link, the popup shows, but the progress bar of my toolbar seems to show a loading bar (as if I refreshed the page).
h3.
My code*
This code is located in the _"Function and Global Variable Declaration"_ part, under the _"JavaScript"_ tab. Code is in the _"Page Attributes"_ of my page 24.
function showhide(x){
$x('REGION1').style.display = ( x == 'REGION1') ? 'block' : 'none';
$x('REGION2').style.display = ( x == 'REGION2') ? 'block' : 'none';
$x('REGION3').style.display = ( x == 'REGION3') ? 'block' : 'none';
$( function(){
$('#ModalForm').dialog(
     modal: true,
     autoOpen: false,
     width: 500,
     height: 350,
     buttons:{ Close: function(){closeForm();}
function openForm()
    $('#ModalForm').dialog('open');
function closeForm()
    $('#ModalForm').dialog('close');
    $(document).ready(function() {
        $('a.temppop').click(function() {
            openForm();
    });This code is located in the _"Header Text"_ part, under the _"Header"_ tab. Code is in the _"Page Attributes"_ of my page 24.
<link rel="stylesheet" href = "http://ajax.googleapis.com/ajax/libs/jqueryui/1.7.2/themes/base/jquery-ui.css" type="text/css" />
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.js"> </script>
<script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.7.2/jquery-ui.js"> </script>This code is located in the _"Column Link"_ part, you get there by going to the _"Report Attributes"_ of the region called _"Template overview"_ on page 24. This region is an interactive report.
Link Text: #FOODTEMPLATENAME#
Link Attributes: class="temppop"
Target: Page in this Application
Page: 24
Item 1, name: P24_MEALID; item 1, value: #MEALTYPEID#
Item 2, name: P24_TEMPLATEID; item 2, value: #FOODTEMPLATEID#So basically I call the function to open the modal popup by the class name. When a link with that class name in it is clicked, it opens the popup.
To remind you of the problem, the modal popup closes seconds after it has been opened. How do I fix this?
Thanks in advance.
(APEX version 4.1.1.00.23)

Come on guys... I really need to know this. :(

Skillbuilders modal popup v2. - popup does not open, can't figure out why..

Hi, I am using APEX v4.1 and have used skillbuilders modal popup v2 successfully in the past. For some reason, it is working on one page (calling page 700 to pull up popup page 360) but not working on another page (calling page 900 to pull up popup page 920).
Both modal popup pages are called from HTML buttons using dynamic actions.
Does anyone have ideas for debugging.
thanks, Karen
ps. when I run the console debug, I receive the following on loading the page. I am completely new to javascript and have no idea what this means....it does not happen on p700, only on page 900
SCRIPT5007: Unable to get value of the property 'length': object is null or undefined
apex_4_1.min.js, line 18 character 88940
function initTabForm(a,b,d,h,g){
var f="#init_row_"+a;
gErrItems=g;
gChangedItems=new Array();
gNumRows=h;
gNewRows=0;
gTabFormRegionID=a;
gTabFormReportID="report_"+a;
gTabForm=apex.jQuery(f).parent();
gTabFormDefaultBG=apex.jQuery(f).children("td").css("background-color");
gTabFormInitRow=b+apex.jQuery(f).html()+d;
apex.jQuery(f).remove();
var c=$x_FormItems($x(gTabFormReportID));
for(var e=0;
e<c.length;
e++){
apex.jQuery(c[e]).attr("autocomplete","off");
if(c[e].name!="X01"){
gTabFormData[e]=c[e].value
else{
gTabFormData[e]="0"
apex.jQuery(".row-selector").click(function(){
highlightRow(gTabFormRegionID,this,apex.jQuery(".row-selector").index(this))
apex.jQuery(document).bind("apexbeforepagesubmit",function(){
apex.jQuery("input[name$=NOSUBMIT]",apex.jQuery("#"+a)[0]).each(function(){
$x_disableItem(this,true)
apex.jQuery(f).remove()
Edited by: KarenH on Sep 28, 2012 10:39 AM

Thanks Pete.
This is a large application, and I have had difficulty posting to apex in the past because the schema is too large and cannot be exported...but at least it gives you an idea.
I am trying to rewrite p900 as it is much too complicated, and thought the modal popup would help in terms of adding new rows and validating, rather than using collections. This code was inherited, so I am a bit confused myself...but hoping to make progress.
The button in question is called TRIPHEADER (add/edit trip header).
https://apex.oracle.com/pls/apex/f?p=4550:1:33303433963:::::
workspace: KEH813
user: guest
pwd: fish
if you have trouble with that, access my development site:
http://warsaw-grouper.accsp.org:7777/pls/safisd_11/f?p=4550:1:0:::::
workspace: SAFIS
user: guest
pwd: fish
you will need to run application 200 and logon as MDFISHER/SHARKBAIT
go to FAVORITES (p900) and press ADD/EDIT TRIP HEADER....nothing happens.
if you go to menu-->FISHER INFO and press ADD/EDIT EMAIL, you will see the modal successfully appear.
thanks again. Karen

TIP: Building Modal Popup Windows

Build Modal Popup Pages
Introduction
The following is based on the 'How To Document' - 'Build Custom Popup Pages'.
This How To will show the developer how to create Modal Popup windows with the ability to pass information back to the parent window.
Example Scenario
The example described in this how to adds a custom modal popup LOV to a form on the SCOTT.EMP table. Clicking the popup LOV link on the form page will popup a Modal LOV page that allows users to search by ENAME, JOB, and SAL. Selecting a value from this LOV page will close that popup LOV page and populate the ENAME, JOB, and SAL fields on the form page with the selected values. Additionally, had the user entered some data into the ENAME, JOB, and/or SAL fields on the form page, that data would be used in the initial search when the popup LOV page is first shown.
Step 1 - Create a simple form page on SCOTT.EMP
To create the form page, simply step through the HTML DB "Form on a Table or View" wizard against the EMP table accepting the defaults. For this example, create the form with a page number of one, and make sure to allow the ename, job, and sal fields to be editable. When the wizard completes, page 1 of the application should have the items P1_ENAME, P1_JOB, and P1_SAL on it as text fields.
Step 2 - Create a popup page with search fields
Next, create a page that's to be used as the popup window: Page 2. Ultimately, this page will have javascript, a report region, and some buttons. For now, though, just create a page 2 with the items P2_ENAME, P2_JOB, and P2_SAL on it as text fields.
Step 3 - Set Modal popup page header requirements
A) Modal windows by default cache the information they display. When creating a popup window which displays different information each time it is called or to allow searching the caching default must be switched off.
Add the following meta-tag to the "HTML Header" field of the page-level attributes screen for page 2 to accomplish this:
<META HTTP-EQUIV="Pragma" CONTENT="no-cache">
B) Modal windows by default open a new window when running any redirect calls. When creating a modal popup which passes back parameters to the parent window. The modal window has to be forced to fire redirect calls within its own window rather than open a new window for the redirect.
Add the following tag to the "HTML Header" field of the page-level attributes screen for page 2 to accomplish this:
<base target="_self">
Step 4 - Add Javascript call to the popup page
Because the popup page should filter its result set based on any values that the user might have entered onto the form page, you need to add a javascript function that would pass those values off. Add the following function to the "HTML Header" field of the page-level attributes screen for page 1 to accomplish this:
<script language="JavaScript" type="text/javascript">
function callMyPopup (formItem1,formItem2,formItem3) {
    var formVal1 = document.getElementById(formItem1).value;
    var formVal2 = document.getElementById(formItem2).value;
    var formVal3 = document.getElementById(formItem3).value;
    var url;
url = 'f?p=&APP_ID.:2:&APP_SESSION.::::P2_ENAME,P2_JOB,P2_SAL:' + formVal1 + ',' + formVal2 + ',' + formVal3 ;
// IE Browsers modal popup window
if (window.showModalDialog) {
    w = showModalDialog(url, window.self,"status:0; scroll:1; resizable:1; dialogWidth:25; dialogHeight:43");
    // w is an array returned from the modal popup containing the passback values
    if (w) {
      document.getElementById("P1_ENAME").value = w[0];
      document.getElementById("P1_JOB").value = w[1];
      document.getElementById("P1_SAL").value = w[2];
      document.getElementById("P1_SAL").focus();
else {
// mozilla based browsers modal popup window
w = open(url,"winLov","Scrollbars=1,resizable=1,width=800,height=600", modal="yes");
if (w.opener == null)
    w.opener = self;
w.focus();
</script>Though you don't need to know how to read javascript for this example, it helps to understand that this function only does one important thing: it opens a modal popup window of page two in our application while passing values to P2_ENAME, P2_JOB, and P2_SAL. It gathers those values to pass from the names of the HTML DB items provided to it. The call to this function will be added in the next step below.
Step 5 - Add a popup link next to the P1_SAL field on the form page
Add a link to the form page that will call the callMyPopup function above and pass it the values it needs. To do so, place the following HTML in the "Post Element Text" field attribute of the P1_SAL item:
<~a href="javascript:callMyPopup('P1_ENAME','P1_JOB','P1_SAL');">Click for LOV<~/a>NB. remove ~ from above when deploying
Step 6 - Add the LOV report to the popup page
The next step is to create a report on the popup page based on the values passed from the form on page one. The tricky part of this report is providing a means for the selected values to be passed back to the form page. This can be achieved by having a column of the report render as a javascript link that would close the popup window and pass the ename, job and sal values for that row back. Start by adding a simple report region to our Modal popup page that uses a query such as:
      select ename, job, sal , 'placeholder' the_link
        from emp
       where ename like '%'||:P2_ENAME||'%'
         and (job = :P2_JOB or :P2_JOB is null)
         and (sal = :P2_SAL or :P2_SAL is null)Note that the last column in this query is just a placeholder. once the region is created, turn that placeholder into a link by doing the following:
Navigate to the Page Definition for page 2
Next to the name of the report region created in step 6, Click Q
Next to the column THE_LINK, click the edit icon
In the "Link Text" field enter the string "select"
In the URL field enter: javascript:passBack('#ENAME#','#JOB#','#SAL#'); Click the "Apply Changes" button
Step 7 - Add the javascript function to the Modal popup page to pass selected values to the (parent) form page.
In the previous step you added a call to a javascript function, passBack. Now add that function to the top of Modal popup page 2. In the same manner as step 4 above, add that passBack function to the page 2 by putting it in the "HTML Header" field of the page-level attributes screen. The function should look similar to the following:
<script language="JavaScript">
   function passBack(passVal1, passVal2, passVal3)
     // IE Browser return the passback values in an array
     if (window.showModalDialog) {
       var retVal = new Array(passVal1, passVal2, passVal3);
       window.returnValue = retVal;
       window.close();
     // Mozilla based browsers right the passback values directly into the parent window
     else {
       opener.document.getElementById("P1_ENAME").value = passVal1;
       opener.document.getElementById("P1_JOB").value = passVal2;
       opener.document.getElementById("P1_SAL").value = passVal3;
       opener.document.getElementById("P1_SAL").focus();
       close();
</script>This function simply sets the values of P1_ENAME, P1_JOB, and P1_SAL with the values of the whatever's stored to the three HTML DB item names passed to it. It also closes the current window and puts the cursor back into the P1_SAL field.
Step 8 - Polishing
The basic functionality of this custom modal popup window has been created in steps 1 though 7. To make its usage a little more friendly, it's advisable to add Cancel and Search buttons to the popup window page. The Search button should just be added as a regular button that branches back to the page 2. Adding this button allows users to re-query for LOV options without having to return to our form page. The Cancel button should be created with an "Action" of "Redirect to URL". The "URL Target" of the button should be javascript:window.close(). As the code suggests, the Cancel button would just close the popup window (with no values returned).
Hope this is of use....

Everything said above is working fine but in Mozilla small popup is coming in top left corner of browser..
so please help me so that it is opened in proper width and height in mozilla.

Modal popup window refresh the parent (calling) window/view

I have a modal popup window that is adding detail records. When this window is closed via the Hide method in my controller I would like to refresh the parent (calling) window/view.
What is the best way to do this?
Regards,
Diane

Here's my process.....
2-windows & 3 views
Window 1 - Selection View and Detail View
Window 2 - Add View (used as a modal popup window called by a button click on the detail view)
Selection View has all the options for obtaining a list of data for the detail view. The detail view has an Add button. Component controller has the hide method and access to the other components that do the update/query methods. On the detail view the user can click Add and a popup modal window shows. User enters data and clicks either the add or cancel button. The Detail view needs to refresh to show the additional data that has been added by the modal window. There are calcuated values in the detail view from a supply function. This function is not running and the values are not changed.
What should be put in the hide method that will cause the detail view to obtain new data and supply the calculated values? If I was using the Add view as part of the same window as the detail/selection views I'd just put in a navigation link between the detail and add views and fire the plug. I like the idea of the popup window so I'd like to get this to work.
I put the wdContext.initialize() in the hide method - which yes - caused the detail view to run - however the context lost all the key values so I received a data not found. I then tried to initialize those nodes that did not contain the key values but the detail view did not display new values.
Thanks for any ideas.....Diane
Edited by: Diane Fuller on Jan 8, 2009 6:48 AM

Showing non-modal popup in overlay of browser.xul - on Windows

Hi. I've got a custom Firefox add-on in plain Javascript. It to overlays Firefox's browser.xul (via chrome.manifest) by an XUL file, where I would like to show a non-modal popup (or some kind of non-intrusive notification).
I've tried following three options from https://developer.mozilla.org/en-US/Add-ons/Code_snippets/Alerts_and_Notifications:
1.
Components.classes['@mozilla.org/alerts-service;1'].
getService(Components.interfaces.nsIAlertsService).
showAlertNotification(null, 'Some title', 'Some message', false, '', null);
2.
var win = Components.classes['@mozilla.org/embedcomp/window-watcher;1'].
getService(Components.interfaces.nsIWindowWatcher).
openWindow(null, 'chrome://global/content/alerts/alert.xul',
'_blank', 'chrome,titlebar=no,popup=yes', null);
win.arguments = [null, 'Some title', 'Some message', false, ''];
3.
var message = 'Another pop-up blocked';
var nb = gBrowser.getNotificationBox();
var n = nb.getNotificationWithValue('popup-blocked');
if(n) {
n.label = message;
} else {
var buttons = [{
label: 'Button',
accessKey: 'B',
popup: 'blockedPopupOptions',
callback: null
Neither of them works on Windows. The first two work on Linux (Fedora 20 x64). Neither of them generates any error either.
Please, suggest how/where to do that, or how to 'schedule it' (as an even handler to a system event, I suppose) from my overlay of browser.xul.

I think you would have a better chance of getting comments from experienced add-on developers on one of these sites:
* http://forums.addons.mozilla.org/
* http://forums.mozillazine.org/viewforum.php?f=19

How to use Sharepoint Modal Popup loader in Sharepoint-Hosted Apps

Hi,
I have a requirement to use a modal popup as loader in SharePoint-Hosted Apps. I have used this like following-
SP.UI.ModalDialog.showWaitScreenWithNoClose(
'Please Wait',
'while we retrieve...',
'400',
'600');
But it does not work if we have "SP.Js" and "SP.runtime.js" included in the page. If we remove the mentioned script, then only modal works, but other functionality related to "Sp.Js" does not work.
Please let me know if there is any solution for the problem.
Thanks in Advance.

Hi,
Chk out this link also
http://stackoverflow.com/questions/4015159/using-jquery-to-display-a-modal-please-wait-dialog-box-message
http://bernado-nguyen-hoan.com/2012/04/23/how-to-close-sharepoint-modal-wait-screen-after-postback-when-page-is-in-dialog-mode/
http://sharepoint.stackexchange.com/questions/24391/how-do-i-show-a-loading-div-when-opening-a-modal-dialog-from-a-customaction
http://blog.collabware.com/2012/10/30/tips-tricks-sharepoint-2010-modal-dialogs/
Thanks
Jaison A
http://infomoss.blogspot.in

Modal popup with lightbox effect on page load

Hi friends,
I was looking for help for making a windows modal popup with reads a url from xml file and load it into windows modal popup in the centre of the screen on page load. The requirement was also that it will dim the rest of the page. After searching at several places I got hint at:
http://forums.adobe.com/message/746503
Now there are two issues that background page is not getting dim and if any one can help me in telling how to load flash modal popup on pageload. I dont want it to be annoyed so just want to load popup once a session of once a day only on first page, I am trying cookies but I dont know why I it is not reading cookies in production environment. There are lot of examples available in javascript and silverlight but I want in flash.
Any help shall be highly appreciated.

Thanks. Unfortunately I'm not sure the code will apply to my
situation... I'm actually not using a Spry dataset in any way, just
some Spry effects to enhance my own markup (which comes from a PHP
page but is static as far as the document is concerned.)
If I put the Spry effect in the body onload handler, the
element appears for a second as the page loads, then disappears
suddenly as the Spry fade in effect kicks in bringing it from 0 to
100.
Another related question, I would like the Spry effect to to
fade in with some values ending at the values as set by my CSS
class... is it possible to have it do so? In other words fade from
0 to current value? I know there are some ways to retrieve default
styling of an element but figure Spry might have something built
in?

Modal Popups in Firefox

Hi,
I've found this thread for modal popups: TIP: Building Modal Popup Windows
I've the following javascript code:
function newCategory()
     var url = 'f?p=' + html_GetElement('pFlowId').value + ':12:' +
                            html_GetElement('pInstance').value + ':MASTERDATA_REGION:CATEGORY';
     if (window.showModalDialog)
         showModalDialog(url, window.self,"dialogWidth:50; dialogHeight:20");
          show_Tab1();
     else
             w = window.open(url, "","width=500,height=200", modal="yes");
          w.focus();
          show_Tab1();
}It's working fine in IE, so it opens the popup and when the popup is closed it executes the show_Tab1()-function. In FF it's ignoring the 'modal' attribute and executes show_Tab1(), immedialtely after opening the popup.
I don't have any return values, I only want to have executed the function show_Tab1(), when the popup is closed. Can this be realized somehow?
Thanks
chrissy

Hi Vikas,
When running my application in IE, and opening the opoup with showModalDialog, I can't interact with the main window until I close the popup.
...what is the rationale behind this?
i.e. why would you like to stop execution until the
popup is closed?I'm having a region in my page, that's pulled by AJAX, because I don't like the refresh of the whole page, when I only want to change the view. I think you know this, I've the code from Carl (http://htmldb.oracle.com/pls/otn/f?p=11933:48).
In this page I've a button, which opens the popup, where the user can create new entries for the report. Closing the popup with a given button, will insert the provided data into the table. After this my report on the main page should be updated (that's what my function show_Tab1() is doing). Because of this I'd like to stay the popup at the top until the user added the data or canceled it and stop execution of code, because this is the only why I can see to start my function show_Tab1(), when popup is closed (please see code provided before).
chrissy

SharePoint Modal Popup

Hi..
How to create a SharePoint Modal Popup window and when we select some value in modal popup that value should be redirected to parent form..
Ravindranath

In the option dialogReturnValueCallback you can define a function that will be executed after the dialog was closed. By now you create a delegate pointing to CloseCallback3 but this is not defined in your code.
If you call SP.UI.ModalDialog.RefreshPage in this callback method the page gets refreshed after the dialog was closed with OK.
function OpenCustomDialog(dialogUrl, dialogWidth, dialogHeight, dialogTitle, dialogAllowMaximize, dialogShowClose) {
var options =
url: dialogUrl,
allowMaximize: dialogAllowMaximize,
showClose: dialogShowClose,
width: dialogWidth,
height: dialogHeight,
title: dialogTitle,
dialogReturnValueCallback: function(dialogResult)
SP.UI.ModalDialog.RefreshPage(dialogResult)
Adnan Amin MCT, SharePoint Architect | If you find this post useful kindly please mark it as an answer :)

Safari Browser - Can't Add to Cart

My safari browser will not let me select add to cart on the best buy page. It doesn't even load on any of the besy buy pages but will on everything else like Amazon, etc. It loads in Google Chrome and other browsers. Any reason why it's not working? Any one else have this issue?

Use a different browser. Turn off the popup blocker you are using. Call BB and ask why no Add to Cart button is showing. Maybe they ran out of them and the sale is over?

Automatic Page Refresh With Modal Popup

Hi,
I'm sure there is a simple solution to this and I can see there are several pages discussing something similar but I’m struggling.
I have a page that has a modal popup, the base page needs to be automatically refresh every ten seconds unless the modal page is open?
Any ideas on what would be the simplest way to achieve this.
Thanks in advance.

Hi,
I'm getting there, I can set a value (table or page variable) when the modal page is open and closed but i'm having trouble with the page refresh.
Current I have a region with the following code
<META HTTP-EQUIV="REFRESH" CONTENT="10">
It has a conditional display based on a page variable, the problem is the the page still refreshes one more time after the value has been set which closes the modal. What I need is a simple way of checking a page variable and if that is set to Y then refresh the page otherwise dont refresh.
Apologies in advance if this has been covered before but i've looked and not found anything suitable that I can follow.

Customize modal popup after "add to cart"

Similar Messages

Maybe you are looking for