function setHiddenImg($this){
    var name    = $this.attr('name')
    ,   hidName = 'hidden_' + name
    ,   dataURL = $this.attr('data-url') || "";
    
    if( dataURL != '' ) {
        if( $('[name="'+ hidName +'"]').length == 0 ) {
            $this.after('<input type="hidden" value="" name="'+ hidName +'" />');
        }

        $('[name="'+ hidName +'"]').val(dataURL);
    }
}

$(document).ready(function() {
    
    $('[name="image_url"]').on('change', function(){
        setHiddenImg($(this));
    });
    
    $.validator.addMethod("already_exist_name", function(value, element) {
        var return_val = true;
        var name = $('input[name="pay_type"]').val();
        var id = $('input[name="hidden_id"]').val();
        $.ajax({
            async: false,
            url: base_url + 'kiosk_payment_type/payment_name_exists',
            type: 'POST',
            data: {
                name: name,
                id: id
            },
            dataType: "json"
        })
        .done(function(data) {
            if(data == 1) {
                return_val = false;
            }
        })
        .fail(function(jqXHR, status_code, error_thrown) {
            console.log(jqXHR.responseText);
        });
        
        return return_val;
    });
    
   
    $('form[name="payment_form"]').validate({
        errorElement: "li",
        errorLabelContainer:'.error_container',
        validClass: 'valid',
        focusInvalid: true,
        rules: {
            pay_type: {
                required: true,
                already_exist_name: true
            }
        },
        messages: {
            pay_type: {
                required: 'Please enter Payment Type!',
                already_exist_name: 'Payment Type already exists!'
            }
        }
      });
});

function goBack() {
    window.history.back();
}