0

I tried to write codes of to display value in texbox but that value is displed based on selected value from combox that works fine, But what I want now is if I select ItemCode from combobox I need ItemPrice to be displayed in the textbox What I have now is if I select Item the value which is between <option>**Item Name**</option> is displayed in that textbox instead ItemPrice Below is my sample codes which runs fine

<script type="text/javascript" src="http://code.jquery.com/jquery-latest.min.js" /></script>

<span id="spanSegmentData">

    <?php
    require_once('connection.php');
    $queItem = mysqli_query($connect, "select * from oitm");

    echo "<select name=\"segment_id\" class=\"form-control\" id=\"segment_id\" STYLE=\"width: 300px\" >";
    echo "<option value=\"\" selected=\"selected\">Select a product</option>";

    while ($rowStockIn = mysqli_fetch_array($queItem)) {
        $ItemCode2 = $rowStockIn['ItemCode'];
        $ItemName2 = $rowStockIn['ItemName'];
        $ItemPrice2 = $rowStockIn['ItemPrice'];

        echo "<option value=\"$ItemCode2\">$ItemCode2 $ItemName2</option>";
    }
    echo "</select>";
    ?>

</span>

<span id="dt_title"> <input id="title" name="title" type="text" value="<?php echo "$ItemPrice2";?>" data-title="MB" style="width:300px" readonly> </span>

<script>
    $("#segment_id").change(function () {
        var id = $(this).val(); 
        $("#title").val($("#segment_id option:selected").text());
    });
</script>

Sample of my form I want to allow all rows to display value in textbox based on value selected in combobox Please anyone can help me to display that ItemPrice in the textbox

saulotoledo
  • 1,737
  • 3
  • 19
  • 36
Schadro
  • 63
  • 6

2 Answers2

0

1-For multiple row use class instead of id. add class 'segment_id' in select box and 'title' in text box which is use to display the price in row.

2- Add the 'itemprice' value in option with data attribute itemprice.

3- In jQuery on change get the selected data attr value and add in text box of closest row.

like.

    <option value=\"$ItemCode2\" data-itemprice = \"$ItemPrice2\">
        $ItemCode2 $ItemName2
    </option>

In jQuery get the data attr value and add in text box of closest row.

like

 $(document).ready(function(){
    $(".segment_id").on('change', function () {
        var id = $(this).val(); 
        var itemprice = $('option:selected',this).data('itemprice');
        $(this).closest('tr').find(".title").val(itemprice);
    });
});

DEMO

Shivendra Singh
  • 2,986
  • 1
  • 11
  • 11
  • Thank you so much my friend Shivendra, it works fine. let me ask the last question. Actually my file has more than one rows so it means I use loop and array in my file, what can I change in the script in order to allow multi rows to auto display that itemprice? thank you – Schadro Apr 26 '20 at 15:02
  • Glad to help you. How you are displaying the form element data is row, If you add that code in question. It will be more clear. – Shivendra Singh Apr 26 '20 at 19:52
  • I edited the codes you can check, I want to display values in the textboxes – Schadro Apr 26 '20 at 21:17
  • I update the ans, please check – Shivendra Singh Apr 26 '20 at 22:12
0
echo "<option value=\"$ItemCode2-$ItemPrice2\">$ItemCode2 $ItemName2</option>";

send send also $ItemPrice2 form value with -.

in script :

 $("#segment_id").change(function () {
 var _this = $(this).val();
 var res = _this.split("-");
 var id = res[0];
 var price = res[1];

 console.log(price)
 $("#title").val(price);
Anik Anwar
  • 625
  • 5
  • 11