jquery - Doing calculations using javascript with select options? -


somebody please me javascript coding. building website using asp.net there multiple html select elements , selected option determines value of input box be, see link: http://codepen.io/anon/pen/evauc

i gonna have 67 dropdown nightmare code inefficient code.

please me write more efficient code these 2 selects , can rest myself.

cheers.

i split code in parts (i used jquery), though should still change function names , calculatevalue implementation make code more clear.

$(document).ready(function(){     initcalculation($('#keytechtextbox'),$("#dropdown_servervirtualisation"),$("#dropdown_desktopvirtualisation"));     //more can added here });  function initcalculation(inputfield,select1,select2){     select1.change(function(){ //this can done more generic        inputfield.val(calculatevalue(select1.val(),select2.val()).tofixed(0)+"%");     });     select2.change(function(){         inputfield.val(calculatevalue(select1.val(),select2.val()).tofixed(0)+"%");     }); }  function calculatevalue(firstopt,secondopt){ //more abstract function name please :d     //you should optimize this.. - did     var sv_value = 10;     var sv1 =0;     var sv2 = sv_value;     var dv1 =0;     var dv2 = dv_value;     if (firstopt === "g") {         sv1 = sv_value;     }     if (firstopt === "o") {         sv1 = sv_value * 0.5;     }     if (firstopt === "a") {         sv1 = sv_value * 0.3;     }     if (firstopt === "r") {         sv1 = 0;     } else if (firstopt === "u") {         sv1 = 0;     }     if (secondopt === "n") {         dv2 = 0;     }     if (secondopt === "g") {         dv1 = dv_value;     }     if (secondopt === "o") {         dv1 = dv_value * 0.5;     }     if (secondopt === "a") {         dv1 = dv_value * 0.3;     }     var keytechtotal1 = sv1 + dv1;     var keytechtotal2 = sv2 + dv2;     return (keytechtotal1) / (keytechtotal2) * 100; }

below show more generic javascript solution

change min , max attributes each option in html , there start calculating.

you can genericly insert data min , max attributes in .net

<input class="textbox" runat="server" type="text" id="keytechtextbox" readonly="true" /> <select runat="server" id="dropdown_servervirtualisation" onchange="keytechadoption()">     <option class="lightgrey" value="n" data-min="0" data-max="1">n</option>     <option class="green" value="g"  data-min="0" data-max="1">g</option>     <option class="orange" value="o" data-min="0" data-max="1">o</option>     <option class="yellow" value="a" data-min="0" data-max="1">a</option>     <option selected="selected" class="red" value="r" data-min="0" data-max="1">r</option>     <option class="purple" value="u" data-min="0" data-max="1">u</option> </select> <select runat="server" id="dropdown_desktopvirtualisation" onchange="keytechadoption()">     <option class="lightgrey" value="n" data-min="0" data-max="1">n</option>     <option class="green" value="g" data-min="0" data-max="1">g</option>     <option class="orange" value="o" data-min="0" data-max="1">o</option>     <option class="yellow" value="a" data-min="0" data-max="1">a</option>     <option selected="selected" class="red" value="r" data-min="0" data-max="1">r</option>     <option class="purple" value="u" data-min="0" data-max="1">u</option> </select>  <script type="text/javascript">     function initcalculation(inputfield,select1,select2){         opt1 = select1.find('option:selected');         opt2 = select2.find('option:selected');         select1.change(function(){ //this can done more generic             inputfield.val(calculatevalue(opt1,opt2).tofixed(0)+"%");         });         select2.change(function(){             inputfield.val(calculatevalue(opt1,opt2).tofixed(0)+"%");         });     }      function calculateoptions(el1,el2){         calculatevalue(el1.data('min'),el1.data('max'),el1.data('min'),el1.data('max'));     }      function calculatevalue(sv1,sv2,dv1,dv2){ //more abstract function name please :d         var keytechtotal1 = sv1 + dv1;         var keytechtotal2 = sv2 + dv2;         return (keytechtotal1) / (keytechtotal2) * 100;     } </script>

Comments

Post a Comment

Popular posts from this blog

Change php variable from jquery value using ajax (same page) -

what i'm trying this: i've php global variable $currentid , simple jquery script check if there "id" (page) in hash of url , if yes wanted give value $currentid . i've been reading lot , notice shall use ajax i'm not managing it. my code is: <script type="text/javascript"> $(document).ready(function(){ if (parent.location.hash != '' ) { var thecurrentid = parent.location.hash.split('#')[1]; $.ajax({ url: 'my.php', //current page type: 'post', data: {theid: thecurrentid }, datatype: 'json', success: function () { } }); } // code here }); </script> could me please? thank in advance. php server side language, meaning once has sent data browser, php variables , data cannot changed... however, using ajax, can send request php page , change data in dom based on result. consider th...
Read more

Pull out data related to my apps from Android Play Store and iOS App Store -

i want pull out data related apps (ratings, reviews, etc) google play store , apple app store ? how can accomplish ? i have found open source apis google mentioned not reliable. also there paid apis (e.g. appfigures) available. has idea how able pull data these play stores ?? i looking direction on how can accomplish this. can suggest ? we (appfigures) have been working on developing infrastructure give ability reviews , bunch of other data points major app stores several years :] we make available via our api though may want check out.
Read more

How can I fetch data from a web server in an android application? -

i want retrieve data web server in android application, , don't know begin. should use web services? i recommend these tutorials: connect android php , mysql , json in android , php , mysqli i used these tutorials , managed trying working without difficulty. between them describe each step in how attempting @ each stage, android application, database , web server side , has information included can process , use received information the thing add connect android php , mysql tutorial makes use of mysql_ in php deprecated. better use mysqli why included third link. the basic outline of want this: 1) in android app make request server php script using class this: import java.io.bufferedreader; import java.io.ioexception; import java.io.inputstream; import java.io.inputstreamreader; import java.io.unsupportedencodingexception; import java.util.list; import org.apache.http.httpentity; import org.apache.http.httpresponse; import org.apache.http.namevaluepair...
Read more