www.webdeveloper.com
Results 1 to 11 of 11

Thread: Dynamic form with multiplication

  1. #1
    Join Date
    May 2007
    Posts
    9

    Dynamic form with multiplication

    Hi all,
    I'm having a problem with a dynamic form,specifically with a multiplication.
    If I don't solve this problem I cannot start my site...it will be a big regret..:cry:

    I'm learning js since last weekend so I'm asking you to help me with your experience. Hope you will find a solution or write an example script so that i can understand.

    <html>
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=windows-1252">
    <script language="JavaScript" type="text/javascript">
    function dennis(selezionata){
    ar_uno=new Array()
    ar_due=new Array()
    ar_tre=new Array()
    ar_quattro=new Array()
    ar_uno[0]=new Option('','')
    ar_uno[1]=new Option('0.001','0.001')
    ar_uno[2]=new Option('0.002','0.002')
    ar_uno[3]=new Option('0.003','0.003')
    ar_uno[4]=new Option('0.004','0.004')
    ar_uno[5]=new Option('0.005','0.005')
    ar_uno[6]=new Option('0.006','0.006')
    ar_uno[7]=new Option('0.007','0.007')
    ar_uno[8]=new Option('0.008','0.008')
    ar_uno[9]=new Option('0.009','0.009')
    ar_uno[10]=new Option('0.01','0.01')


    ar_due[0]=new Option('','')
    ar_due[1]=new Option('0.0015','0.0015')
    ar_due[2]=new Option('0.003','0.003')
    ar_due[3]=new Option('0.0045','0.0045')
    ar_due[4]=new Option('0.006','0.006')
    ar_due[5]=new Option('0.0075','0.0075')
    ar_due[6]=new Option('0.009','0.009')
    ar_due[7]=new Option('0.0105','0.0105')
    ar_due[8]=new Option('0.0120','0.0120')
    ar_due[9]=new Option('0.0135','0.0135')
    ar_due[10]=new Option('0.015','0.015')

    ar_tre[0]=new Option('','')
    ar_tre[1]=new Option('0.0005','0.0005')
    ar_tre[2]=new Option('','')
    ar_tre[3]=new Option('','')
    ar_tre[4]=new Option('','')
    ar_tre[5]=new Option('','')
    ar_tre[6]=new Option('','')
    ar_tre[7]=new Option('','')
    ar_tre[8]=new Option('','')
    ar_tre[9]=new Option('','')
    ar_tre[10]=new Option('','')

    ar_quattro[0]=new Option('','')
    ar_quattro[1]=new Option('0.0005','0.0005')
    ar_quattro[2]=new Option('','')
    ar_quattro[3]=new Option('','')
    ar_quattro[4]=new Option('','')
    ar_quattro[5]=new Option('','')
    ar_quattro[6]=new Option('','')
    ar_quattro[7]=new Option('','')
    ar_quattro[8]=new Option('','')
    ar_quattro[9]=new Option('','')
    ar_quattro[10]=new Option('','')

    if(selezionata=="uno")array_rif=ar_uno
    if(selezionata=="due")array_rif=ar_due
    if(selezionata=="tre")array_rif=ar_tre
    if(selezionata=="quattro")array_rif=ar_quattro
    for(i=0;i<array_rif.length;i++){
    document.form1.seconda.options[i]=array_rif[i]
    }
    }

    </script>
    </head>
    <body>
    <form name="form1">
    <select name="prima" onChange="dennis(this[this.selectedIndex].value)">
    <option value="uno">Paid Clicks</option>
    <option value="due">Unique Paid Clicks</option>
    <option value="tre">Banner Rotator(Header)</option>
    <option value="quattro">Text Ad(Header)</option>
    </select>
    <select name="seconda">
    <option value="uno1">0.001</option>
    <option value="uno2">0.002</option>
    <option value="uno3">0.003</option>
    <option value="uno4">0.004</option>
    <option value="uno5">0.005</option>
    <option value="uno6">0.006</option>
    <option value="uno7">0.007</option>
    <option value="uno8">0.008</option>
    <option value="uno9">0.009</option>
    <option value="uno10">0.010</option>
    </select>
    <input type="text" name="qt0" onchange="[?]">
    <input style="font-weight:bold;color:red" type="text" name="stot" value="0" readonly>
    </form>
    </body>
    </html>

    Here is the form:
    http://www.queezo.com/index.htm

    I need to find the result of:

    stot = selected_value_from_seconda*amount_written_in_qt0

    The problem is that there are different values for Paid Clicks, Unique Paid Clicks, Banner Rotator and Text Ad and i can't find the right code to get the result.

    Thanks in advance,
    BsW

  2. #2
    Join Date
    May 2007
    Posts
    9
    Someone who can help me with an example script or redirect me to a similar problem?
    I've tried today without success....

  3. #3
    Join Date
    Nov 2006
    Posts
    528
    1. Declare your arrays outside the function as global variables so they don't have to be redeclared every time the function is run.

    I made several other changes that I think will help as well. Let me know if you have any questions:
    Code:
    <html>
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=windows-1252">
    <script language="JavaScript" type="text/javascript">
    
    ar_uno = new Array('0.001','0.002','0.003','0.004','0.005',
                       '0.006','0.007','0.008','0.009','0.01');
    
    ar_due = new Array('0.0015','0.003','0.0045','0.006','0.0075',
                       '0.009','0.0105','0.0120','0.0135','0.015');
    
    ar_tre = new Array('0.0005');
    
    ar_quattro = new Array('0.0005');
    
    
    function dennis(){
    
      primaObj = document.form1.prima;
      selezionata = primaObj[primaObj.selectedIndex].value;
    
      if(selezionata=="uno")array_rif=ar_uno
      if(selezionata=="due")array_rif=ar_due
      if(selezionata=="tre")array_rif=ar_tre
      if(selezionata=="quattro")array_rif=ar_quattro
    
      document.form1.seconda.options.length = 0;
      for(i=0; i<array_rif.length; i++){
        document.form1.seconda.options[i] = new Option(array_rif[i], array_rif[i]);
      }
    
      calcStot();
    }
    
    function calcStot() {
      qt0Value = document.form1.qt0.value
      if (!qt0Value || isNaN(qt0Value)) {
        document.form1.stot.value = '';
      } else {
    
        qt0val   = document.form1.qt0.value;
        secondaObj = document.form1.seconda;
        secondaVal = secondaObj[secondaObj.selectedIndex].value;
    
        document.form1.stot.value = qt0val +" * "+ secondaVal + " = " + (qt0val * secondaVal);
      }
    }
    
    </script>
    </head>
    <body onload="dennis();">
    <form name="form1">
    <select name="prima" onChange="dennis();">
    <option value="uno">Paid Clicks</option>
    <option value="due">Unique Paid Clicks</option>
    <option value="tre">Banner Rotator(Header)</option>
    <option value="quattro">Text Ad(Header)</option>
    </select>
    <select name="seconda" onChange="calcStot();">
    <option></option>
    </select>
    <input type="text" name="qt0" onchange="calcStot();">
    <input style="font-weight:bold;color:red" type="text" name="stot" value="0" readonly>
    </form>
    </body>
    </html>

  4. #4
    Join Date
    May 2007
    Posts
    9
    This was exactly what I needed,mjdamato!!!!
    You have no idea how much i'm happy at the moment cause this was finally the last step before my site will be launched.
    At the moment the code written by you works excellent but I will test it tomorrow(it's 00:35am here).
    Moreover I will read,study and understand how you have written the code so that next time maybe I will have the chance to help someone.

    For now,THANK YOU VERY MUCH.

    really, THANK YOU.

    BsW

  5. #5
    Join Date
    Nov 2006
    Posts
    528
    Let me know if you have any questions.

  6. #6
    Join Date
    May 2007
    Posts
    9

    Lightbulb

    I'm here again and hope you can help me .

    mjdamato made for me excactly what I intended to have but now it needs to have a little change.

    I changed this:
    document.form1.stot.value = qt0val +" * "+ secondaVal + " = " + (qt0val * secondaVal);
    into:

    document.form1.stot.value = ((qtotval * pz0Val) + 0.40*(qtotval * pz0Val)).toFixed(2);
    because I had to apply a fee of 40% on the total price.

    But now i want that the 40% will be applied only to:
    <option value="uno">Paid Clicks</option>
    <option value="due">Unique Paid Clicks</option>

    so that the other two option won't have any fee:

    <option value="tre">Banner Rotator(Header)</option>
    <option value="quattro">Text Ad(Header)</option>

    How can i do that?

  7. #7
    Join Date
    Nov 2006
    Posts
    528
    Replace that line to this:

    Code:
        if (selezionata=="uno" || selezionata=="due") {
          price = 1.40*(qtotval * pz0Val);
        } else {
          price = (qtotval * pz0Val);
        }
        document.form1.stot.value = price.toFixed(2);

  8. #8
    Join Date
    May 2007
    Posts
    9
    I totally forget this topic.
    Thank you mjdamato. You're my hero.

    But I need one more feature.
    I need two checkboxes.

    If someone checks only the first one a fee of 3.00$ will be summed to the total price.
    If someone checks only the second one a fee of 1.00$ will be summed to the total price.
    If someone checks the first and the second one a fee of 4.00$(3+1) will be summed to the total price

  9. #9
    Join Date
    Nov 2006
    Posts
    528
    Piece of cake:
    Code:
    <html>
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=windows-1252">
    <script language="JavaScript" type="text/javascript">
    
    ar_uno = new Array('0.001','0.002','0.003','0.004','0.005',
                       '0.006','0.007','0.008','0.009','0.01');
    
    ar_due = new Array('0.0015','0.003','0.0045','0.006','0.0075',
                       '0.009','0.0105','0.0120','0.0135','0.015');
    
    ar_tre = new Array('0.0005');
    
    ar_quattro = new Array('0.0005');
    
    
    function dennis(){
    
      primaObj = document.form1.prima;
      selezionata = primaObj[primaObj.selectedIndex].value;
    
      if(selezionata=="uno")array_rif=ar_uno
      if(selezionata=="due")array_rif=ar_due
      if(selezionata=="tre")array_rif=ar_tre
      if(selezionata=="quattro")array_rif=ar_quattro
    
      document.form1.seconda.options.length = 0;
      for(i=0; i<array_rif.length; i++){
        document.form1.seconda.options[i] = new Option(array_rif[i], array_rif[i]);
      }
    
      calcStot();
    }
    
    function calcStot() {
      qt0Value = document.form1.qt0.value
      if (!qt0Value || isNaN(qt0Value)) {
        document.form1.stot.value = '';
      } else {
    
        pz0Obj = document.form1.seconda;
        pz0Val = pz0Obj[pz0Obj.selectedIndex].value;
    
        if (selezionata=="uno" || selezionata=="due") {
          price = 1.40*(qt0Value * pz0Val);
        } else {
          price = (qt0Value * pz0Val);
        }
    
        opt1Obj = document.getElementById('option1');
        price = (opt1Obj.checked)?price+(opt1Obj.value*1):price;
    
        opt2Obj = document.getElementById('option2');
        price = (opt2Obj.checked)?price+(opt2Obj.value*1):price;
    
        document.form1.stot.value = price.toFixed(2);
      }
    }
    
    </script>
    </head>
    <body onload="dennis();">
    <form name="form1">
    Option 1 (3.00$) <input type="checkbox" name="option1" value="3" onclick="calcStot();"><br>
    Option 2 (1.00$) <input type="checkbox" name="option2" value="1" onclick="calcStot();"><br>
    <select name="prima" onChange="dennis();">
    <option value="uno">Paid Clicks</option>
    <option value="due">Unique Paid Clicks</option>
    <option value="tre">Banner Rotator(Header)</option>
    <option value="quattro">Text Ad(Header)</option>
    </select>
    <select name="seconda" onChange="calcStot();">
    <option></option>
    </select>
    <input type="text" name="qt0" onchange="calcStot();">
    <input style="font-weight:bold;color:red" type="text" name="stot" value="0" readonly>
    </form>
    </body>
    </html>

  10. #10
    Join Date
    May 2007
    Posts
    9
    It doens't work mjdamato. I don't get any result.

    tried to change into:

    opt1Obj = document.form1.getElementById('option1');
    price = (opt1Obj.checked)?price+(opt1Obj.value*1)rice;

    opt2Obj = document.form1.getElementById('option2');
    price = (opt2Obj.checked)?price+(opt2Obj.value*1)rice;

    but still no result.

  11. #11
    Join Date
    May 2007
    Posts
    9
    up

Thread Information

Users Browsing this Thread

There are currently 1 users browsing this thread. (0 members and 1 guests)

Posting Permissions

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



Recent Articles