PHP + Jquery Change Value of Textbox according to two Dropdown

Question

I try to update text box value according to 2 dropdown. 1 drop down contain price1 and other drop down contain price 2, now I want that when user select price from both drop down then textbox display like that "price1 + price2 = total" How can I marge both value in single textbox value ? my price comes from database. Here is FIDDLE

PHP CODE

 <div class="three columns">
                    <div class="picker">
                        <select name="city" required>
                        <option value="" disabled>Select</option>
                            <?php 
                            $result = mysqli_query($con,"SELECT * FROM area");
                            while($row = mysqli_fetch_array($result))
                            {
                            ?>
                                <option value="New"><?php echo $row['city']."( $ ".$row['area'].")";; ?></option>
                            <?php } ?>
                        </select>
                    </div>
                </div>
                <div class="four columns">
                <div class="picker">
                    <select name="position" required>

                        <?php 
                            $result = mysqli_query($con,"SELECT * FROM pricing");
                            while($row = mysqli_fetch_array($result))
                        {
                        ?>
                            <option value="<?php echo $row['position']; ?>"><?php echo $row['position']."( $ ".$row['price'].")"; ?></option>
                        <?php } ?>
                    </select>
                </div>
            </div>
            <div class="row">
            <div class="two columns">
                Total
            </div>
            <div class="ten columns">
                <div class="field">
                  <input class="input" type="total" id="total" placeholder="" name="total" disabled/>
                </div>
            </div>

        </div>

Ehsan Sajjad · Accepted Answer · 2014-05-26 07:57:30Z

1

add a class on both combo and write one event this way:

$('.combo').change(function() {
    $('#firstvalue').val(parseInt($('#combo').val()) +parseInt($('#combo1').val()));
});

FIDDLE DEMO

or you can do this way:

$('.combo').change(function() {
    $('#firstvalue').val($('#combo').val() +"+"+$('#combo1').val()+"=");
    $('#firstvalue1').val(parseInt($('#combo').val()) +parseInt($('#combo1').val()));
});

SECOND DEMO

answered May 26, 2014 at 7:57

Ehsan Sajjad

62.6k16 gold badges112 silver badges171 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

rAm · Accepted Answer · 2014-05-26 08:03:37Z

0

use this..

$(document).ready(function() {

$('.combo').change(function() {
    $('#firstvalue').val(parseInt($('#combo').val()) +parseInt($('#combo1').val()));
});


$('#combo1').change(function() {
    $('#firstvalue1').val($('#combo1').val());
});
});

answered May 26, 2014 at 8:03

rAm

3093 silver badges19 bronze badges

Comments

Community · Accepted Answer · 2020-06-20 09:12:55Z

0

you can do it by using variables:

if you wanted to sum of two dropdown options then you have to give integer value of the seond dropdown not the string(like a3,a4 should be 3,4). see demo html.

 $(document).ready(function() {
    price1=0;
    price2 =0;
    $('#combo').change(function() {
          price1= this.value;
          $('#firstvalue').val(parseInt(price1)+parseInt(price2));

    });


  $('#combo1').change(function() {
    price2 = this.value;
    $('#firstvalue').val(parseInt(price1)+parseInt(price2));
  });
});

demo

edited Jun 20, 2020 at 9:12

CommunityBot

11 silver badge

answered May 26, 2014 at 7:57

Awlad Liton

9,3513 gold badges30 silver badges53 bronze badges

1 Comment

Shivam Pandya Over a year ago

Hi, that's what I want, but how can I add addition ? like if value 1 is "5" and second value is "12" then result in textbox is like 5 + 12 = 17

Collectives™ on Stack Overflow

PHP + Jquery Change Value of Textbox according to two Dropdown

3 Answers 3

Comments

Comments

demo

1 Comment

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

Comments

Comments

1 Comment

Your Answer

Sign up or log in

Post as a guest

Linked

Related