具有JavaScript计算的表单发送丢失的数据(仅在某些情况下) - javascript

我的网站上有下面的表格，该表格使用下面的Javascript代码进行实时计算并通过PHP发送数据。

该表格可以正常工作，并且在大多数情况下可以成功发送计算出的数字。但是有时（可能是5个提交中的1个）缺少值，例如：

花卉：
大小：50
价格：MRP 175.00
数量：5
升：0.250 –很好！

通常，以上内容正确如下：

花卉：
大小：50
价格：MRP 175.00
数量：5
升：0.000 –这是错误的和丢失的！

如果在用户的浏览器中禁用了JavaScript，会是这种情况吗？

HTML代码：– LINK FOR HTML CODE

JAVASCRIPT代码：

    function calculate() {

/* FLOWERS */   
        var flowersSize = flsz.options[flsz.selectedIndex].value;
        if (flowersSize == 50) {
            flpr.value = 175;
            flowersPrice = parseFloat(Math.round(175 * 100) / 100).toFixed(2);
            flpr.value = "MRP"+" "+flowersPrice;            
        } else if (flowersSize == 200) {
            flpr.value = 599;
            flowersPrice = parseFloat(Math.round(599 * 100) / 100).toFixed(2);
            flpr.value = "MRP"+" "+flowersPrice.toString().replace(/,/g, "").replace(/\B(?=(\d{3})+(?!\d))/g, ",");         
        } else if (flowersSize == 500) {
            flpr.value = 1299;
            flowersPrice = parseFloat(Math.round(1299 * 100) / 100).toFixed(2);
            flpr.value = "MRP"+" "+flowersPrice.toString().replace(/,/g, "").replace(/\B(?=(\d{3})+(?!\d))/g, ",");         
        } else if (flowersSize == 1000) {
            flpr.value = 2399;
            flowersPrice = parseFloat(Math.round(2399 * 100) / 100).toFixed(2);
            flpr.value = "MRP"+" "+flowersPrice.toString().replace(/,/g, "").replace(/\B(?=(\d{3})+(?!\d))/g, ",");         
        } else if (flowersSize == 5000) {
            flpr.value = 10999;
            flowersPrice = parseFloat(Math.round(10999 * 100) / 100).toFixed(2);
            flpr.value = "MRP"+" "+flowersPrice.toString().replace(/,/g, "").replace(/\B(?=(\d{3})+(?!\d))/g, ",");
        }

/* CEREALS */
        var cerealsSize = cesz.options[cesz.selectedIndex].value;
        if (cerealsSize == 50) {
            cepr.value = 199;
            cerealsPrice = parseFloat(Math.round(199 * 100) / 100).toFixed(2);
            cepr.value = "MRP"+" "+cerealsPrice;            
        } else if (cerealsSize == 200) {
            cepr.value = 699;
            cerealsPrice = parseFloat(Math.round(699 * 100) / 100).toFixed(2);
            cepr.value = "MRP"+" "+cerealsPrice;            
        } else if (cerealsSize == 500) {
            cepr.value = 1599;
            cerealsPrice = parseFloat(Math.round(1599 * 100) / 100).toFixed(2);
            cepr.value = "MRP"+" "+cerealsPrice.toString().replace(/,/g, "").replace(/\B(?=(\d{3})+(?!\d))/g, ",");         
        } else if (cerealsSize == 1000) {
            cepr.value = 2899;
            cerealsPrice = parseFloat(Math.round(2899 * 100) / 100).toFixed(2);
            cepr.value = "MRP"+" "+cerealsPrice.toString().replace(/,/g, "").replace(/\B(?=(\d{3})+(?!\d))/g, ",");     
        } else if (cerealsSize == 5000) {
            cepr.value = 12999;
            cerealsPrice = parseFloat(Math.round(12999 * 100) / 100).toFixed(2);
            cepr.value = "MRP"+" "+cerealsPrice.toString().replace(/,/g, "").replace(/\B(?=(\d{3})+(?!\d))/g, ",");
        }

/* VEGETABLES */    
        var vegetablesSize = vesz.options[vesz.selectedIndex].value;
        if (vegetablesSize == 50) {
            vepr.value = 225;
            vegetablesPrice = parseFloat(Math.round(225 * 100) / 100).toFixed(2);
            vepr.value = "MRP"+" "+vegetablesPrice;     
        } else if (vegetablesSize == 200) {
            vepr.value = 799;
            vegetablesPrice = parseFloat(Math.round(799 * 100) / 100).toFixed(2);
            vepr.value = "MRP"+" "+vegetablesPrice;     
        } else if (vegetablesSize == 500) {
            vepr.value = 1799;
            vegetablesPrice = parseFloat(Math.round(1799 * 100) / 100).toFixed(2);
            vepr.value = "MRP"+" "+vegetablesPrice.toString().replace(/,/g, "").replace(/\B(?=(\d{3})+(?!\d))/g, ",");          
        } else if (vegetablesSize == 1000) {
            vepr.value = 3399;
            vegetablesPrice = parseFloat(Math.round(3399 * 100) / 100).toFixed(2);
            vepr.value = "MRP"+" "+vegetablesPrice.toString().replace(/,/g, "").replace(/\B(?=(\d{3})+(?!\d))/g, ",");          
        } else if (vegetablesSize == 5000) {
            vepr.value = 14999;
            vegetablesPrice = parseFloat(Math.round(14999 * 100) / 100).toFixed(2);
            vepr.value = "MRP"+" "+vegetablesPrice.toString().replace(/,/g, "").replace(/\B(?=(\d{3})+(?!\d))/g, ",");
        }

/* FRUITS */        
        var fruitsSize = frsz.options[frsz.selectedIndex].value;
        if (fruitsSize == 50) {
            frpr.value = 249;
            fruitsPrice = parseFloat(Math.round(249 * 100) / 100).toFixed(2);
            frpr.value = "MRP"+" "+fruitsPrice;         
        } else if (fruitsSize == 200) {
            frpr.value = 899;
            fruitsPrice = parseFloat(Math.round(899 * 100) / 100).toFixed(2);
            frpr.value = "MRP"+" "+fruitsPrice;         
        } else if (fruitsSize == 500) {
            frpr.value = 1999;
            fruitsPrice = parseFloat(Math.round(1999 * 100) / 100).toFixed(2);
            frpr.value = "MRP"+" "+fruitsPrice.toString().replace(/,/g, "").replace(/\B(?=(\d{3})+(?!\d))/g, ",");          
        } else if (fruitsSize == 1000) {
            frpr.value = 3699;
            fruitsPrice = parseFloat(Math.round(3699 * 100) / 100).toFixed(2);
            frpr.value = "MRP"+" "+fruitsPrice.toString().replace(/,/g, "").replace(/\B(?=(\d{3})+(?!\d))/g, ",");          
        } else if (fruitsSize == 5000) {
            frpr.value = 16999;
            fruitsPrice = parseFloat(Math.round(16999 * 100) / 100).toFixed(2);
            frpr.value = "MRP"+" "+fruitsPrice.toString().replace(/,/g, "").replace(/\B(?=(\d{3})+(?!\d))/g, ",");
        }

/* PLANTATIONS */       
        var plantationsSize = plsz.options[plsz.selectedIndex].value;
        if (plantationsSize == 50) {
            plpr.value = 275;
            plantationsPrice = parseFloat(Math.round(275 * 100) / 100).toFixed(2);
            plpr.value = "MRP"+" "+plantationsPrice;            
        } else if (plantationsSize == 200) {
            plpr.value = 999;
            plantationsPrice = parseFloat(Math.round(999 * 100) / 100).toFixed(2);
            plpr.value = "MRP"+" "+plantationsPrice;        
        } else if (plantationsSize == 500) {
            plpr.value = 2199;
            plantationsPrice = parseFloat(Math.round(2199 * 100) / 100).toFixed(2);
            plpr.value = "MRP"+" "+plantationsPrice.toString().replace(/,/g, "").replace(/\B(?=(\d{3})+(?!\d))/g, ",");         
        } else if (plantationsSize == 1000) {
            plpr.value = 3999;
            plantationsPrice = parseFloat(Math.round(3999 * 100) / 100).toFixed(2);
            plpr.value = "MRP"+" "+plantationsPrice.toString().replace(/,/g, "").replace(/\B(?=(\d{3})+(?!\d))/g, ",");         
        } else if (plantationsSize == 5000) {
            plpr.value = 17999;
            plantationsPrice = parseFloat(Math.round(17999 * 100) / 100).toFixed(2);
            plpr.value = "MRP"+" "+plantationsPrice.toString().replace(/,/g, "").replace(/\B(?=(\d{3})+(?!\d))/g, ",");
        }

        var flowersQuantity = flqt.options[flqt.selectedIndex].value;
        var cerealsQuantity = ceqt.options[ceqt.selectedIndex].value;
        var vegetablesQuantity = veqt.options[veqt.selectedIndex].value;
        var fruitsQuantity = frqt.options[frqt.selectedIndex].value;
        var plantationsQuantity = plqt.options[plqt.selectedIndex].value;

        var flowersLitres = flowersSize * flowersQuantity / 1000;
        var cerealsLitres = cerealsSize * cerealsQuantity / 1000;   
        var vegetablesLitres = vegetablesSize * vegetablesQuantity / 1000;
        var fruitsLitres = fruitsSize * fruitsQuantity / 1000;  
        var plantationsLitres = plantationsSize * plantationsQuantity / 1000;

        flowersLitres = parseFloat(Math.round(flowersLitres * 100) / 100).toFixed(3);
        cerealsLitres = parseFloat(Math.round(cerealsLitres * 100) / 100).toFixed(3);
        vegetablesLitres = parseFloat(Math.round(vegetablesLitres * 100) / 100).toFixed(3);
        fruitsLitres = parseFloat(Math.round(fruitsLitres * 100) / 100).toFixed(3);
        plantationsLitres = parseFloat(Math.round(plantationsLitres * 100) / 100).toFixed(3);   

        fllt.value = flowersLitres;
        celt.value = cerealsLitres;
        velt.value = vegetablesLitres;
        frlt.value = fruitsLitres;
        pllt.value = plantationsLitres;

        var totalAmount =  flowersQuantity * flowersPrice + cerealsQuantity * cerealsPrice + vegetablesQuantity * vegetablesPrice + fruitsQuantity * fruitsPrice + plantationsQuantity * plantationsPrice;

        totalAmount = parseFloat(Math.round(totalAmount * 100) / 100).toFixed(2);

        tamt.value = "MRP"+" "+totalAmount.toString().replace(/,/g, "").replace(/\B(?=(\d{3})+(?!\d))/g, ",");
}   

PHP代码：

    <?php

if(empty($_POST['name']) || empty($_POST['address'])) {
    die('Error: Missing variables');
}

$name=$_POST['name'];
$mobile=$_POST['mobile'];
$telephone=$_POST['telephone'];
$email=$_POST['email'];
$address=$_POST['address'];
$state=$_POST['state'];
$city=$_POST['city'];
$pincode=$_POST['pincode'];
$total_amount=$_POST['total_amount'];

$flowers_size=$_POST['flowers_size'];
$flowers_price=$_POST['flowers_price'];
$flowers_quantity=$_POST['flowers_quantity'];
$flowers_litres=$_POST['flowers_litres'];

$cereals_size=$_POST['cereals_size'];
$cereals_price=$_POST['cereals_price'];
$cereals_quantity=$_POST['cereals_quantity'];
$cereals_litres=$_POST['cereals_litres'];

$vegetables_size=$_POST['vegetables_size'];
$vegetables_price=$_POST['vegetables_price'];
$vegetables_quantity=$_POST['vegetables_quantity'];
$vegetables_litres=$_POST['vegetables_litres'];

$fruits_size=$_POST['fruits_size'];
$fruits_price=$_POST['fruits_price'];
$fruits_quantity=$_POST['fruits_quantity'];
$fruits_litres=$_POST['fruits_litres'];

$plantations_size=$_POST['plantations_size'];
$plantations_price=$_POST['plantations_price'];
$plantations_quantity=$_POST['plantations_quantity'];
$plantations_litres=$_POST['plantations_litres'];


$ip=$_SERVER['REMOTE_ADDR'];

$to="[email protected]";

$headers = "MIME-Version: 1.0\r\n";  
$headers .= "Content-type: text/plain; charset=utf-8\r\n";  
$headers = 'From: '.$_POST['name'].' <'.$_POST['email'].'>';

    'X-Mailer: PHP/' . phpversion();

$subject='Order from '.$name."\n\n\n";

$body.="<h2>DETAILS:</h2>"."";

$body.='Customer Name: <b>'.$name."</b><br>\n";
$body.='Mobile No: <b>'.$mobile."</b><br>\n";
$body.='Telephone No: <b>'.$telephone."</b><br>\n";
$body.='Email Address: <b>'.$email."</b><br>\n";
$body.='Address: <b>'.$address."</b><br>\n";
$body.='State: <b>'.$state."</b><br>\n";
$body.='City: <b>'.$city."</b><br>\n";
$body.='Pin code: <b>'.$pincode."</b><br><br>\n\n";

$body.="<h2>VARIANTS:</h2>"."";

$body.="<b>FLOWERS:</b>"."<br>\n";
$body.='Size: '.$flowers_size."<br>\n";
$body.='Price: '.$flowers_price."<br>\n";
$body.='Quantity: '.$flowers_quantity."<br>\n";
$body.='litres: '.$flowers_litres."<br><br>\n\n";

$body.="<b>CEREALS:</b>"."<br>\n";
$body.='Size: '.$cereals_size."<br>\n";
$body.='Price: '.$cereals_price."<br>\n";
$body.='Quantity: '.$cereals_quantity."<br>\n";
$body.='Litres: '.$cereals_litres."<br><br>\n\n";

$body.="<b>VEGETABLES:</b>"."<br>\n";
$body.='Size: '.$vegetables_size."<br>\n";
$body.='Price: '.$vegetables_price."<br>\n";
$body.='Quantity: '.$vegetables_quantity."<br>\n";
$body.='Litres: '.$vegetables_litres."<br><br>\n\n";

$body.="<b>FRUITS:</b>"."<br>\n";
$body.='Size: '.$fruits_size."<br>\n";
$body.='Price: '.$fruits_price."<br>\n";
$body.='Quantity: '.$fruits_quantity."<br>\n";
$body.='Litres: '.$fruits_litres."<br><br>\n\n";

$body.="<b>PLANTATIONS:</b>"."<br>\n";
$body.='Size: '.$plantations_size."<br>\n";
$body.='Price: '.$plantations_price."<br>\n";
$body.='Quantity: '.$plantations_quantity."<br>\n";
$body.='Litres: '.$plantations_litres."<br><br>\n\n";

$body.="<h2>AMOUNT:</h2>"."";
$body.='Total Price: <b>'.$total_amount."</b><br><br><br><br>\n\n\n\n";
$body.='IP address of the submitter: '."\n".$ip."\n";

$headers  = "From: $email <$email>\r\n";
$headers .= "MIME-Version: 1.0\r\n";
$headers .= "Content-type: text/html; charset=iso-8859-1\r\n";
$headers .= 'bcc: [email protected]' . "\r\n";

if(mail($to, $subject, $body, $headers)) {
    header("Location: http://www.drearth.in/confirmation.html"); 
} else {
    echo "Something has gone wrong! Please try again!"; 
}

?>

参考方案

我对您原来的javascript函数进行了一些重构-我认为它是正确的，但是您（如果愿意）可能需要仔细检查以确保它是正确的。要经常解决空白值的问题。...如果未启用javascript，则不应允许提交表单-为此，实际上使用javascript提交表单，而不是简单的提交按钮。另外，您可能想重新计算php中的值并检查它们是否匹配？

/* to format a number with correct separators ~ comma */
function format_thousands(n){
    var s=(''+n).split('.');
    s[0]=s[0].split('').reverse().join('').match(/\d{1,3}/gi).join(',').split('').reverse().join('');
    return(s.join('.'));
}

/* utility to get the value from select menu */
function gsv(n){
    var n=typeof(n)=='object' && n.nodeType==1 ? n : document.getElementById(n);
    return n.options[n.selectedIndex].value;
}

function calculate() {
    var matrix={
        flowers:{
            size:'flsz',
            qty:'flqt',
            txt:'flpr',
            ltr:'fllt',
            values:{50:175,200:599,500:1299,1000:2399,5000:10999}
        },
        cereals:{
            size:'cesz',
            qty:'ceqt',
            txt:'cepr',
            ltr:'celt',
            values:{50:199,200:699,500:1599,1000:2899,5000:12999},
        },
        vegetables:{
            size:'vesz',
            qty:'veqt',
            txt:'vepr',
            ltr:'velt',
            values:{50:225,200:799,500:1799,1000:3399,5000:14999}
        },
        fruits:{
            size:'frsz',
            qty:'frqt',
            txt:'frpr',
            ltr:'frlt',
            values:{50:249,200:899,500:1999,1000:3699,5000:16999}
        },
        plantations:{
            size:'plsz',
            qty:'plqt',
            txt:'plpr',
            ltr:'pllt',
            values:{50:275,200:999,500:2199,1000:3999,5000:17999}
        }
    };
    var totals={total:0};

    for( var glitch in matrix ){
        var keys=Object.keys( matrix[ glitch ] );
        var size=gsv( matrix[ glitch ].size );
        var qty=gsv( matrix[ glitch ].qty );
        var value=matrix[ glitch ].values[ size ];
        var price = parseFloat( Math.round( value * 100 ) / 100 ).toFixed(2);
        var litres = parseFloat( Math.round( ( ( size * qty ) / 1000 ) * 100 ) / 100 ).toFixed(3);

        totals[ glitch ]={ litres:litres, price:price, mrp:'MRP '+price.toString().replace(/,/g, "").replace(/\B(?=(\d{3})+(?!\d))/g, ",") };
        totals.total += qty * price;

        document.getElementById( matrix[ glitch ].txt ).value=totals[ glitch ].mrp;
        document.getElementById( matrix[ glitch ].ltr ).value=litres;
    }
    totals.total=parseFloat( Math.round( totals.total * 100 ) / 100 ).toFixed(2);
    totals.totalmrp = 'MRP ' + totals.total.toString().replace(/,/g, "").replace(/\B(?=(\d{3})+(?!\d))/g, ",");

    document.getElementById('tamt').value=totals.totalmrp;
    /* do something with result ? */
    return totals;
}

您可能希望更改表单，以便仅在实际提交表单时才将操作设置为正确的php脚本。提交前，通过javascript更改了操作。

<form autocomplete="off" class="form" name="form" method="post" action="order.html" onsubmit="return submitform(event)">

    <!-- lots of other form content -->

    <input type='submit' value='SUBMIT' tabindex='29' class='button' id='subform' name='subform'>
</form>

仅当函数submitform返回true时，才进行提交

function submitform(event){
    /* example only - add own checks */
    var checks_ok=false;
    var form=typeof(event.target)!='undefined' ? event.target : event.srcElement;
    /* Perform various checks on form fields to ensure fields are not empty, or contain invalid values etc */

    /* if ok, set checks_ok to true */
    checks_ok=true;

    if( checks_ok ){
        form.setAttribute('action','/php/order-form.php');
        return true;
    }

    return false;
}

我的版本：

function submitform(event){
    var checks_ok=false;
    var flq=document.getElementById("flqt").value;
    var ceq=document.getElementById("ceqt").value;
    var veq=document.getElementById("veqt").value;
    var frq=document.getElementById("frqt").value;
    var plq=document.getElementById("plqt").value;
    var quantity=flq+ceq+veq+frq+plq;

    if(quantity==0){
        alert("Please select quantity");
        checks_ok=false;
        return false;
    } 
    if(checks_ok=true){
        form.setAttribute('action','http://www.drearth.in/php/order-form-test.php');
        return true;
    }
}

使用php重新加载内容 - javascript

在对网站进行编程时，我以前使用过此代码，它可以完美工作，但是现在当我想使用一些Flash部件时，每次单击链接时，它都会重新加载所有网站。源代码： <!DOCTYPE html> <html> <head> <title>Hot King Staff</title> <meta charset=…

用jQuery填充模式形式 - javascript

我正在将订单表从数据库绘制到datatables（jquery插件）中。我要在每笔最后一笔交易或每笔交易中增加付款。问题是，如何获取单击添加付款按钮以添加付款的行的订单ID。其次，当点击addpayment时，它会弹出一个带有字段或订单号的模态表单。我想用在td中找到的订单ID填充该字段，并使其不可编辑或隐藏，但在提交模态表单时将其发布到服务器。表格和模式表…

保留文本区域的数据或值，然后选择输入 - javascript

通过$ _POST提交表单时，输入文件值仍然保留。像这样： if($_POST){ $error = false; if(!$post['price']){ $error = true; $error_note['price'] = "*Should not be empty"; } if($err…

带有AJAX和DOM处理API的下拉菜单 - javascript

我从API获取数据，但未在我的下拉菜单中显示。如果我用?act=showprovince回显，结果就在那里。example.html<head> <link rel="stylesheet" type="text/css" href="css/normalize.css"> …

尽管刷新，jQuery格式仍未应用于Ajax数据 - javascript

我正在通过GET响应消息从服务器（php文件）的可折叠内部加载列表视图。但是，尽管刷新了jQuery元素，但jQuery格式并未应用于添加的HTML。我的页面在这里：http://i.cs.hku.hk/~hsbashir/Project_Work/events/events.htmlHTML代码（仅相关代码）<script> lastRecor…