Showing and hiding dropdowns on product page, based on selected values

Hello.
I would like my product page to show different subsequent dropdowns based on individual dropdown values.
I've managed to achieve this via JavaScript, but I do not like how it works.
As far as I can tell, there is no proper identifier for each individual dropdown to determine which one it is, so all I can do at the moment is to rely on their order in the DOM, which is bad and makes it difficult for me to create a solution that would work for all products.
For instance, if the following is a single attribute:
<div class="catProductAttributeGroup" style="display: none;"><div class="catProdAttributeTitle">Metallic Foiling</div><div class="catProdAttributeItem"><select><option value="">-- Please select --</option><option value="6051720">Not required </option><option value="6051721">Foil ONE side + £45</option><option value="6051722">Foiling BOTH sides + £75</option></select></div></div>
I would like the outer-most div to have some sort of html attribute that holds the product attribute id. Something like, data-attribute-id="XXXXXXX". Is that possible?
Here's what I have up to this point:
I use {tag_attributes_json}, {tag_product_json} and {tag_currency} to get these values into javascript on page load, so I can use them later.
Then, I hook to change events of the drodpowns I have and then toggle their visibility based on which ones are selected. I rely on the jequery ':eq(n)' selector to achieve this, which I do not like. Is there an option for the {tag_attributes} helper which would make it add some extra information (such as attribute ID on the dropdown) on the generated HTML?
All of this works initially, but If I then 'Add to cart', the product element get's ajax-reloaded and the events are suddenly unhooked, so it doesn't work anymore. For that one, there are two options:
1. I could hook to an event that triggers once the product has been added to cart and the page is ready again. Is there such an event?
2. I could implement my own add to cart using bcInternals.shop.addToCart. I tried doing this, but I have two problems with it.
a. addToCart seems to add my selection twice, for some reason. Any ideas what I might be doing wrong?
b. the cart info in  the top right corner doesn't refresh. it seems it tries to refresh, but there's some sort of access error in the script. This part is not yet fully added to the page, but there's a function that would do the adding to cart at the bottom of the bigger script block. Am I using the built in addToCart function incorrectly?
This is the page I have the partially implemented functionality added on:
Matt Laminated Business Cards
The scripts are currently embedded inside the HTML. Once I have it properly implemented, I'd like to extract it into a separate file. Search for "$productAttributesElement" to find the block with the functionality and for "productInfo" to find the part where I store the product data with the _json tags.

Hi,
No worries, Didnt know if you solved or the answer wasnt helpfull
You need to trigger you script within the product details template layout, or you could add a listener to the product container and trigger the script if any changes are detected.
Regards

Similar Messages

  • Passing DB values to the textbox based on Select Value item

    Hi,
    I am very much new to the Oracle APEX. In my project, I have a requirement wherein I have to pass the different values to the corresponding textboxes on a different page based on the value I select from the "Select Value" item.
    I have tried using calling On-Demand Processes, but couldn't get the desired result.
    Please suggest!

    Hi 796444 ,
    Welcome to the forum. It will be good if you familiarize yourself with the forum ettiquittes. Also, when posting always state the following:
    a. Apex version
    b. DB version
    c. Web server ; EPG, apexlistener, etc
    d. Provide adequate details for others to understand your problem / what you are trying to achieve.
    e. Any code snippets you post should be enclosed in a pair of tags
    If your current problem is that the you are *calling* Page 2 from Page 1, and while doing so you want the value of P1_ITEM1 to be passed and set in p2_ITEM1 then
    a. Edit the branch
    b. In Action in Set these items write P2_ITEM1
    c. In With these values write &P1_ITEM1. (do not miss the dot at the end)
    It looks good if you use a better handle than 796444 :-)
    Regards,                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                       

  • I have chosen a persona, but when I start up Firefox, Mozilla start page with Google shows, and persona is just barely visible only in the toolbar area. How do I get the persona to show, and not Google start-up page?

    I checked out the Mozilla Personas, saw one I liked, and added on. When I start Firefox, the Mozilla start-up page shows as usual with Google on it. The Persona I chose barely shows, and only in the Toolbars area at the top of the screen. Can I modify the start-up page to not show Google, and access Google another way, so that my Persona will show on the whole start-up page?
    == This happened ==
    Every time Firefox opened
    == I added-on Persona

    As you can see from the [http://support.mozilla.com/en-US/kb/Using+themes+with+Firefox using themes with Firefox] article, personas are "''lightweight themes that can change the color scheme and background image of the Firefox toolbars''" and they wouldn't change the webpages.
    If you don't like seeing Google as your home page you might want to look at [http://support.mozilla.com/en-US/kb/How+to+set+the+home+page how to set the home page] and change it.
    Finally Firefox 3.5.x will be maintained with security and stability updates until August 2010, so you might want to [http://support.mozilla.com/en-US/kb/Updating+Firefox update to a newer version].

  • How to populate table of values based on selected value of dropdown list

    Hi
    I have an urgent requirement.
    Whenever I select a value in Dropdownlist, Based on the selected value I need to display serveral values in tabular form.
    I have created a dynamic LOV and created the actionListener
    I have created a table by dragging the ViewObject and i have set the partialTrigger attribute value to the LOV Id.
    Now My doubt is What should I return in the actionListener method
    Thanks

    Hi,
    So get the value what i tried is ,bind the list item of the select one choice ,
    and then i used the method something like this
    UISelectItems see=getSelectItems1();
    System.out.println("Selected Value"+ see.getValue());
    but it returns me something like this
    Selected Value[javax.faces.model.SelectItem@b20090, javax.faces.model.SelectItem@431753]
    Don't know what are those ,hoe can i get the display value.Please help.
    Thanks

  • Select list coloured based on selected value

    Hello,
    Could anyone please tell me if it is possible to display a LOV with a background colour based on the selected value ?
    In fact , I have a report with many select lists whose value can be Y,N,N/A and I would like that the corresponding LOVs have the background colour set according to the value .
    Thanks in advance,
    Andreea
    Edited by: user12064977 on 20-Oct-2009 02:15

    Andreea,
    Lets assume your select list item name is P1_SL and return values as follows
    Display -  Return
    N/A     -  NA
    YES     -   Y
    NO      -   NEdit you page and put JS code similar to following in footer section
    <script>
    slval = $v("P1_SL");
    sl = $x("P1_SL");
    if(slval=="Y")
    sl.style.backgroundColor="#FFCC80";
    else if (slval=="N")
    sl.style.backgroundColor="#CCAA80";
    else
    sl.style.backgroundColor="#CCCC80";
    </script>So background color will be set on page load.
    Now edit your page and put JS code similar to following in HTML Header section
    <script>
    function setColor(this1)
    slval = this1.value;
    if(slval=="Y")
    this1.style.backgroundColor="#FFCC80";
    else if (slval=="N")
    this1.style.backgroundColor="#FFAA80";
    else
    this1.style.backgroundColor="#CCCC80";
    </script>Edit your select list item and set following for 'HTML Form Element Attributes'
    onChange="javascript:setColor(this);"So the select list color will be set accordingly 'onChange'.
    Cheers,
    Hari

  • Autosuggest based on Select Value

    I'm in the process of reworking a pre-existing form and
    related queries that
    allows a person to search for my agency's services based on
    City, County or
    ZIP Code.
    We have two fields: locationtofind (text field) and
    locationtype (select
    containing the above values, with City being the default)
    What I'd like to do is populate the autosuggest with values
    based on the
    value of the currently selected locationtype. How do I pass
    or bind the
    currentvalue of locationtype to the autosuggest call to a
    CFC?
    Texas has a huge number of place names in addition to its 254
    counties, so a
    dynamic search using a cfc as you type query is a must.
    Any examples would be quite helpful.
    Thanks in advance,
    Michael Brown
    Texas Department of Aging and Disability Services

    I'm in the process of reworking a pre-existing form and
    related queries that
    allows a person to search for my agency's services based on
    City, County or
    ZIP Code.
    We have two fields: locationtofind (text field) and
    locationtype (select
    containing the above values, with City being the default)
    What I'd like to do is populate the autosuggest with values
    based on the
    value of the currently selected locationtype. How do I pass
    or bind the
    currentvalue of locationtype to the autosuggest call to a
    CFC?
    Texas has a huge number of place names in addition to its 254
    counties, so a
    dynamic search using a cfc as you type query is a must.
    Any examples would be quite helpful.
    Thanks in advance,
    Michael Brown
    Texas Department of Aging and Disability Services

  • Showing and Hiding Columns in an UIX page

    How To Dynamically Hide and Show Columns in a UIX Page

    The following will display or hide a column Address depending on the value of sessionScope.showAddress:
    <column rendered="${sessionScope.showAddress == null ? 'false' : sessionScope.showAddress}">
    If you have access to MetaLink, I would advise you to have a look to Note 306887.1: How To Dynamically Hide and Show Columns in a UIX Page
    Regards,
    Didier

  • PLD showing and hiding fields

    Good Day,
    A client makes use of an add-on which pulls an item description (different to that of the item master description) - JobNote
    What I need to do in the pld is have the JobNote field and the normal item description field overlapping on the line.
    When printed, the pld must show the field that has a value in it (i.e. not blank)
    For example, if there is a jobnote description it will hide the normal item description and show the JobNote.
    If there is no JobNote description, it must show the normal item description and hide the JobNote field.
    Whats the easiest way to accomplish this in pld.
    Thanks
    Best Regards
    Dario

    Hi,
    You can overlap both item master description and JobNote field, when other field is blank or null  then
    not empty field will display just make sure in the Properties Color Tab, all
    uncheck except for the Background.
    OR
    You can use a manual If statement in PLD.
    Please refer to this link for the sample
    [Problem in PLD|Problem in PLD]
    Thanks.
    Clint

  • Shortcut for showing and hiding the dock

    Here is a quick question - is there a keyboard shortcut to quickly hide and show the Dock? This helps when using some applications that force the window beyond the reach of the Dock and place their OK and Cancel buttons beyond that region, forcing me to hide the Dock in System Preferences.

    Option-Command-D
    Also see Mac OS X keyboard shortcuts.
    You can also configure the Dock to autohide in Dock preferences.

  • Website has many drop-down menus. Once selected, user updates the page based on selections. Unable to select more than 1 option at a time. Is there a setting to fix this? I was able to do before, but after reinstall, it has stopped.

    This occurs on any website with active menu drop-downs. I am able to select the 1st drop-down, but must then load the page and do the next drop-down. I used to be able to make every selection at once and then reload the page to reflect all of those options.

    I have taken it back to the Apple store genius bar, but they say they don't see anything wrong. Well unless you use it all day and experience the problems when they happen, you wont see anything wrong. But there are lots wrong with it. But this would be the same store as I purchased the phone. And they backed up my old Iphone 4, but were not able to get anything to load back onto my new phone. So, I lost pretty much everything. But over time, some of my contacts have started showing up, although i am still missing over 800 of them.

  • Search Page based on select Query...

    I want to create a simple search page base on a select query.
    The select query will not be based on Table.Its based on functions.
    I have created a view object like this
    select xx_test_accruals(:p_date) ACCRUAL,:p_date DT from dual
    I have created a Search page
    In Main Page layout region i have added a query region.In that Query region i have created a result based search Table.
    When i run the page is opening with field
    Dt
    When i enter date and click go i am getting error like this..
    oracle.apps.fnd.framework.OAException: oracle.jbo.SQLStmtException: JBO-27122: SQL error during statement preparation. Statement: SELECT * FROM (select xx_test_accruals(:p_date) ACCRUAL,:p_date DT from dual) QRSLT WHERE (( UPPER(DT) like :1 AND (DT like :2 OR DT like :3 OR DT like :4 OR DT like :5)))
    Please help
    Edited by: [email protected] on Oct 4, 2009 2:04 PM

    Hi,
    i tried it on my machine....there's a little change on the approach.
    See we have a View Object : XxAccrualsSummaryVO
    the query is
    select xx_test_accruals(to_date(:1,'YYYY-MM-DD')) ACCRUAL,to_date(:2,'YYYY-MM-DD') DT from dual
    Create a Property View Object : say DateTestPVO and in that create a Transient Attribute of DATE type say InputDate. How to create property View Object(read in dev guide).
    Bind the date text input to DateTestPVO and InputDate Attribute.
    Now as the page loads in process request initialise the PVO not XxAccrualsSummaryVO.
    public void initialisePVO()
    OAViewObject vo = (OAViewObject)getDatePVO1();
    if (!vo.isPreparedForExecution())
    vo.setMaxFetchSize(0);
    Row row = vo.createRow();
    vo.insertRow(row);
    row.setNewRowState(Row.STATUS_INITIALIZED);
    And when the Go button is pressed then grab the date being entered and set the where clause of XxAccrualsSummaryVO.
    if(pageContext.getParameter("Go")!=null)
    //Get the value entered by user in date field.
    OAMessageDateFieldBean dateField = (OAMessageDateFieldBean)webBean.findIndexedChildRecursive("text");
    String datetest = (String)dateField.getValue(pageContext).toString();
    //Now set the where clause parameters of VO.
    OAViewObject vodate = (OAViewObject)am.findViewObject("invoicetestVO1");
    vodate.setWhereClauseParams(null);
    vodate.setWhereClauseParam(0,datetest);
    vodate.setWhereClauseParam(1,datetest);
    vodate.executeQuery();
    It works perfectly...I have tested it.
    Thanks,
    Gaurav

  • IRecruitment - custom page based on selected row in advanced table

    HI,
    We are implementing an addition to iRec. From the vacancy search page I have added an extra image column called worklog to the advanced table. Within the attributes I have set the view instance and and view attribute to
    View Attribute VacancyId
    View Instance IrcVacancyVO
    However this value does not get passed across. I have even called the image ID VacancyId in the hope that this value pair would be posted to the custom app I have written.
    I know this is a pretty low tech question on here, but does anyone know how I can pass the id of the selected row acroos to my custom page?
    TIA,
    Simon

    Hi Simon,
    In OATables we can not get the handle of current row.
    The alternate solution is to call an AM method, execute the method and get the value from the VO row. Return it back to CO and then you can call your new page from the Search page in iREC.
    it should work. Let me know if you are facing any problem.
    Thanks
    Anoop

  • Report display in dashboard based on selected value

    Hi Experts,
    I have an requirement.
    when I select quaterly in prompt the quaterly report should display.
    when Yearly selected then  yearly report should display in dashboard
    we are using OBIEE 11.1.1.7
    Any idea pls.

    Hi,
        I feel you can achieve this by using OBIEE11g Conditions. You can show the quaterly or yearly report based on the Rowcount fetched on the conditional analyis created. Please see if this helps

  • Changing value in drop-down based on selected value in another drop-down

    Hi,
    I have two drop-downs - changing value in Combo1, should cause the form to be submitted and values to be populated in Combo 2.
    Approaches i tried - 1) I am using an ActionListener. I am having a valueChange method which accepts an action event. However this appraoch is not working for me. 2) I was wondering if I could use Javacsript to catch the OnChange event , the javascript function would call an appropirate method in my ActionListener. I know in Struts its straightforward, but how do i achive the same here in JSF.
    Any tips would be helpful.
    Thanks
    PS: I already came across some threads in the forum, but could not get an answer. Also, I have a retsriction in terms of using Action LIsteners itself.

    Try using ValueChangeListener instead of ActionListener.
    Here's a working example of a ValueChangeListener. You can customize it and use it for your application.
    The JSP will look like this:
         <h:selectOneMenu value="#{globalsBean.selectedFirst}"
              valueChangeListener="#{globalsBean.changeList}" onchange="submit()">
              <f:selectItems value="#{globalsBean.first}" />
         </h:selectOneMenu>
         <h:selectOneMenu value="#{globalsBean.selectedSecond}">
              <f:selectItems value="#{globalsBean.second}" />
         </h:selectOneMenu>The globalsBean will look like this:
    public class GlobalsBean extends Bean {
         ArrayList first;
         ArrayList second;
         String selectedFirst;
         String selectedSecond;
         public GlobalsBean() {
              first = new ArrayList();
              second = new ArrayList();
              first.add(new SelectItem("1", "1"));
              first.add(new SelectItem("2", "2"));
              selectedFirst = "1";
              selectedSecond = "";
              second.add(new SelectItem("White", "White Cows"));
              second.add(new SelectItem("Brown", "Brown Cows"));
              second.add(new SelectItem("Green", "Green Cows?!?"));
         public ArrayList getFirst() {
              return first;
         public ArrayList getSecond() {
              return second;
         public String getSelectedFirst() {
              return selectedFirst;
         public void setSelectedFirst(String selected) {
               selectedFirst = selected;
         public String getSelectedSecond() {
              return selectedSecond;
         public void setSelectedSecond(String selected) {
               selectedSecond = selected;
         public void changeList(ValueChangeEvent event) throws AbortProcessingException{
              second = new ArrayList();
              String newValue = (String)event.getNewValue();
              setSelectedFirst(newValue);
              if (newValue.equals("1")) {
                   second.add(new SelectItem("White", "White Cows"));
                   second.add(new SelectItem("Brown", "Brown Cows"));
                   second.add(new SelectItem("Green", "Green Cows?!?"));
              } else if (newValue.equals("2")) {
                   second.add(new SelectItem("White/Black", "White Cows with Black spots"));
                   second.add(new SelectItem("Black", "Black Cows"));
              setSelectedSecond("");
    }Let me know how it works out for you.
    CowKing

  • My Lightroom 5 upgrade serial number not showing up on My Products page; chat support useless

    I purchased a Lightroom 5 upgrade license on July 25th.  I didn't receive a confirmation email but my serial number was displayed on the order summary page after purchase.  I tried registering the serial number repeatedly through the My Products page but for some reason the serial number wasn't showing up, even though the registration process reported a successful result.  Furthermore, Adobe products bought from the Adobe store should automatically be registered according to Adobe's web site.  Apparently this must have failed.  I need to reinstall Lightroom 5 but the serial number is still not showing up on the My Products page.  I just spent an extremely frustrating hour with Adobe "Live" chat who did nothing but send me in circles and repeat the same canned responses over and over again.
    I'm currently on hold with "phone support" but I'm not optimistic as I've been on hold for 28 minutes.  The only other support option was a link to this forum, hence this post.  Hopefully someone from Adobe can retrieve my serial number and contact me.  Failing this my only other option will be to contact VISA and open a claim.
    My comical-if-it-weren't-so-sad conversation with Adobe support:
    Hi, there are 36 customer(s) in line ahead of you. We'll be with you as soon as possible. Thank you for your patience.
    Hi, there are 35 customer(s) in line ahead of you. We'll be with you as soon as possible. Thank you for your patience.
    Hi, there are 31 customer(s) in line ahead of you. We'll be with you as soon as possible. Thank you for your patience.
    You are now chatting with Bhagawan.
    Bhagawan: Hello! Welcome to Adobe Customer Service.
    Joel: Hello
    Bhagawan: Hi Joel.
    Joel: I need to reinstall Lightroom 5 but my serial number is not showing up under My Products & Services on the website
    Joel: I bought a Lightroom 5 upgrade back in July
    Bhagawan: I will be glad to check and help you with this issue.
    Joel: For some reason the product registration is not showing up under my account. I have my VISA transaction info if it helps you find my purchase.
    Joel: Thanks
    Bhagawan: I'll be right with you.
    Joel: ok
    Bhagawan: Okay.
    Bhagawan: May I know the email address, please?
    Joel: ******
    Bhagawan: Thank you.
    Bhagawan: Let me check on this.
    Bhagawan: For security reasons, could you verify your complete name and billing address as mentioned on your account please?
    Joel: Sure:
    Joel: Joel ****
    Joel: **********
    Bhagawan: Thank you Joel.
    Bhagawan: Joel, I see that your serial number is registered under your adobe account, please sign out and sign in your adobe account click on My Products and service information to retrieve the serial number.
    Joel: I only see Lightroom 4 ... not Lightroom 5.
    Joel: But I'll try
    Joel: Give me a sec
    Bhagawan: Sure.
    Joel: Nope...still only shows Lightroom 4
    Joel: Products in use Version Platform Registration date Lightroom 4 Mul October 4, 2012 Register new products
    Bhagawan: Okay.
    Joel: Not sure why it isn't showing my upgraded license for Lightroom 5
    Bhagawan: Please give me a minute or two.
    Joel: ok
    Bhagawan: Sure.
    Bhagawan: Thanks for staying online.
    Joel: np
    Bhagawan: Joel, In this case, I'll transfer this chat to our Concern Team to check and help you with the serial number.
    Joel: ok
    Bhagawan: Please stay online.
    Joel: ok
    Please wait while I transfer the chat to the appropriate group.
    You are now chatting with Naveen R.
    Naveen R: Sorry for the wait. Please do stay online.
    Naveen R: Hello! Welcome to Adobe Customer Service.
    Joel: ok
    Joel: Hello
    Naveen R: Hi Joel.
    Naveen R: I understand that you are unable to locate the serial number.
    Joel: I purchased Lightroom 5 on July 25, 2013 as an upgrade for Lightroom 4. I need to reinstall Lightroom 5, but my serial number is not showing up in the products & services page.
    Joel: I looked through my email receipts and couldn't find an order confirmation (or anything from Adobe related to my recent purchase.) After purchasing the upgrade, the serial number was displayed and I thought I had registered it using the Adobe account portal
    Joel: Apparently, this didn't work. I have my VISA transaction information if required.
    Naveen R: Thank you for the information.
    Naveen R: I will be glad to check and help you with that.
    Joel: Thanks
    Joel: As I mentioned to the previous agent, when I got into My Products on the Adobe portal, I can see my Lightroom 4 info, but the Lightroom 5 Upgrade info isn't there.
    Joel: got = go
    Joel: sry
    Naveen R: Thank you for waiting. One moment please.
    Joel: ok
    Naveen R: I'll be right with you.
    Naveen R: Sorry for the wait. Please do stay online.
    Joel: ok
    Naveen R: Thank you for waiting. One moment please.
    Naveen R: Sorry for the wait. Please do stay online.
    Joel: Will it take much longer?
    Naveen R: Let me check on that.
    Joel: Are you alive?
    Naveen R: I'm sorry due to application error I'm unable to check on that.
    Joel: Can I please get a phone number to call? My only other choice would be to open a claim with VISA for fraud since Adobe seems unwilling to help in this matter
    Naveen R: I will provide the steps to locate the serial number on your Adobe account.
    Joel: I already know how to look for a serial number. The problem is that it doesn't show up in the Adobe account portal.
    Naveen R: Please login under a different browser.
    Joel: Already tried. Used IE then Chrome
    Naveen R: Delete the cookies refresh your browser.
    Joel: Same problem
    Joel: Please provide me with a number to call
    Naveen R: *Once you login to the Adobe account, click on "My products" under the "My products and services".
    Naveen R: *There you can locate the serial number which you have registered.
    Joel: I've already done that.
    Joel: It is NOT listed
    Joel: Which I've been saying for the past 40+ minutes
    Naveen R: May I know the email address you logged into Adobe account?
    Joel: ******
    Naveen R: Thank you.
    Joel: ...
    Naveen R: Thank you for waiting. One moment please.
    Naveen R: I see that your serial number is registered under your account.
    Joel: Lightroom 5
    Naveen R: I will provide you the serial number via email after ending this chat.
    Joel: ok but please make sure it isn't Lightroom 4 but my Lightroom 5 serial number
    Naveen R: Yes. Due to some technical error you are unable to locate it.
    Joel: ok please send the serial number
    Naveen R: Sure.
    Naveen R: Is there anything else I can help you with?
    Joel: No
    Naveen R: You are welcome.
    Naveen R: Thank you for contacting Adobe. We are available 7 days a week, 24 hours a day. Goodbye!
    This chat session has ended.
    Thank you for contacting Adobe.

    OK, I was able to recover my previous system's image and thankfully it appears you can get the serial number from Help->System Info.  I attempted to register the serial number again via the My Products page and while it indicated that the registration was successful, we'll see.  At least I should be able to install LR5 on my new machine now.
    Edit:  I also just discovered that the serial number is listed under My Orders, but not under My Products.  Weird.  In my defence , I never thought to check My Order history because I never received a confirmation email and the order wasn't listed after purchase...even as late as mid-August (when I last checked.)  Very strange but it's all good now.
    Edit #2: OK now I just feel silly.  I just received an email from Naveen with an actual support case AND the correct serial number.  So, I stand corrected.  The Live Chat process still felt incredibly long with some seemingly canned/automated responses but, in all fairness, he did get back to me.  Thank goodness I washed both feet today...

Maybe you are looking for