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

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

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);
    });
    
    本回答被题主选为最佳回答 , 对您是否有帮助呢?
    评论

    报告相同问题?

    悬赏问题

    • ¥20 C语言字符串不区分大小写字典排序相关问题
    • ¥15 关于#python#的问题:我希望通过逆向技术爬取1688搜索页下滑加载的数据
    • ¥15 学习C++过程中遇到的问题
    • ¥15 关于Linux的终端里,模拟实现一个带口令保护的屏保程序遇到的输入输出的问题!(语言-c语言)
    • ¥15 学习C++过程中遇到的问题
    • ¥15 请问,这个嵌入式Linux系统怎么分析,crc检验区域在哪
    • ¥15 二分类改为多分类问题
    • ¥15 Unity微信小游戏上调用ReadPixels()方法报错
    • ¥15 如何通过求后验分布求得样本中属于两种物种其中一种的概率?
    • ¥15 q从常量变成sin函数,怎么改写python代码?