doumaikuang4202 2015-06-09 12:05
浏览 84
已采纳

将选定单选按钮中的值传递到另一个输入

I currently have a data table, with data coming from the database as stated below:

<table id="vehicle" class="display" cellspacing="0" width="100%" style="text-align: center;">
    <thead>
        <tr>
            <th>Reg No</th>
            <th>Make</th>
            <th>Colour</th>
            <th>Chasis No</th>
            <th>Mileage</th>
            <th>Quantity</th>
            <th>Unit Price</th>
            <th>Actions</th>
        </tr>
    </thead>  
    <tbody>
        <?php
            $vquery = "SELECT * FROM vehicle ORDER BY arrival_date ASC"; // query the person
            $data = perform_query($db, $vquery);
            foreach ($data as $d) {
                $vid = $d['vid'];
                $regNumber = strtoupper($d['reg_no']);
                $model = ucfirst($d['make']);
                $unit_price = $d['purchase_price'];
                $colour = ucfirst($d['colour']);
                $vin_no = strtoupper($d['chasis_no']); ?>
                <tr>
                    <td><?php echo $regNumber; ?></td>
                    <td><?php echo $model; ?></td>
                    <td><?php echo $colour; ?></td>
                    <td><?php echo $vin_no; ?></td>
                    <td><input type="text" name="quantity" style="width: 100%;"></td>
                    <td>
                        <select name="">
                            <option selected>1</option>
                            <option>2</option>
                            <option>3</option>
                            <option>4</option>
                            <option>5</option>
                            <option>6</option>
                        </select>
                    </td>
                    <td>
                        <input type="text" id="unit_price" name="unit_price" value='<?php echo "£" . $unit_price; ?>' style="width: 100%;">
                    </td>
                    <td><input type="radio" name="selectedVehicle"/></td>
                </tr>
            <?php 
            }
        ?>
    </tbody>
</table>

Upon the user selecting the radio button stated above, the selected vehicle alongside the unit price should automatically copy into an input field in another div with a table below:

    <h4 class="panel-title">Payment Information</h4>
</div>
<div class="panel-body">
    <div class="table-responsive">
        <table class="pay-table table-bordered ">
            <tbody>
                <tr>
                    <td><font color='red'>Sub Total (*):</font></td>
                    <td><input type="text" id="sub_total" name="sub_total" style="width: 100%;" value="<?php echo $selected_vid  ?>"></td>
                </tr>
                <tr>
                    <td><font color='red'>Vehicle Reg NO (*):</font></td>
                    <td><input type="text" id="extras" name="extras" style="width: 100%;" readonly></td>
                </tr>

I have a script that goes through the radioboxes and check which is selected and it alerts the user with the selected vehicle reg no, however I want upon selecting a radio box it should copy the unit price into the Subtotal field.

<script>
    rdoBoxes = document.getElementsByName("selectedVehicle"); 
    for (var i = 0; i < rdoBoxes.length; i++) {
        var rdoBox = rdoBoxes[i];
        rdoBox.onclick = function() {
            var currentRow = this.parentNode.parentNode;
            var secondColumn = currentRow.getElementsByTagName("td")[0];

            alert("You have selected Vehicle Reg No: " + secondColumn.textContent );
        };
    } 
</script>

Any tips and help will be highly appreciated. Here is the JSfiddle http://jsfiddle.net/follypimpz/d5xsq1b5/

  • 写回答

1条回答 默认 最新

  • duanli4146 2015-06-09 12:47
    关注

    You can do as below:

    DEMO HERE

    $('input[type="radio"]').on('change',function(){
        var parent=$(this).parents('tr'); //get the parent tr
        var vehicleNo=parent.find('td:first').text(); //get the vehicle number which is first td
    
        var qty=parseInt(parent.find('td select option:selected').text()); //get the quantity
        var unitPrice=parseInt(parent.find('td:nth-child(7) input').val());//get the unitPrice
        var total=qty*unitPrice;//multiply the figures
    
        $('#sub_total').val(total);//assign it to respective contents
        $('#extras').val(vehicleNo);
    });
    
    本回答被题主选为最佳回答 , 对您是否有帮助呢?
    评论

报告相同问题?

悬赏问题

  • ¥15 一个主机电脑有两个显示器,当前有两个软件主体是网页html打包的exe程序,如何通过cmd命令bat同时打开软件一个在主屏幕显示,另外一个软件在2副屏幕上显示
  • ¥15 AE SDK插件开发,获取关键帧值得问题
  • ¥15 谁知道这个咋搞的吗,有偿
  • ¥20 基于spring boot、的scorm
  • ¥15 往复密封问题的两个问题
  • ¥15 DAC函数和STM32
  • ¥15 任务是接收数据并把数据写入DAC7311,这些代码能实现此功能吗
  • ¥15 分析FP -Growth代码运行内存太大而无法运行的原因
  • ¥20 qtcreat 使用msvc编译器开发软件运行时字体锯齿感严重
  • ¥15 为何显示keyerror fruit