如何使用按键事件来执行计算

时间:2013-03-27 04:39:12

标签: php javascript jquery yii

这是我的创建页面。

enter image description here

费率=人工+机械+材料+现场头部+总部头部+利润

在提交按钮之前,单击我要完成上述计算并将其填入“费率”文本字段。是否有按键操作(如在Windows应用程序中)这样的事件? 我是yii的新手,我想你们帮助我做到这一点。

这是我通过Yii生成的表格。

<div class="form">

<?php $form=$this->beginWidget('CActiveForm', array(
    'id'=>'trboq-form',
    'enableAjaxValidation'=>false,
)); ?>

<?php
    $projectWbs = Yii::app()->session['projectWbs'];
?>

<?php
    $subBoqNo=Yii::app()->session['$subBoqNo']  ;
    $subBoqDes=Yii::app()->session['subBoqDes']  ;
    $mainBoqDes=Yii::app()->session['mainBoqDes']  ;
?>




    <p class="note">Fields with <span class="required">*</span> are required.</p>

    <?php echo $form->errorSummary($model); ?>


<!-- Start of First table-->
 <div class="form">
  <div class="group" style="width:600px; padding-left:50px;margin-top:40px; margin-left:15px">
   <fieldset>
      <legend>General</legend>
      <table>
     <tr>
       <th><?php echo $form->hiddenfield($model,'Project_Code'); ?></th>
       <th><?php echo $form->hiddenfield($model,'Project_Code',array('size'=>20,'value'=>$projectWbs,'readonly'=>true)); ?></th>
       <th><?php echo $form->error($model,'Project_Code'); ?></th>
    </tr>
    <tr>
        <th><?php echo $form->labelEx($model,'Sub_BOQ_No'); ?></th>
        <th><?php echo $form->textField($model,'Sub_BOQ_No',array('size'=>20,'value'=>$subBoqNo,'readonly'=>true)); ?></th>
        <th><?php echo $form->error($model,'Sub_BOQ_No'); ?></th>
    </tr>
       <tr>
        <th><?php echo $form->labelEx($model,'Sub_BOQ_Description'); ?></th>
        <th><?php echo $form->textField($model,'Sub_BOQ_Description',array('size'=>60,'maxlength'=>150, 'value'=>$subBoqDes,'readonly'=>true)); ?>        </th>
        <th><?php echo $form->error($model,'Sub_BOQ_Description'); ?></th>
    </tr>
      <tr>
        <th><?php echo $form->labelEx($model,'BOQ_Item_Code'); ?></th>
        <th><?php echo $form->textField($model,'BOQ_Item_Code',array('size'=>25,'maxlength'=>25)); ?></th>
        <th><?php echo $form->error($model,'BOQ_Item_Code'); ?></th>
    </tr>
       <tr>
        <th><?php echo $form->labelEx($model,'BOQ_Item_Name'); ?></th>
        <th><?php echo $form->textarea($model,'BOQ_Item_Name',array('rows'=>6, 'cols'=>40)); ?></th>
        <th><?php echo $form->error($model,'BOQ_Item_Name'); ?></th>
    </tr>
    </tr>
       <tr>
        <th><?php echo $form->labelEx($model,'BOQ_Description'); ?></th>
        <th><?php echo $form->textarea($model,'BOQ_Description',array('rows'=>6, 'cols'=>40)); ?></th>
        <th><?php echo $form->error($model,'BOQ_Description'); ?></th>
    </tr>

    <tr>
        <th><?php echo $form->labelEx($model,'Unit_Code'); ?></th>
        <th> <?php echo $form->dropdownlist($model,'Unit_Code',CHtml::listData(MaUnits::model()->findAll(),'Unit_Code','Unit_Code'),array('width'=>              '25', 'empty'=>'please select'));  ?></th>
        <th><?php echo $form->error($model,'Unit_Code');?></th>
    </tr>

     <tr>
        <th><?php echo $form->labelEx($model,'Qty'); ?></th>
        <th><?php echo $form->textField($model,'Qty'); ?></th>
        <th><?php echo $form->error($model,'Qty'); ?></th>
    </tr>
        </table>
    </fieldset>

  </div>
  </div>

  <div class="form">
  <div class="group" style="width:600px; padding-left:50px;margin-top:40px; margin-left:15px">
   <fieldset>
      <legend>Cost</legend>
      <table>
      <tr>
        <th><?php echo $form->labelEx($model,'Labour'); ?></th>
        <th><?php echo $form->textField($model,'Labour'); ?></th>
        <th><?php echo $form->error($model,'Labour'); ?></th>
    </tr>
    <tr>
        <th><?php echo $form->labelEx($model,'Machinery'); ?></th>
        <th><?php echo $form->textField($model,'Machinery'); ?></th>
        <th><?php echo $form->error($model,'Machinery'); ?></th>
    </tr>
       <tr>
        <th><?php echo $form->labelEx($model,'Matirial'); ?></th>
        <th><?php echo $form->textField($model,'Matirial'); ?></th>
        <th><?php echo $form->error($model,'Matirial'); ?></th>
    </tr>
      <tr>
        <th><?php echo $form->labelEx($model,'Side_over_head'); ?></th>
        <th><?php echo $form->textField($model,'Side_over_head'); ?></th>
        <th><?php echo $form->error($model,'Side_over_head'); ?></th>
    </tr>
       <tr>
        <th><?php echo $form->labelEx($model,'Head_office_over_head'); ?></th>
        <th><?php echo $form->textField($model,'Head_office_over_head'); ?></th>
        <th><?php echo $form->error($model,'Head_office_over_head'); ?></th>
    </tr>
     <tr>
        <th><?php echo $form->labelEx($model,'Profit'); ?></th>
        <th><?php echo $form->textField($model,'Profit'); ?></th>
        <th><?php echo $form->error($model,'Profit'); ?></th>
    </tr>
    <tr><th><p>----------------------------------------------------------------------------</p></th></tr>
    <tr>
        <th><?php echo $form->labelEx($model,'Rate'); ?></th>
        <th><?php echo $form->textField($model,'Rate'); ?></th>
        <th><?php echo $form->error($model,'Rate'); ?></th>
    </tr>
      <tr>
        <th><?php echo $form->labelEx($model,'Amount_Total'); ?></th>
        <th><?php echo $form->textField($model,'Amount_Total'); ?></th>
        <th><?php echo $form->error($model,'Amount_Total'); ?></th>
      </tr>
        </table>
    </fieldset>
  </div>
  </div>

        <div class="row buttons" style="margin-left:580px">
            <?php echo CHtml::submitButton($model->isNewRecord ? 'Save' : 'Save'); ?>
        </div>

<?php $this->endWidget(); ?>

</div><!-- form -->

1 个答案:

答案 0 :(得分:0)

您可以使用javascript和jquery执行此类操作,请查看其工作原理:http://www.w3schools.com/jquery/http://www.w3schools.com/js/http://api.jquery.com/

了解javascript需要一些工作,但你可以用它来构建强大的东西。

在你的情况下,它可能是一些像:

<html>
    <head>
        <script src="http://code.jquery.com/jquery-latest.js"></script>
    </head>
    <body>
        <form id="myForm">
            <input id="Labour" type="text"/> <label>Labour</label> <br/>
            <input id="Machinery" type="text"/> <label>Machinery</label> <br/>
            <input id="Material" type="text"/> <label>Material</label><br/>
            <input id="Site" type="text"/> <label>Site Over Head</label><br/>
            <input id="HeadOffice" type="text"/> <label>Head Office Over Head</label><br/>
            <input id="Profit" type="text"/> <label>Profit</label><br/>
            <input type="submit">  <br/>
        </form>

        <script type="text/javascript">
            $("#myForm input").each(function(){
                $(this).keyup(function(){
                    var labour = $("#Labour").val();
                    var Machinery = $("#Machinery").val();
                    var Material = $("#Material").val();
                    var SiteOverHead = $("#Site").val();
                    var HeadOfficeOverHead = $("#HeadOffice").val();
                    labour = $.isNumeric(labour)?labour:0;
                    Machinery = $.isNumeric(Machinery)?Machinery:0;
                    Material = $.isNumeric(Material)?Material:0;
                    SiteOverHead = $.isNumeric(SiteOverHead)?SiteOverHead:0;
                    HeadOfficeOverHead = $.isNumeric(HeadOfficeOverHead)?HeadOfficeOverHead:0;
                    $("#Profit").val(parseInt(labour)+parseInt(Machinery)+parseInt(Material)+parseInt(SiteOverHead)+parseInt(HeadOfficeOverHead));
                });
            });
        </script>
    </body>
</html>
祝你好运。