27 Replies Latest reply on Feb 22, 2014 6:02 AM by ChitChatterz

    Need help with some code

    ChitChatterz

      <!doctype html>

      <html>

       

       

      Hello,

      I am quite a newbie to dreamweaver however i have managed to create my own custom price calculator, however how can i redirect the user to a specific url if the div id for total is a amount for example £540 go to a site, £440 go to another side.

      How could i incorporate that?
      Could somebody please help me

       

      Here is the link since i cant paste it here:

      http://justpaste.it/egur

        • 1. Re: Need help with some code
          MurraySummers Level 8

          Do you want the visitor to immediately go to the desired page on clicking the radio button?

          • 2. Re: Need help with some code
            ChitChatterz Level 1

            Hello,

            Thanks for replying.

            No i dont want the visitor to go imediatly.

            Basically there is a calculator on the right side, when clicking the radio buttons the price changes.
            I need a button where it says checkout, and if the amount is £50 go to a page, if the amount is £65 go to another page

            I need it basic then i an incorporate it.

            Thought i could get some help.

            • 4. Re: Need help with some code
              MurraySummers Level 8

              Try this (without the jQuery part)...

               

              <!doctype html>

              <html>

              <head>

              <title>Whatever</title>

              </head>

              <body>

              <a href="index.html"><img src="images/logo.jpg" width="100" height="100"></a>

              <form action="" method="">

              <label><input type="checkbox" class="option" value="200" /> Some option</label><br/>

              Please select a option??

              <label><input type='radio' class="option" name='ram_radio' value='100' onclick="document.getElementById('total').innerHTML='£' + 40;document.getElementById('button').innerHTML='<a href=&quot;page1.html&quot;>go</' + 'a>'">2 GB</label>

              <label><input type='radio' class="option" name='ram_radio' value='150' onclick="document.getElementById('total').innerHTML='£' + 60;document.getElementById('button').innerHTML='<a href=&quot;page2.html&quot;>go</' + 'a>'">3 Gb</label>

              <label><input type='radio' class="option" name='ram_radio' value='200' onclick="document.getElementById('total').innerHTML='£' + 120;document.getElementById('button').innerHTML='<a href=&quot;page3.html&quot;>go</' + 'a>'">8 Gb</label>

              <button id="button"><a>go</a></button>

              <div id="apDiv1" style="font-size:40px;color:red;">

                    <div id="total"></div>

              </div>

              </form>

              </body>

              </html>

              • 5. Re: Need help with some code
                osgood_ Level 8

                You can do this by adding to the jQuery:

                 

                <script>

                 

                $(document).ready(function(){

                $('label').click(function() {

                var total = 0;

                $('#total').html('£' + total);

                $('.option:checked').each(function(){

                total += parseInt($(this).val());

                });

                $('#total').html('£' + total);

                });

                 

                 

                $('#checkout').click(function() {

                var sum = $('#total').text();

                if(sum == "£66") {

                var url = "http://www.itv.co.uk";

                $(location).attr('href',url);

                }

                if(sum == "£100") {

                var url = "http://www.bbc.co.uk";

                $(location).attr('href',url);

                }

                if(sum == "£150") {

                var url = "http://www.dailymail.co.uk";

                $(location).attr('href',url);

                }

                if(sum == "£200") {

                var url = "http://www.thisismoney.co.uk";

                $(location).attr('href',url);

                }

                    });

                 

                });

                 

                 

                </script>

                 

                 

                Then including a 'checkout' button on your page:

                 

                 

                <input type="button" id="checkout" value="Checkout">

                • 6. Re: Need help with some code
                  ChitChatterz Level 1

                  Thanks guys, you have been a great help.


                  Can you tell me how to change the link from a url to a page within my website??

                  $('#checkout').click(function() {

                  var sum = $('#total').text();

                  if(sum == "£66") {

                  var url = "http://www.itv.co.uk";

                  $(location).attr('href',url);

                  }

                   

                  I am trying to change the itv.co.uk to a page within my site lets say page3.html

                  Help gladly appreciated!

                  • 7. Re: Need help with some code
                    osgood_ Level 8

                    Just change the lines of code below to the appropriate page name:

                     

                    var url = "page3.html";

                    • 8. Re: Need help with some code
                      ChitChatterz Level 1

                      Hey,

                      Thanks to your code i have managed to do almost all that i needed for my custom computer builder.
                      However i have ran into some issues,

                      The following script has been adapted to generate a number based on which label the user has clicked in.
                      However i cannot manage to store the data for price.

                      Here is a example

                      If he clicks on a button, it shows the price £40 and the value "B",
                      I have managed to create the price and character values individually however i need to incorporate them on the same label.

                      I can only enter a number or a character in the value box so i do not know how i can incorporate both of them.

                       

                       

                       

                       

                       

                       

                      <script>

                       

                      $(document).ready(function(){

                      $('label').click(function() {

                      var total = 0;

                      $('#total').html('£' + total);

                      $('.option:checked').each(function(){

                      total += parseInt($(this).val());

                      });

                      $('#total').html('£' + total);

                      });

                       

                       

                       

                       

                      $('.code').click(function() {

                      var total2 = "";

                       

                       

                      $('.code:checked').each(function(){

                      total2 += String($(this).val())

                      });

                      $('#total2').html(total2);

                      });

                       

                       

                      $('#checkout').click(function() {

                      var sum = $('#total').text();

                      if(sum == "£66") {

                      var url = "http://www.itv.co.uk";

                      $(location).attr('href',url);

                      }

                      if(sum == "£60") {

                      var url = "http://www.bbc.co.uk";

                      $(location).attr('href',url);

                      }

                      if(sum == "£40") {

                      var url = "http://www.dailymail.co.uk";

                      $(location).attr('href',url);

                      }

                      if(sum == "£20") {

                      var url = "page3.html";

                      $(location).attr('href',url);

                      }

                          });

                       

                      });

                       

                      </script>

                       

                       

                       

                      <body>

                       

                      <label><input type='radio' class="code" name='mb_radio' value='b'>Intel 3</label>

                      </body>

                       

                      <div id="total2"style="font-size:40px;color:red;">b</div>

                      <label><input type='radio' class="option" name="ram_radio" value='110'>8Gb</label>

                      • 10. Re: Need help with some code
                        ChitChatterz Level 1

                        Hey,

                        This is a updated post, I managed to fix all my problems.

                        However how can i have 2 different prices for the same value??
                        Basically a radio box must have price £20 and £30 at the same time on different texts.

                        How can i achieve that? At the moment i can only have one value per radio. How can i have two different price tags for the same radio box??

                         

                         

                         

                        <script>

                         

                        $(document).ready(function(){

                        $('.options').click(function() {

                        var total = 0;

                        $('#total').html('£' + total);

                        $('.options:checked').each(function(){

                        total += parseInt($(this).val());

                        });

                        $('#total').html('£' + total);

                        });

                         

                        $('#checkout').click(function() {

                        var sum = $('#total2').text();

                        if(sum == "aa") {

                        var url = "http://www.itv.co.uk";

                        $(location).attr('href',url);

                        }

                        if(sum == "£60") {

                        var url = "http://www.bbc.co.uk";

                        $(location).attr('href',url);

                        }

                        if(sum == "£40") {

                        var url = "http://www.dailymail.co.uk";

                        $(location).attr('href',url);

                        }

                        if(sum == "£20") {

                        var url = "page3.html";

                        $(location).attr('href',url);

                        }

                            });

                         

                        });

                         

                         

                        <body>

                         

                        <label><input type='radio' class="code" name='mb_radio' value='c'>Amd Fx</label>

                        <div id="apDiv2">

                        <input name="checkout" id="checkout" type="image" src="images/1.jpg" width="100" height="100" onmousedown="return false;">

                        </div>

                         

                        </body>

                        • 12. Re: Need help with some code
                          osgood_ Level 8

                          I don't understand what you mean by 'different texts':

                           

                          'Basically a radio box must have price £20 and £30 at the same time on different texts'.

                           

                          Can you explain what it is that you require to happen because I'm confused after reading your two previous posts.

                          • 13. Re: Need help with some code
                            ChitChatterz Level 1

                            Hey,
                            Thanks for replying you been of great help.
                            Basically right now the calculator works fine, i click radio boxes and it displays the price tag £50 on the screen.

                            However how can i have the radio button hold two different values??
                            I need one value for the price, and another value for the code.

                            Basically when the user clicks radio a+b a code forms as ab. I then will use that to redirect the user based on the choices he has made.

                            So i need the radio to have two values, one for the price and another one for the code which will redirect the user.

                            Thanks

                            • 14. Re: Need help with some code
                              osgood_ Level 8

                              Despite your best try I'm still failing to visualize what is meant to be happening.

                               

                              I understand that you have a set of radio buttons on your page which represent a range of prices. When a radio button is clicked the price is display in a <div>

                               

                              What is this code a+b refering to? How is that associated with the price displayed on screen?

                               

                              Maybe someone else will read the post and understand clearly what you require. Without some visual guidance I'm not sure anyone will understand.

                              • 15. Re: Need help with some code
                                ChitChatterz Level 1

                                Hey,

                                Yes i apologise for the my inability to express myself.

                                Basically i need it like this.

                                The label to contain information for the price and then a alphabetical number.

                                As it can be seen here.

                                If i select intel 5 and 4 GB it currently displays the value "ab" however the calculator on the right no longer works.
                                How can i make the value "ab" to work together with the calculator on the same label? at the same time.
                                I need the calculator to display the price £40 whilst the value is ab.

                                Then i will do if the code equals ab to redirect to a page, or if the code ac equals redirect to another pages whilst keeping the same price.

                                 

                                 

                                 

                                http://oi61.tinypic.com/4rsr4i.jpg

                                • 16. Re: Need help with some code
                                  osgood_ Level 8

                                  Can you paste the page code that you currently have. Your 2 previously posted codings are different to what you describe in your most recent post.

                                  • 17. Re: Need help with some code
                                    ChitChatterz Level 1

                                    Hey, Hope you understand what i am trying to do.

                                    I need the visitor to see the correct price, whilst generating a background code in order to redirect him based on his choices.

                                     

                                     

                                     

                                     

                                    Here is the code.

                                    <script>

                                     

                                    $(document).ready(function(){

                                    $('.options').click(function() {

                                    var total = 0;

                                    $('#total').html('£' + total);

                                    $('.options:checked').each(function(){

                                    total += parseInt($(this).val());

                                    });

                                    $('#total').html('£' + total);

                                    });

                                     

                                     

                                     

                                     

                                    $('.code').click(function() {

                                    var total2 = "";

                                     

                                     

                                    $('.code:checked').each(function(){

                                    total2 += String($(this).val())

                                    });

                                    $('#total2').html(total2);

                                    });

                                     

                                     

                                     

                                     

                                     

                                     

                                     

                                     

                                     

                                     

                                     

                                     

                                     

                                     

                                    $('#checkout').click(function() {

                                    var sum = $('#total2').text();

                                    if(sum == "aa") {

                                    var url = "http://www.itv.co.uk";

                                    $(location).attr('href',url);

                                    }

                                    if(sum == "£60") {

                                    var url = "http://www.bbc.co.uk";

                                    $(location).attr('href',url);

                                    }

                                    if(sum == "£40") {

                                    var url = "http://www.dailymail.co.uk";

                                    $(location).attr('href',url);

                                    }

                                    if(sum == "£20") {

                                    var url = "page3.html";

                                    $(location).attr('href',url);

                                    }

                                        });

                                     

                                    });

                                     

                                    </script>

                                     

                                     

                                    <body>

                                    <label><input name='mb_radio' type='radio' class="code" value='a' checked>Intel 5</label>

                                    <label><input type='radio' class="options" name="ram_radio" value='30'>8Gb</label>

                                     

                                     

                                    I need to combine those two together, to have a value of A and price of 30

                                     

                                     

                                    </body>

                                     

                                     

                                    <div id="total2"style="font-size:40px;color:red;">aa</div>

                                    <div id="total">£0</div>

                                     

                                    <input name="checkout" id="checkout" type="image" src="images/1.jpg" width="100" height="100" onmousedown="return false;">

                                    • 18. Re: Need help with some code
                                      osgood_ Level 8

                                      So when you click Intel 5 the letter A is displayed on the page.

                                       

                                      When you click 8Gb the amount £30 is displayed on the page.

                                       

                                      How do you want to combine these - for what purpose. The user has to select 2 options as a default from what I can see, right?

                                       

                                      Are you wanting to send the user to a specific page based on the 'letter' and the 'price'

                                       

                                      If that is the case:

                                       

                                      $('#checkout').click(function() {

                                      var total = $('#total').text();

                                      var total2 = $('#total2').text();

                                      if(total == "£30" && total2 == "a") {

                                      var url = "http://www.itv.co.uk";

                                      $(location).attr('href',url);

                                      }

                                      • 19. Re: Need help with some code
                                        ChitChatterz Level 1

                                        Hey

                                        I want it like,

                                        When i click Intel 5 the letter A to be displayed on the page alongside with the price £30.

                                        So if i click Intel 5 i want to see the price £30 and show letter a.

                                        I am basically building a customizer so i need to redirect the user.

                                        • 20. Re: Need help with some code
                                          osgood_ Level 8

                                          ChitChatterz wrote:

                                           

                                          Hey

                                          I want it like,

                                          When i click Intel 5 the letter A to be displayed on the page alongside with the price £30.

                                          So if i click Intel 5 i want to see the price £30 and show letter a.

                                           

                                           

                                          Amend the code like below: When you click Intel 5 an A and the price £30 will appear on your page. Whats the 8Gb radio button for?

                                           

                                           

                                          $('.code:checked').each(function(){

                                          total2 += String($(this).val())

                                          });

                                          $('#total2').html(total2);

                                          if (total2 == "a") {

                                          var total = "£30";

                                          $('#total').html(total);

                                          }

                                          });

                                          • 21. Re: Need help with some code
                                            ChitChatterz Level 1

                                            Hey,
                                            I just done that and it works great.

                                            However that would take alot of time in order to ensure all possible combinations of around 900.

                                            I am trying to create something similar like this.

                                            http://www.originpc.com/configurator/prime/4.aspx?shellid=3
                                            Do you know any faster way in which i can achieve that calculator and options selection?

                                            • 22. Re: Need help with some code
                                              osgood_ Level 8

                                              Without knowing the full background of your exact requirements it's not possible to give you any definitive answers only to say if I had 900 options I would probably somehow involve a database.

                                              • 23. Re: Need help with some code
                                                ChitChatterz Level 1

                                                Hey,

                                                Im trying to build a customizer like the one previously given as demonstrated by origin.

                                                There would be aproximatly 900 comibnations such as A+b+c etc..

                                                I was wondering if there is different approach////

                                                Also if i do using the method you have helped for 900 combinations will it slow down the webpage?

                                                Thanks

                                                • 24. Re: Need help with some code
                                                  ChitChatterz Level 1

                                                  Also osgood,
                                                  Are you looking to work on a part of the website paid?

                                                  I need the customizer to fit all my needs however i am having quite the trouble setting everything up.

                                                  If you could give me your email adress we could discuss some business.

                                                  Thanks

                                                  • 25. Re: Need help with some code
                                                    ChitChatterz Level 1

                                                    Hey,
                                                    Whilst still working on the code, it seems way to much work to do it like you suggested for each individual.

                                                     

                                                    $('.code:checked').each(function(){

                                                    total2 += String($(this).val())

                                                    });

                                                    $('#total2').html(total2);

                                                    if (total2 == "a") {

                                                    var total = "£30";

                                                    $('#total').html(total);

                                                    }

                                                    });

                                                     

                                                     

                                                    Is there anyway i could incorporate a letter field and a price field in the same label?

                                                    Such as adding it in this label. Can i not add the value "a" whilst also adding the value £30 and still make it work?
                                                    Cuz if i i use the code you have suggested i would have to arrange for each individual.

                                                     

                                                    <label><input name='mb_radio' type='radio' class="code" value='a' checked>Intel 5</label>

                                                    • 26. Re: Need help with some code
                                                      Nancy OShea Adobe Community Professional & MVP

                                                      It's not entirely clear to me what your goal is with this.  But it sure looks like you need a professional shopping cart.

                                                       

                                                       

                                                      Nancy O.

                                                      • 27. Re: Need help with some code
                                                        ChitChatterz Level 1

                                                        Hey,

                                                        Any idea where i could find a professional who could incorporate it within my website?
                                                        Please let me know if you know anybody.