{!! Form::open(array('class' => 'stdform','id'=>'contra_voucher_edit_form','route'=>'contra_vouchers.update','method'=>'POST')) !!}
<div class="modal-header">
    <button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
    <h3 id="myModalLabel">EDIT CONTRA VOUCHER</h3>
</div>
<div class="modal-body">

    <div class="row-fluid" style="margin-top: 4px">
        <div class="span6">
            <label class="span4">Transaction Date</label>

            <div class="field span8">
                <input type="text" name="date" class="span12 receive_payment_date" value="{{$contra_voucher->date}}" required autocomplete="off"/>
                 <input type="hidden" name="contra_voucher_id" class="" value="{{$contra_voucher->id}}" required/>
            </div>
        </div>
        <div class="span6">
            <label class="span4">Credit Account </label>

            <div class="field span8">
                <select name="cr_account_id" required
                        id="client_credit_account" class="searchable_select" style="width: 100%">
                    <option class="account-select" value="NONE"> Select Client Account</option>
                    @foreach($credit_account_groups as $client_credit_account_group)
                        <optgroup label="{{$client_credit_account_group->name}}">
                            @foreach($client_credit_account_group->accounts as $account)
                                <option class="account-select"
                                        value="{{$account->id}}"
                                        @if($contra_voucher->cr_account_id == $account->id) selected @endif> {{$account->name}} </option>
                            @endforeach
                        </optgroup>
                    @endforeach
                </select>
            </div>
        </div>
    </div>


    <div class="row-fluid" style="margin-top: 4px">
        <div class="span6">
            <label class="span4">Reference Number</label>

            <div class="field span8">
                <input type="text" value="{{$contra_voucher->reference_number}}" name="reference_number" class="span12" autocomplete="off"/>
            </div>
        </div>
        <div class="span6">
            <label class="span4">Debit Account</label>

            <div class="field span8">
                <select name="dr_account_id" required
                        id="dr_account_id" class="searchable_select" style="width: 100%">
                    <option></option>
                    @foreach($debit_account_groups as $client_debit_account_group)
                        <optgroup label="{{$client_debit_account_group->name}}">
                            @foreach($client_debit_account_group->accounts as $account)
                                <option class="account-select"
                                        value="{{$account->id}}"
                                        @if($contra_voucher->dr_account_id == $account->id) selected @endif> {{$account->name}} </option>
                            @endforeach
                        </optgroup>
                    @endforeach


                </select>
            </div>
        </div>
    </div>

    <div class="row-fluid" style="margin-top: 4px">
        <div class="span6">
            <label class="span4">Amount</label>

            <div class="field span6">
                <input type="text" name="amount" value="{{number_format($contra_voucher->amount,2)}}" class="span12 number" required autocomplete="off"/>
            </div>
            <div class="field span2">
                <select name="currency_id" required class="searchable_select" id="transaction_currency"
                        style="width: 100%">
                          @foreach($currencies as $currency)
                        <option class=""
                                value="{{$currency->id}}"
                                @if($contra_voucher->currency_id == $currency->id) selected @endif> {{$currency->name}} </option>
                    @endforeach
                </select>
            </div>
        </div>
        <div class="span6">
            <label class="span4">Exchange Rate</label>

            <div class="field span8">
                <input type="text" value="{{number_format($contra_voucher->exchange_rate,2)}}" name="exchange_rate" id="exchange_rate" class="span12" required autocomplete="off"/>
            </div>
        </div>


    </div>


    <div class="row-fluid" style="margin-top: 2px">
        <div class="span12">
            <label class="span2">Narration</label>

            <div class="field span10">
                <textarea cols="80" rows="5" class="span12" name="remarks" required>{{$contra_voucher->remarks}}</textarea>
            </div>
        </div>
    </div>
</div>
<div class="modal-footer">
    <button class="btn btn-success" type="submit">SUBMIT TRANSACTION</button>
    <button class="btn" data-dismiss="modal" aria-hidden="true">Close</button>
</div>
{!! Form::close() !!}

<script>
    jQuery('.receive_payment_date').datepicker();

    jQuery('#client_credit_account').on('change', function () {
        var cr_account_id = jQuery(this).val();
        jQuery.ajax({
            url: '{{route('account_managments.account_currency')}}',
            type: 'GET',
            data: {
                'cr_account_id': cr_account_id
            },
            dataType: 'json',
            beforeSend: function () {
                jQuery('#transaction_currency').empty();
                jQuery('#dr_account_id').empty();
                startSpinner();
            },
            success: function (data) {
                // $('#transaction_currency').val(data).trigger('change'); // Notify any JS components that the value changed
                var newOption = new Option(data.text, data.id, false, false);
                jQuery('#transaction_currency').append(newOption).trigger('change');


            },
            error: function (xhr, textStatus, error) {
                onAjaxError(xhr, textStatus, error);
            },
            complete: function () {
                stopSpinner();
            }
        });

        var dr_account_id = jQuery('#dr_account_id');
        jQuery.ajax({
            url: '{{route('account_managments.other_bank_cash_accounts.create')}}',
            type: 'GET',
            data: {
                'account_id': cr_account_id
            },
            dataType: 'json',
            beforeSend: function () {
                dr_account_id.empty();
                // startSpinner();
            },
            success: function (data) {

                dr_account_id.append(new Option('Select Dr Account', '', false, false)).trigger('change');

                var size_of_accounts = data.length;
                for (var i = 0; i <= size_of_accounts; i++) {
                    dr_account_id.append(new Option(data[i].text, data[i].id, false, false)).trigger('change');
                }

            },
            error: function (xhr, textStatus, error) {
                onAjaxError(xhr, textStatus, error);
            },
            complete: function () {
                // stopSpinner();
            }
        });
    });

    jQuery('#dr_account_id').on('change', function () {
        var account_id = jQuery(this).val();
        var currency_id = jQuery('#transaction_currency').val();
        var exchange_rate = jQuery('#exchange_rate');

        if(account_id){
            jQuery.ajax({
                url: '{{route('account_managments.exchange_rate.create')}}',
                type: 'GET',
                data: {
                    'account_id': account_id,
                    'currency_id': currency_id
                },
                dataType: 'json',
                beforeSend: function () {
                    exchange_rate.val('');
                },
                success: function (data) {
                    exchange_rate.val(data);
                },
                error: function (xhr, textStatus, error) {
                    onAjaxError(xhr, textStatus, error);
                },
                complete: function () {
                    // stopSpinner();
                }
            });
        }

    });

</script>