使用描述和用于计算总计的数字发送下拉值

时间:2013-01-22 05:18:23

标签: javascript drop-down-menu

我有一个表单,我无法控制要编辑的php。我需要它,以便当它发送值时它发送项目的描述,但我需要值来添加总字段的价格。有没有办法设置,所以我可以发送项目的描述但仍然保持值为数字,所以它增加了总数?

        <div id="cid_7" class="form-input">
      <select class="form-dropdown validate[required]" onchange="code(1)" style="width:150px" id="input_7" name="q7_ticketOptions">
        <option>  </option>
        <option value="300"> VIP Floor Seats - $300.00 </option>
        <option value="40"> Section 101 Upper Level - $40.00 </option>
        <option value="60"> Section 101 Mid Level - $60.00 </option>
        <option value="150"> Section 101 Lower Level - $150.00 </option>
        <option value="40"> Section 102 Upper Level - $40.00 </option>
        <option value="60"> Section 102 Mid Level - $60.00 </option>
        <option value="150"> Section 102 Lower Level - $150.00 </option>
        <option value="40"> Section 103 Upper Level - $40.00 </option>
        <option value="60"> Section 103 Mid Level - $60.00 </option>
        <option value="150"> Section 103 Lower Level - $150.00 </option>
        <option value="20"> Section 104 Upper Level - $20.00 </option>
        <option value="60"> Section 104 Mid Level - $60.00 </option>
        <option value="20"> Section 107 Upper Level - $20.00 </option>
        <option value="60"> Section 107 Mid Level - $60.00 </option>
        <option value="40"> Section 108 Upper Level - $40.00 </option>
        <option value="60"> Section 108 Mid Level - $60.00 </option>
        <option value="150"> Section 108 Lower Level - $150.00 </option>
        <option value="40"> Section 109 Upper Level - $40.00 </option>
        <option value="60"> Section 109 Mid Level - $60.00 </option>
        <option value="150"> Section 109 Lower Level - $150.00 </option>
        <option value="40"> Section 110 Upper Level - $40.00 </option>
        <option value="60"> Section 110 Mid Level - $60.00 </option>
        <option value="150"> Section 110 Lower Level - $150.00 </option>
        <option value="40"> Section 111 Upper Level - $40.00 </option>
        <option value="60"> Section 111 Mid Level - $60.00 </option>
        <option value="150"> Section 111 Lower Level - $150.00 </option>
        <option value="40"> Section 112 Upper Level - $40.00 </option>
        <option value="60"> Section 112 Mid Level - $60.00 </option>
        <option value="150"> Section 112 Lower Level - $150.00 </option>
        <option value="20"> Section 113 Upper Level - $20.00 </option>
        <option value="60"> Section 113 Mid Level - $60.00 </option>
        <option value="40"> Section 114 Upper Level - $40.00 </option>
        <option value="60"> Section 114 Mid Level - $60.00 </option>
        <option value="40"> Section 115 Upper Level - $40.00 </option>
        <option value="60"> Section 115 Mid Level - $60.00 </option>
        <option value="20"> Section 116 Upper Level - $20.00 </option>
        <option value="60"> Section 116 Mid Level - $60.00 </option>
        <option value="40"> Section 117 Upper Level - $40.00 </option>
        <option value="60"> Section 117 Mid Level - $60.00 </option>
        <option value="150"> Section 117 Lower Level - $150.00 </option>
        <option value="40"> Section 118 Upper Level - $40.00 </option>
        <option value="60"> Section 118 Mid Level - $60.00 </option>
        <option value="150"> Section 118 Lower Level - $150.00 </option>
      </select>
    </div>
  </li>
  <li class="form-line" id="id_23">
    <label class="form-label-left" id="label_23" for="input_23"> Quantity<span class="form-required">*</span></label>
    <div id="cid_23" class="form-input">
      <select class="form-dropdown validate[required]" onchange="code(2)" style="width:150px" id="input_23" name="q23_quantity">
        <option>  </option>
        <option value="1"> 1 </option>
        <option value="2"> 2 </option>
        <option value="3"> 3 </option>
        <option value="4"> 4 </option>
        <option value="5"> 5 </option>
        <option value="6"> 6 </option>
        <option value="7"> 7 </option>
        <option value="8"> 8 </option>
        <option value="9"> 9 </option>
        <option value="10"> 10 </option>
      </select>
    </div>
  </li>
  <li class="form-line" id="id_22">
    <label class="form-label-right" id="label_22" for="cost">Total &nbsp; &nbsp; $</label>
    <div id="cid_22" class="form-input">
      <input type="text" name="q22_total" id="cost" onfocus="this.blur()" style="width:50px"/> 
    </div>
  </li>

这是Javasript:

<script type="text/javascript">
function code() { // forget the parameter
var varone = document.getElementById('input_7');
var vartwo = document.getElementById('input_23');
var cost = document.getElementById('cost');

var total = parseFloat(varone.value) * parseFloat(vartwo.value);
cost.value = total;
}
</script>

1 个答案:

答案 0 :(得分:0)

如果您要在数据库中保存所有这些计算,那么首先应该创建一个表'ticket_options',您应该在其中输入两列,例如

“q7_ticketOptions”的第1列,“ticketRates”的第2列

<select class="form-dropdown validate[required]" onchange="code(1);,showUser(this.value);" style="width:150px" id="input_7" name="q7_ticketOptions">
 <option  selected="selected"  disabled="disabled">Choose TicketOptions</option>
        <?php
       $sql=mysql_query("select * from ticket_options order by id ASC");
        while($val=mysql_fetch_array($sql))
         {
         ?>
        <option> <?php print $val['q7_ticketOptions']; ?>
        </option>
        <?php  } ?>
   </select>  
  <div  align="right" id="txtHint"><strong>Choose ticketOptions </strong></div>

在页面的head部分创建此功能:

 <script>
  function showUser(str)
      {
        if (str=="")
          {
      document.getElementById("txtHint").innerHTML="";
  return;
 }
    if (window.XMLHttpRequest)
    {// code for IE7+, Firefox, Chrome, Opera, Safari
 xmlhttp=new XMLHttpRequest();
  }
 else
  {// code for IE6, IE5
    xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
  }
     xmlhttp.onreadystatechange=function()
   {
   if (xmlhttp.readyState==4 && xmlhttp.status==200)
{
document.getElementById("txtHint").innerHTML=xmlhttp.responseText;
}
    }
 xmlhttp.open("GET","getrate.php?q="+str,true);
  xmlhttp.send();
 }
    </script>

 <script> 

然后创建一个php页面'getrate.php'。并写下这些代码:

 <?php
   $q=$_GET["q"];

    $con = mysql_connect('localhost', 'root', '');
    if (!$con)
    {
   die('Could not connect: ' . mysql_error());
    }

  mysql_select_db("database", $con);

 $sql="SELECT * FROM ticket_options WHERE q7_ticketOptions = '".$q."'";

  $result = mysql_query($sql);

    while($row = mysql_fetch_array($result))
       {

        ?>
  <input type="text" style="text-align:right" name="t_rate" value="<?php echo  $row['ticketRates'] ;  ?>" id="tax0" size="5" />


 <?php

    }


   mysql_close($con);
    ?> 

它是如何工作的:当您从选择框名称=“q7_ticketOptions”中选择选项时,它将在新框中显示票价,而不是使用下一个下拉名称=“q23_quantity”进行计算 希望它会对你有所帮助。