SitePoint Sponsor

User Tag List

Results 1 to 7 of 7
  1. #1
    if ($zee == "Guru") { $zee--;}
    Join Date
    Nov 2005
    Location
    Karachi - Pakistan
    Posts
    1,134
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Display result onChange event.

    Hi

    masters !!

    I have a webpage with a simple calculator on it. Its a multi-level referrer income calculator. Like i get an account at some website, then i refer 3 people, next those three people refer 2 people each and so on. So i will get the benefit of when my decedents get referrers.

    So i designed a html form, where there are 20 Combo boxes (dropdown (<select> thing)) now on onChange event of all those dropdowns, i call a javascript function genincome().

    I have this words as the heading of those dropdowns

    Level 1 : How many users can you refer to us ?
    Level 2 : How many users in level 1 can bring new signups ?
    Level 3 : how many users in level 2 can bring new signups ?
    .
    .
    .
    .
    so on

    Now suppose that user select 0 users in level three's dropdown, then it must make all the next dropdowns 0.

    like if dropdown no 3 = 0, then all rest dropdown (4 to 20 must be 0) if dropdown 4 iis 0 selected, then all from 5 to 20 must be 0.

    and onchange of every dropdown, it must show the updated result at the bottom. the formula is $10 to me on every signups brought by me, or my decedents.

    so please help. how to code this.

  2. #2
    SitePoint Wizard siteguru's Avatar
    Join Date
    Oct 2002
    Location
    Scotland
    Posts
    3,631
    Mentioned
    2 Post(s)
    Tagged
    0 Thread(s)
    .selectedIndex is the property you want for reading/setting the dropdown lists.
    Ian Anderson
    www.siteguru.co.uk

  3. #3
    if ($zee == "Guru") { $zee--;}
    Join Date
    Nov 2005
    Location
    Karachi - Pakistan
    Posts
    1,134
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    yes i know that. but i need to know the code to print the result :-)

  4. #4
    SitePoint Wizard siteguru's Avatar
    Join Date
    Oct 2002
    Location
    Scotland
    Posts
    3,631
    Mentioned
    2 Post(s)
    Tagged
    0 Thread(s)
    Here's something to get you started ...

    Code HTML4Strict:
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 3.2 Final//EN">
    <HTML>
    <HEAD>
    <TITLE>Select Test</TITLE>
    <script type="text/javascript">
    function results (el) {
    	var numsels = 10; // Set the max number of droplists
    	var sel = el.name.substring(3) * 1; // get the Number of the selected list
    	var val = el.options[el.selectedIndex].value; // get its value
     
    	if (val == 0) { // Value is zero?
    		for (var i=sel+1; i<=numsels; i++) { // Loop remaining droplists and set to zero
    			var eld = document.getElementsByName('sel'+i)[0];
    			eld.selectedIndex = 0;
    		}
    	}
    	calc ();
    }
     
    function calc () {
    	var frm = document.getElementById('frmResults'); // get the form object
    	result = 0;
    	revenue = 10; // Amount of $ per referrer
    	for (var i=0; i<frm.length; i++) { // Loop through form and calculate result
    		var elm = frm.elements[i];
    		if (elm.type.indexOf("select") > -1) {
    			elv = elm.options[elm.selectedIndex].value;
    			var tmp = elv * revenue;
    			result += tmp;
    		}
    	}
    	document.getElementsByName('result')[0].value = result;
    }
     
    window.onload = calc;
    </script>
    </HEAD>
     
    <BODY>
    <form id="frmResults" action="">
    <select name="sel1" onchange="results (this)">
    	<option value="0">0</option>
    	<option value="1" selected="selected">1</option>
    	<option value="2">2</option>
    	<option value="3">3</option>
    </select> - Level 1
    <br />
    <select name="sel2" onchange="results (this)">
    	<option value="0">0</option>
    	<option value="1" selected="selected">1</option>
    	<option value="2">2</option>
    	<option value="3">3</option>
    </select> - Level 2
    <br />
    <select name="sel3" onchange="results (this)">
    	<option value="0">0</option>
    	<option value="1" selected="selected">1</option>
    	<option value="2">2</option>
    	<option value="3">3</option>
    </select> - Level 3
    <br />
    <select name="sel4" onchange="results (this)">
    	<option value="0">0</option>
    	<option value="1" selected="selected">1</option>
    	<option value="2">2</option>
    	<option value="3">3</option>
    </select> - Level 4
    <br />
    <select name="sel5" onchange="results (this)">
    	<option value="0">0</option>
    	<option value="1" selected="selected">1</option>
    	<option value="2">2</option>
    	<option value="3">3</option>
    </select> - Level 5
    <br />
    <select name="sel6" onchange="results (this)">
    	<option value="0">0</option>
    	<option value="1" selected="selected">1</option>
    	<option value="2">2</option>
    	<option value="3">3</option>
    </select> - Level 6
    <br />
    <select name="sel7" onchange="results (this)">
    	<option value="0">0</option>
    	<option value="1" selected="selected">1</option>
    	<option value="2">2</option>
    	<option value="3">3</option>
    </select> - Level 7
    <br />
    <select name="sel8" onchange="results (this)">
    	<option value="0">0</option>
    	<option value="1" selected="selected">1</option>
    	<option value="2">2</option>
    	<option value="3">3</option>
    </select> - Level 8
    <br />
    <select name="sel9" onchange="results (this)">
    	<option value="0">0</option>
    	<option value="1" selected="selected">1</option>
    	<option value="2">2</option>
    	<option value="3">3</option>
    </select> - Level 9
    <br />
    <select name="sel10" onchange="results (this)">
    	<option value="0">0</option>
    	<option value="1" selected="selected">1</option>
    	<option value="2">2</option>
    	<option value="3">3</option>
    </select> - Level 10
    <br />
    <input type="text" name="result" />
    </form>
    </BODY>
    </HTML>
    Ian Anderson
    www.siteguru.co.uk

  5. #5
    if ($zee == "Guru") { $zee--;}
    Join Date
    Nov 2005
    Location
    Karachi - Pakistan
    Posts
    1,134
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    but here the textbox RESULT is not readonly and one can change its value. Is this possible to have Div (Layer) instead of Textbox to display the result.

    by the way, thanks a lot for your code and support !

  6. #6
    SitePoint Wizard siteguru's Avatar
    Join Date
    Oct 2002
    Location
    Scotland
    Posts
    3,631
    Mentioned
    2 Post(s)
    Tagged
    0 Thread(s)
    Simple change ...

    Code HTML4Strict:
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 3.2 Final//EN">
    <HTML>
    <HEAD>
    <TITLE>Select Test</TITLE>
    <script type="text/javascript">
    function results (el) {
    	var numsels = 10; // Set the max number of droplists
    	var sel = el.name.substring(3) * 1; // get the Number of the selected list
    	var val = el.options[el.selectedIndex].value; // get its value
     
    	if (val == 0) { // Value is zero?
    		for (var i=sel+1; i<=numsels; i++) { // Loop remaining droplists and set to zero
    			var eld = document.getElementsByName('sel'+i)[0];
    			eld.selectedIndex = 0;
    		}
    	}
    	calc ();
    }
     
    function calc () {
    	var frm = document.getElementById('frmResults'); // get the form object
    	var result = 0;
    	var revenue = 10; // Amount of $ per referrer
    	for (var i=0; i<frm.length; i++) { // Loop through form and calculate result
    		var elm = frm.elements[i];
    		if (elm.type.indexOf("select") > -1) {
    			elv = elm.options[elm.selectedIndex].value;
    			var tmp = elv * revenue;
    			result += tmp;
    		}
    	}
    	document.getElementById('result').innerHTML = result;
    }
     
    window.onload = calc;
    </script>
    </HEAD>
     
    <BODY>
    <form id="frmResults" action="">
    <select name="sel1" onchange="results (this)">
    	<option value="0">0</option>
    	<option value="1" selected="selected">1</option>
    	<option value="2">2</option>
    	<option value="3">3</option>
    </select> - Level 1
    <br />
    <select name="sel2" onchange="results (this)">
    	<option value="0">0</option>
    	<option value="1" selected="selected">1</option>
    	<option value="2">2</option>
    	<option value="3">3</option>
    </select> - Level 2
    <br />
    <select name="sel3" onchange="results (this)">
    	<option value="0">0</option>
    	<option value="1" selected="selected">1</option>
    	<option value="2">2</option>
    	<option value="3">3</option>
    </select> - Level 3
    <br />
    <select name="sel4" onchange="results (this)">
    	<option value="0">0</option>
    	<option value="1" selected="selected">1</option>
    	<option value="2">2</option>
    	<option value="3">3</option>
    </select> - Level 4
    <br />
    <select name="sel5" onchange="results (this)">
    	<option value="0">0</option>
    	<option value="1" selected="selected">1</option>
    	<option value="2">2</option>
    	<option value="3">3</option>
    </select> - Level 5
    <br />
    <select name="sel6" onchange="results (this)">
    	<option value="0">0</option>
    	<option value="1" selected="selected">1</option>
    	<option value="2">2</option>
    	<option value="3">3</option>
    </select> - Level 6
    <br />
    <select name="sel7" onchange="results (this)">
    	<option value="0">0</option>
    	<option value="1" selected="selected">1</option>
    	<option value="2">2</option>
    	<option value="3">3</option>
    </select> - Level 7
    <br />
    <select name="sel8" onchange="results (this)">
    	<option value="0">0</option>
    	<option value="1" selected="selected">1</option>
    	<option value="2">2</option>
    	<option value="3">3</option>
    </select> - Level 8
    <br />
    <select name="sel9" onchange="results (this)">
    	<option value="0">0</option>
    	<option value="1" selected="selected">1</option>
    	<option value="2">2</option>
    	<option value="3">3</option>
    </select> - Level 9
    <br />
    <select name="sel10" onchange="results (this)">
    	<option value="0">0</option>
    	<option value="1" selected="selected">1</option>
    	<option value="2">2</option>
    	<option value="3">3</option>
    </select> - Level 10
    <br />
    <div id="result"></div>
    </form>
    </BODY>
    </HTML>
    Ian Anderson
    www.siteguru.co.uk

  7. #7
    if ($zee == "Guru") { $zee--;}
    Join Date
    Nov 2005
    Location
    Karachi - Pakistan
    Posts
    1,134
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    thanks a lot Guru Ji.


Bookmarks

Posting Permissions

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