Dismiss Notice
Welcome to Our Community
Wanting to join the rest of our members? Feel free to sign up today.

Help needed with form - javascript show div function.

Discussion in 'Programming' started by xert, Feb 10, 2010.

  1. xert

    xert New Member Webmaster

    Hi folks,

    Hope someone can help. I use a form in our shopping cart which when the form select fields are clicked, the javascript allows information such as a second dropdown form enclosed in a specific div to be revealed to the user. Works fine and here is the javascript code with the body code below ....

    <script type="text/javascript">
    window.onload=function() { attachBehaviors(); };
    function attachBehaviors() {
    if (document.getElementById('productpr1')) {
    document.getElementById('productpr1').onchange=function() {
    function Display(obj,selind) {
    if (! document.getElementById(obj.id)) {
    alert('Oops! Something is not id\'ed correctly ' + obj.id);
    var divs = Array('a1-div','a2-div');
    var opts = obj.options[selind].value.split(':');
    var div = opts[opts.length-1]; // takes last item, arrays are zero based.
    for (j=0;j<divs.length;j++) {
    if (document.getElementById(divs[j])) {
    <form action="xxxxx" method="post" name="form1">
    <input type="hidden" name="userid" value="9437628">
    <input type="hidden" name="return" value="xxxx/scripts/cart.php">
    <p style="text-align:center;">Option :
    <input type="hidden" value="1" name="qty1">
    <select name="productpr1" id="productpr1">
    <option selected value="">please select</option>
    <option value="2 seater fabric sofabed:539:a1-div">2 seater fabric sofabed</option>
    <option value="2 seater leather sofa:499:a2-div">2 seater leather sofa</option>
    <p id="a1-div" style="display:none;text-align:center;">
    <select name="product1[]" id="product1-select">
    <option selected value="">please select</option>
    <option value=", anthracite fabric">fabric : anthracite</option>
    <option value=", beige fabric">fabric : beige</option>
    <p id="a2-div" style="display:none;text-align:center;">
    <select name="product1[]" id="product2-select">
    <option selected value="">please select</option>
    <option value=", bitter leather">leather : bitter</option>
    <option value=", chestnut leather">leather : chestnut</option>


    Now what I need to do is allow the script to select multiple divs when a certain option is selected on the first form 'option selected value' field.
    As a working example, this would allow a user to select '2 seater fabric sofabed' and have the options revealed in divs as say 'div id="colour"',
    'div id="delivery"', and 'div id="stainguard"
    Wereas if '2 seater leather sofa' was selected just the first 2 divs would be revealed as stainguard div would not be required.
    Any ideas how I can modify the code to allow this ?
    Kind regards to all.
    Last edited by a moderator: Feb 10, 2010

Featured Resources (View All)

Share This Page