如何修复代码以使函数正常工作

2024-04-19 13:46:52 发布

您现在位置：Python中文网/ 问答频道 /正文
2361 3

我正在得到一个django项目来修复代码中的错误，我可以知道这几行代码的问题是什么导致网页上的add和delete按钮不能正常工作吗？你知道吗

我试过修复代码中的一些拼写错误，但是仍然不起作用，所以我将代码改回原来的方式。你知道吗

{% extends "app/layout.html" %}

{% block content %}

<script>
    $(document).ready(function () {


        var i=1;
        $("#add_row").click(function(){
            $('#addr'+i).html("<td>"+ (i+1) +"</td><td><input 
                name='item_id' type='item_id' placeholder='Item ID' 
                class='form-control input-md'   /> </td><td><input  
                name='item_name' type='text' placeholder='Item Name'  
                class='form-control input-md'></td><td><input  
                name='description' type='text' placeholder='Description'  
                class='form-control input-md' ></td><td><input name='quantity' 
                type='text' placeholder='Quantity' class='form-control input- 
                md'  /> </td><td><input name='unit_price' type='text' 
                placeholder='Price Per Unit' class='form-control input-md'  /> 
                </td>");

                $('#tab_logic').append('<tr id="addr'+(i+1)+'"></tr>');
                i++; 

            });

        $("#delete_row").click(function(){
            if(i>1){
                $('#addr'+(i-1)).html('');
                i--;
            }
        });

    });
</script>

<div class="formpurchaseorder margintop" >

    <form class="purchaseordersubmission" 
          action="purchaserequisitionconfirmation" method="POST">
        {% csrf_token %}
        <div class="row margintop">
            <div class="col">
                <input type="text" class="form-control" name="purchase_requisition_id" value="{{purchase_requisition_id}}"  placeholder="Purchase Requisition ID" readonly>
            </div>
    <div class="col">
        <input type="text" class="form-control" name="person_id" id="person_id" value="{{person_id}}"placeholder="Person ID" readonly>
    </div>

        </div>

        <br/>

        <div class="row clearfix">
            <div class="col-md-12 column">
                <table class="table table-bordered table-hover" id="tab_logic">

                    <thead>
                        <tr >
                            <th class="text-center">#</th>
                            <th class="text-center">Item ID</th>
                            <th class="text-center">Item Name</th>
                            <th class="text-center">Description</th>
                            <th class="text-center">Quantity</th>
                            <th class="text-center">Price Per Unit</th>
                        </tr>
                    </thead>
                    <tbody name="item_rows">
                        <tr id='addr'>
                            <td>1</td>
                            <td> <input type="text" name='item_id' placeholder='Item id'  class="form-control" /> </td>
                            <td><input type="text" name="item_name"  placeholder='Item name' class="form-control" ></td>
                            <td><input type="text" name='description' placeholder='Description' class="form-control" /></td>
                            <td><input type="text" name='quantity' placeholder='Quantity'  class="form-control" /></td>
                            <td><input type="text" name='unit_price' placeholder='Price Per Unit'  class="form-control"  /></td>
                        </tr> 
                        <tr id='addr1'></tr>

                    </tbody>
                </table>
            </div>
        </div>
        <a id='add_row' class="pull-left btn btn-default">Add Item</a>
        <a id='delete_row' class="pull-right btn btn-default">Delete Item</a>

        <div class="margintop">
            <button type="submit" class="btn btn-success btn-square buttonsize">Submit</button>
            <a class="btn btn-danger btn-square buttonsize" href="/menu">Cancel</a>
        </div>


    </form>

</div>
{% endblock %}

Tags： textnamedivformidinputtypeitem
2条回答
网友
1楼 · 编辑于 2024-04-19 13:46:52

看起来您的脚本是在HTML完全呈现之前加载的，也许是jQuery。 试着把这个脚本部分放在<body>的末尾（最终在应用程序中）/布局.html)。 在jQuery实现之后。你知道吗

网友
2楼 · 编辑于 2024-04-19 13:46:52

像item_id这样的变量只有在您提交表单时才对您可用，然后您将被重定向到一个URL，其中包含所有发布在该URL上的变量。你知道吗

例如localhost:8000/index.html?item_id=xyz&item_name=abc&description=desc&quantity=12&unit_price=30

注意URL中的变量名及其值。只有在您提交表格后，此项才可用。你知道吗

因此，不要在add_row上添加事件侦听器，而是使用：

$('#formid').submit(function(e) {
// Add the rows here
});

PS:-如果您真的想这样做，那么您可以通过以下方式获得文本框值：

首先为输入文本框指定ID：

<input type="text" id='item_name_textbox' name='item_id' placeholder='Item id' class="form-control" /> </td>

var item_name = document.getElementById('item_name_textbox').value;

然后在函数中使用它。你知道吗

相关问题 更多 >

    编程相关推荐