计算多输入值取决于所选的下拉值

时间:2017-07-31 03:10:39

标签: javascript jquery yii2

我对这种形式感到有点疯狂。我用yii2动态形式wbraganca来克隆我的表格。我想基于下拉值分别对多个表单求和,但我得到的是求和所有值。

这是我的表格:

<?php DynamicFormWidget::begin([
    'widgetContainer' => 'dynamicform_manifest', // required: only alphanumeric characters plus "_" [A-Za-z0-9_]
    'widgetBody' => '.container-manifest', // required: css class selector
    'widgetItem' => '.item-manifest', // required: css class
    //'limit' => 4, // the maximum times, an element can be cloned (default 999)
    'min' => 1, // 0 or 1 (default 1)
    'insertButton' => '.add-item-manifest', // css class
    'deleteButton' => '.remove-item-manifest', // css class
    'model' => $modelManifest[0],
    'formId' => 'dynamic-form',
    'formFields' => [
        'id_keagenan',
        'jenis_manifest',
        'jlh_manifest',
    ],
]); ?>
<div class="container-manifest"><!-- widgetContainer -->
<?php foreach ($modelManifest as $i => $modelManifest): ?>
    <div class="item-manifest panel panel-default"><!-- widgetBody -->
        <div class="panel-heading">
            <h3 class="panel-title pull-left">Manifest Keagenan</h3>
            <div class="pull-right">
                <button type="button" class="add-item-manifest btn btn-success btn-xs"><i class="glyphicon glyphicon-plus"></i></button>
                <button type="button" class="remove-item-manifest btn btn-danger btn-xs"><i class="glyphicon glyphicon-minus"></i></button>
            </div>
            <div class="clearfix"></div>
        </div>
        <div class="panel-body">
            <?php
                // necessary for update action.
                if (! $modelManifest->isNewRecord) {
                    echo Html::activeHiddenInput($modelManifest, "[{$i}]id");
                }
            ?>
            <div class="row">
                <div class="col-sm-4">
                    <?php echo $form->field($modelManifest, "[{$i}]id_keagenan")->widget(Select2::classname(), [
                        'data' => ArrayHelper::map(Keagenan::find()->all(), 'id_keagenan', 'nama_keagenan'),
                        'language' => 'en',
                        'theme' => Select2::THEME_KRAJEE,
                        'options' => ['placeholder' => '-- Keagenan --', 'class' => 'form-control'],
                    ]); ?>
                </div>
                <div class="col-sm-4">
                    <?= $form->field($modelManifest, "[{$i}]jlh_manifest")->widget(\yii\widgets\MaskedInput::className(),
                        [
                            'clientOptions' => [
                                'alias' => 'numeric',
                                'groupSeparator' => '.',
                                'digits' => 0,
                                'autoGroup' => true,
                                'removeMaskOnSubmit' => true,
                                'rightAlign' => false,                                                                  
                            ],
                            'options' => [
                                'class' => 'form-control manifest',
                                'maxlength' => true,
                            ]                                                               
                        ])
                    ?>
                </div>
                <div class="col-sm-4">
                    <?= $form->field($modelManifest, "[{$i}]jenis_manifest")->dropDownList([ 'Berangkat' => 'Berangkat', 'Pulang' => 'Pulang'], ['class' => 'jenis_manifest form-control', 'prompt' => '-- Manifest --']) ?>
                </div>
            </div><!-- .row -->
        </div>
    </div>
<?php endforeach; ?>
</div>
<?php DynamicFormWidget::end(); ?>

我想要的是当我选择jenis_manifest时,该功能仅基于jlh_manifest值获得jenis_manifest

这是我的脚本,它可以获得所有价值。

$(".container-manifest").on("change", ".jenis_manifest", function() {
    var jenis_manifest = $(".jenis_manifest").val();
    if(jenis_manifest == "Berangkat")
    {
        var items = $(".item-manifest");
        var sum = 0;

        items.each(function (index, elem) {
            var manifest = $(elem).find(".manifest").val().replace(/,/g , "");
            sum = parseInt(sum) + parseInt(manifest);
        });

        $("#jlh_semua_manifest_berangkat").val(sum);
    }
    else if(jenis_manifest == "Pulang")
    {
        var items = $(".item-manifest");
        var sum = 0;

        items.each(function (index, elem) {
            var manifest = $(elem).find(".manifest").val().replace(/,/g , "");
            sum = parseInt(sum) + parseInt(manifest);
        });

        $("#jlh_semua_manifest_pulang").val(sum);
    }
});

更新

这是截图

enter image description here

我想要的结果是:

  • Berangkat + Berangkat = 500000 + 1500000 = 2000000
  • Pulang = 500000

但我用我的脚本得到的是:

Berangkat + Berangkat + Pulang = 500000 + 1500000 + 500000 = 2500000

0 个答案:

没有答案