Invoice.add.ctp

// here , we are adding new invoice     - 1

<?php echo $this->Html->script('arrive.min'); ?>


<div class="invoices form col-lg-10 col-md-9 columns">
    <?php

    $invoice_types = [
        'op_new_consultation' => 'OP New Consultation',
        'op_follow_up' => 'OP Followup',
        'others' => 'Other',
        'price_per_slot_india' => 'Tele Consultation',
    ];

    echo $this->Form->create($invoice); ?>
    <fieldset>
        <legend><?= __('Add Invoice') ?></legend>
        <?php
        if (!empty($event)) {
            echo "Appointment Date: " . $event->start;
            echo "<BR>";
        }

        if (!empty($event_id)) {

            echo $this->Form->hidden('event_id', ['value' => $event_id]);
            echo $this->Form->hidden('patient_id', ['value' => $patient_id]);
            echo $this->Form->hidden('facility_id', ['value' => $facility_id, 'id' => 'facility-id']);
            echo $this->Form->hidden('provider_id', ['value' => $provider_id, 'id' => 'provider-id']);
        } else {
            echo $this->Form->hidden('patient_id', ['value' => $patient_id]);

            if (!empty($facility_id)) {
                echo $this->Form->hidden('facility_id', ['value' => $facility_id, 'id' => 'facility-id']);
            } else {
                echo $this->Form->input('facility_id', ['options' => $facilities]);
            }
            if (!empty($provider_id)) {
                echo $this->Form->hidden('provider_id', ['value' => $provider_id, 'id' => 'provider-id']);
            } else {
                echo $this->Form->input('provider_id', ['options' => $providers]);
            }
        }

        ?>
    </fieldset>

    <fieldset>
        <legend><?php echo __('Invoice Items'); ?></legend>
        <table class="table" id="item-table">
            <thead>
            <tr>
                <th>Type</th>
                <th>Notes</th>

                <th>Amount</th>

            </tr>
            </thead>
            <tbody></tbody>
            <tfoot>
            <tr>
                <td colspan="6"></td>
                <td>

                    Total Amount: <?php echo $this->Form->input('total_amount'); ?>
                </td>

                <td>
                    <a href="#" class="add">Add Item</a>
                </td>
            </tr>
            </tfoot>
        </table>
    </fieldset>
    <script id="item-template" type="text/x-underscore-template">
        <?php
        //debug($this->element('invoice_items'));
        
        ///  this called the second file.
        echo $this->element('invoice_items');

        ?>
    </script>

    <?= $this->Form->button(__('Submit'), ['class' => 'btn-success']) ?>
    <?= $this->Form->end() ?>
</div>

<script>
    var facilityId = $('#facility-id').val();
    var providerId = $('#provider-id').val();
    if(facilityId === undefined) {
        $('#facility-id').on('change',function () {
            facilityId = $('#facility-id').val();
        })
    }
    if(providerId === undefined) {
        $('#provider-id').on('change',function () {
            providerId = $('#provider-id').val();
        })
    }
    console.log(facilityId + " : " + providerId);
</script>


<script>
    $(document).ready(function () {

        var
            itemTable = $('#item-table'),
            itemBody = itemTable.find('tbody'),
            itemTemplate = _.template($('#item-template').remove().text()),

            numberRows = itemTable.find('tbody > tr').length;

        itemTable
            .on('click', 'a.add', function (e) {
                e.preventDefault();

                $(itemTemplate({key: numberRows++}))
                    .hide()
                    .appendTo(itemBody)
                    .fadeIn('fast');
            })

            .on('click', 'a.remove', function (e) {
                e.preventDefault();

                $(this)
                    .closest('tr')
                    .fadeOut('fast', function () {
                        $(this).remove();
                    });
            });

        if (numberRows === 0) {
            itemTable.find('a.add').click();

        }
    });
</script>


<script>

    $(document).ready(function(){
        console.log($(".invoice_types"));
        console.log($("#facility-id"));

        $(".invoice_types").on('change', function () {
            var invoice_type = $("#invoice_types").val;
            //console.log(invoice_type);
        }).change();

    });

    //console.log($(".invoice_types"));
    //console.log($("#facility-id"));

    //var days;



    function onChange(sel) {

        var name = sel.name;
        var pre = name.split(']', 1) + ']';

        var sum = 0;
        var amount = document.getElementsByName(pre + '[amount]');
        var type = document.getElementsByName(pre + '[type]');
        var q = document.getElementById('total-amount');


        //var amount = document.getElementsByName(pre + '[amount]');
        //amount[0].value = 300;

        //var type = document.getElementsByName(pre + '[type]');

        $(type).on('change', function () {

            //var invoice_type = type[0].value;

            amount[0].value = 300;
            sum += amount[0].value;
            q.value = sum;
        });


//alert(sum);

        // alert('onchange fired' + quantity);
    }
</script>