Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 5 of 5
  1. #1
    New to the CF scene
    Join Date
    Feb 2005
    Posts
    2
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Image selection - big pic and order button

    I have a page of merchandise for sell. Each has a small, med, larger. When a consumer picks a item by using the radio button (right tool?), how can I use this in html to continue the order? (in other words 'checkout', only one item/size will be picked). There is less than 50 items and not all will have small/med/large.

    also, code for clicking on the picture and seeing a bigger picture with more description?

    Thanks.
    Last edited by dholl328; 02-04-2005 at 05:26 PM. Reason: forgot a questoin

  • #2
    Senior Coder whizard's Avatar
    Join Date
    Jan 2005
    Location
    Philadelphia, PA, USA
    Posts
    1,662
    Thanks
    14
    Thanked 76 Times in 76 Posts

    Post

    To open a window with a big photo in it:

    <a href="path/to/big/image/bigimage.jpg" target="_blank">
    <img src="path/to/little/image/littleimage.jpg">
    </a>

    however, this does not do anything but show the bigimage in a new window. If you want text description, do this:

    <a href="#" onClick="window.open('html file', 'bigimage',
    config='height=xxx,width=xxx')";>
    <img src="path/to/little/image/littleimage.jpg">
    </a>
    Then you must create an HTML file where you layout your text description and your photo. Put the path to that where it says "html file". ignore bigimage. this is the name for the new window you are opening, so you could use it in advanced javascript. set the height and width to how big you want the new window to be.

    As far as the radio button goes, could elaborate a little, as to how it will work? Im not sure I get it

    Good luck
    Dan

  • #3
    Regular Coder
    Join Date
    Sep 2004
    Location
    USA
    Posts
    314
    Thanks
    7
    Thanked 0 Times in 0 Posts
    I could be wrong but I think what hes talking about is a shoping cart were it stores what size the customer chose for there product. You'll have to look into PHP to do that.

    Good luck
    Ribo

  • #4
    New to the CF scene
    Join Date
    Feb 2005
    Posts
    2
    Thanks
    0
    Thanked 0 Times in 0 Posts
    thanks for the big pic code;

    as for the radio buttons - each item will have 3 buttons - small,med,large that is associated with the picture; if a user clicks on 'medium' then 'submit', how does html code reference the variable set to productnumber.medium?

    /d


    Quote Originally Posted by whizard
    To open a window with a big photo in it:

    <a href="path/to/big/image/bigimage.jpg" target="_blank">
    <img src="path/to/little/image/littleimage.jpg">
    </a>

    however, this does not do anything but show the bigimage in a new window. If you want text description, do this:

    <a href="#" onClick="window.open('html file', 'bigimage',
    config='height=xxx,width=xxx')";>
    <img src="path/to/little/image/littleimage.jpg">
    </a>
    Then you must create an HTML file where you layout your text description and your photo. Put the path to that where it says "html file". ignore bigimage. this is the name for the new window you are opening, so you could use it in advanced javascript. set the height and width to how big you want the new window to be.

    As far as the radio button goes, could elaborate a little, as to how it will work? Im not sure I get it

    Good luck
    Dan

  • #5
    Senior Coder whizard's Avatar
    Join Date
    Jan 2005
    Location
    Philadelphia, PA, USA
    Posts
    1,662
    Thanks
    14
    Thanked 76 Times in 76 Posts

    Post

    You can't really do that with HTML. HTML is just a language that, with the help of CSS, controls the layout and appearance of a page. To get the radio button as a variable, you need to use javascript, PHP, PERL, or other scripting languages.

    To do it in PHP:

    first write this in html:

    Code:
    <form method="post" action="URL of PHP file that proceses the form">
    <input type="radio" name="my_radio_button_group" value="button1">
    Small
    <input type="radio" name="my_radio_button_group" value="button2">
    Medium
    <input type="radio" name="my_radio_button_group" value="button3">
    Large
    </form>
    in the php file that processes the form:

    PHP Code:
    <?php
    //Get value of radio buttons as PHP variable - this would be $_GET if that is what your form is using
    $my_radio_button_group $_POST['my_radio_button_group'];

    if(
    $my_radio_button_group == button1)
    {
    $size small
    }
    elseif(
    $my_radio_button_group == button2)
    {
    $size medium
    }
    elseif(
    $my_radio_button_group == button3)
    {
    $size large
    }
    else
    {
    //JS Error Alert box
    ?>
    <script>
    <!--
    alert(''Error message");
    history.go(-1);
    //-->
    </script>
    <?php
    }
    ?>


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •