javascript - How to get the values of multiple select box and display the result in textbox? -


i have dropdown list of items,each item holding each price. once selecting items,its total price populated in textbox. dropdown-

   <select name="treatment[]" class="col-sm-12 country" id="" multiple="multiple">            <option value="">--select--</option>        <?php foreach($treatment $treatments) { ?>          <option value="<?php echo $treatments->treatment_name ?>"><?php echo $treatments->treatment_name ?></option>        <?php }?>                          </select> 

i trying using ajax,but lost.anyone can me out?thanks in advance.

each item holding each price

if price stored item in same table, need add data attributes option additional data. if not better joined it in codeigniter controller or model link price items. here example can show :

supposed have html structure :

<select name="treatment[]" class="col-sm-12 country" id="" multiple="multiple">  // line of code loop php  // see data-price attribute store price inside  // later can referencing attribute  <option value="fish" data-price="200">fish</option>  <option value="chicken" data-price="500">chicken</option> </select> // place display total <input type="text" id="total" />  

and here jquery code sum selected items :

$('.country').click(function () {   var price = 0;    $('option:selected', $(this)).each(function () {      //console.log($(this).data('price'));      // sum price selected items      price += $(this).data('price');   });   $('#total').val(price); }); 

demo

updated

if using inline javascript onchange, need send reference function want call :

in html part change : onchange="update_price(this)", , js follow :

function update_price(e) {                    // ^ add  //$('#treatment').on('change',function () { comment    var price = 0;                             $('option:selected', $(e)).each(function() {                       // ^ add     console.log($(this).data('pricetag'));     // sum price selected items     price += $(this).data('pricetag');    });   $('#total').val(price); //}); comment } 

Comments

Popular posts from this blog

java - UnknownEntityTypeException: Unable to locate persister (Hibernate 5.0) -

python - ValueError: empty vocabulary; perhaps the documents only contain stop words -

ubuntu - collect2: fatal error: ld terminated with signal 9 [Killed] -