个人中心
gpt4 book ai didi

jquery - 从 Invoice 中的数据库中获取值

转载 作者：行者123 更新时间：2023-11-28 03:16:11 26 4
gpt4 key购买 nike

我正在尝试开具发票，在产品中我使用了自动完成功能从数据库中获取产品名称和价格。

第一行很容易，但第二行根本不起作用。

索引.php

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<script src="js/jquery-1.10.2.min.js"></script>
<script src="js/jquery-ui-1.10.4.custom.min.js" type="text/livescript"></script>
<link rel="stylesheet" href="syle/style.css" />
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"   type="text/javascript"></script>
<script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.1/jquery-ui.min.js" type="text/javascript"></script>
 <script type="text/javascript" src="js/main.js"></script>
<title>Untitled Document</title>
  <script>
  $(document).ready(function(){
var ac_config = {
    source: "autosuggest.php",
    select: function(event, ui){
        $(".menu_name").val(ui.item.menu_name);
        $(".menu_code").val(ui.item.menu_code);
        $(".menu_price").val(ui.item.menu_price);

        },
        minLength:1
        };
        $(".street").autocomplete(ac_config);
});

</script>
</head>

<body>
<form action="action.php" method="POST">

<table>
<tr>
<td>Invoice Number</td>
<td><input type="text" name="inv_no" id="inv_no" /></td>
</tr>
<tr>
<td>Invoice Date </td>
<td><input type="date" name="inv_date" id="inv_date" /></td>
</tr>
</table>

<table border="1" style="border-collapse:collapse">
<thead>
<tr>
<th>No</th>
<th>Product Name</th>
<th>Quantity</th>
<th>Price</th>
<th>Amount</th>
</tr>
</thead>
<tbody id="inv_detail">
<tr>
<th><b class="no">1</b></th>
<td><input type="text" class="street" class="menu_name"  name="p_name[]"  /></td>
<td><input type="text" name="qty[]" class="qty" /></td>
<td><input type="text" name="price[]" class="menu_price"  /></td>
<td align="right"><b class="amt"> </b></td>

</tr>
</tbody>
<tfoot>
<th colspan="6"><b class="total" value="add">0</b></th>
</tfoot>

</table>

</form>
<input type="button" id="click"  value="add"/>
</body>
</html>
<script type="text/javascript">
$.datepicker.setDefaults({
    changeMonth:true,
    changeYear:true,
    dateFormat:'yy/mm//dd'

    });
    $(function(){

    $('#click').click(function(){
       addnewrow();

    });

    $('#inv_detail').delegate('.p_name','change',function(){
        var p_name = $('.p_name:last').val();
        if(p_name !='')
        {
            addnewrow();
            }
            if($(this).val()== '' && $('.p_name').length > 1 && p_name == '')
            {
                $('.p_name:last').parent().parent().remove();   
                total();
            }

        });

        $('#inv_detail').delegate('.qty,.menu_price',function(){
            var tr = $(this).parent().parent();
            var qty = tr.find('.qty').val()-0;
            var menu_price = tr.find('.menu_price').val()-0;
            var amt = qty * menu_price;
            tr.find('.amt').html(amt);
            total();
            });

    $('input[type=date]').datepicker(); 
    $('body').delegate('input[type=date]',click,function(e)
    {
        $(this).datepicker();

        });



        function addnewrow()
        {
            var n = ($('#inv_detail tr').length-0)+1;
            var row ='<tr>'+
            '<th><b class="no">'+ n +'</b></th>'+   
            '<td><input type="text" name="p_name[]" class="menu_name"/></td>'+  
            '<td><input type="text" name="qty[]" class="qty"/></td>'+
            '<td><input type="text" name="price[]" class="menu_price"/></td>'+
            '<td allign="right"><b class="amt"></b></td>'+
            '</tr>';
            $('#inv_detail').append(row);
            }


    });
    function total(){

             var gg=0;
             $('.amt').each(function(i,el){
                 var amt = $(this).html()-0;
                 gg += amt;

            });
        $('.total').html(gg);
        }
</script>

Action .php

<?php

$cn = mysql_connect('localhost','root','');
mysql_select_db('phpinvoice',$cn);
//if(isset($_post['submit']))
//{
    echo $sql="INSERT INTO inv (inv_no,inv_date)VALUES('{$_POST['inv_no']}','{$_POST['inv_date']}')";

$query=mysql_query($sql);
$id = mysql_insert_id();
$_p_name =  $_POST['p_name'];
$_qty =  $_POST['qty'];
$_price =  $_POST['price'];

for($i = 0;$i < count($_p_name);$i++)
{
    echo $sql1="INSERT INTO inv_detail SET
 inv_id='{$id}',
 p_name='$_p_name[$i]',
 qty='$_qty[$i]',
 price='$_price[$i]',



 ";
 $qyer=mysql_query($sql1);
header('Location:http://www.pingbd.com');
}


//}


?>

最佳答案

Javascript 和 JQuery 都使用事件处理程序。为了让浏览器知道要对您要处理的任何用户操作执行哪个函数，您需要绑定(bind)一个事件处理程序。

在 JQuery 的情况下，事件的绑定(bind)在您的情况下也是在执行 javascript 时完成的，在本例中是在运行时。在初始事件绑定(bind)之后添加的任何项目都不会附加事件处理程序，因此永远不会执行函数。

要解决此问题，您需要将相同的事件处理程序添加到您添加到 html 的任何新元素，您希望从中运行函数。

示例 1(jsfiddle(DOT)net/jLrcx2q6/):

<button class="button">Show alert</button>

$(document).ready(function(){
    $(".button").click(function(){
        alert("test");
    });
});

在此示例(示例 1)中，当页面加载时，点击事件“绑定(bind)”到按钮，因此当用户单击它时，会弹出带有文本“test”的警告。

示例 2 ( http://jsfiddle.net/ceney0jg/ ):

<div id="example-wrapper">
    <button class="button">Show alert</button>
</div> 

$(document).ready(function(){
    $(".button").click(function(){
        alert("test");
        $("#example-wrapper").append('<button class="button">Show alert</button>');
    });
});

在此示例中，当用户按下按钮时，将再次显示一个带有文本“test”的弹出窗口。但是，还会发生一个新按钮将添加到 div(example-wrapper)中。添加按钮后，没有事件处理程序被“绑定(bind)”，因此当用户按下按钮时不会发生任何事情。

示例 3 - 解决方案 (jsfiddle.net/p8q4mfmv/):

<div id="example-wrapper">
    <button class="button">Show alert</button>
</div> 

$(document).ready(function(){
    $(".button").click(function(){
        addButton()
    });
}); 

function addButton()
{
     alert("test");
     $("#example-wrapper").append('<button class="button">Show alert</button>');   

     $(".button").click(function(){
        addButton()
     });
}

在您的代码中，您有一个函数 addnewrow()。此函数添加一个新的表行。加载页面时，

$('#inv_detail').delegate('.p_name','change',function(){

向 p_name 添加事件处理程序。但是，在执行函数addnewrow() 之后，添加了一个新的表格行，但上面的事件处理程序从未绑定(bind)到新元素。因此，浏览器不会执行您希望执行的任何代码。

解决方案是绑定(bind)一个事件处理程序，例如:

function addnewrow()
{
    var n = ($('#inv_detail tr').length-0)+1;
    var row ='<tr>'+
    '<th><b class="no">'+ n +'</b></th>'+   
    '<td><input type="text" name="p_name[]" class="menu_name"/></td>'+  
    '<td><input type="text" name="qty[]" class="qty"/></td>'+
    '<td><input type="text" name="price[]" class="menu_price"/></td>'+
    '<td allign="right"><b class="amt"></b></td>'+
    '</tr>';
    $('#inv_detail').append(row);

    $('#inv_detail').delegate('.p_name','change',function(){
    var p_name = $('.p_name:last').val();
    if(p_name !='')
    {
        addnewrow();
        }
        if($(this).val()== '' && $('.p_name').length > 1 && p_name == '')
        {
            $('.p_name:last').parent().parent().remove();   
            total();
        }

    });

    $('#inv_detail').delegate('.qty,.menu_price',function(){
        var tr = $(this).parent().parent();
        var qty = tr.find('.qty').val()-0;
        var menu_price = tr.find('.menu_price').val()-0;
        var amt = qty * menu_price;
        tr.find('.amt').html(amt);
        total();
    });
}

这不是很好的代码，但我认为它可以工作。你最好使用 javascript 文件而不是内联 javascript 来使你的代码更具可读性和独立功能。

此外，在编写软件时，您应该始终尝试让函数做尽可能少的事情。在最好的情况下，一个函数只会有 1 个任务。

为了更好地理解这一点，我建议阅读 http://courses.cs.washington.edu/courses/cse403/96sp/coupling-cohesion.html

关于jquery - 从 Invoice 中的数据库中获取值，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/27615079/

26 4 0
文章推荐： html - 为什么内联 block 容器会导致滚动条自动溢出？
文章推荐： C++ 读取 int16_t(G++ 编译器)
文章推荐： javascript - 单击链接时无法将记录填充到 Bootstrap 模式
文章推荐： javascript - 落下的字母和方 block 之间的碰撞
行者123
个人简介

我是一名优秀的程序员,十分优秀！

滴滴打车优惠券免费领取
滴滴打车优惠券
全站热门文章
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com