

<!-- // Basic multiple Column Form section start -->
<section id="multiple-column-form" class="kt-info-editor">
    <%- include('../components/editorHero.ejs', { mode: 'create', icon: 'ti-slideshow', listUrl: '/dashboard/infoSliders', description: (typeof lang === 'undefined' || lang !== 'en') ? 'أضف صورة ونصًا واضحًا للشريحة باللغتين.' : 'Add a clear image and bilingual copy for the slide.' }) %>
    <div class="row match-height">
        <div class="col-12">
            <div class="card">
                
                <div class="card-content">
                    <div class="card-body">
                        <form id="addSlider" method="post" class="needs-validation" novalidate action="/dashboard/infoSliders/create" enctype="multipart/form-data">
                            <%- include('../../components/input.ejs', inputAttrs = {
                                type: "hidden",
                                name:"_csrf",
                                value:csrfToken,
                                classes: "",
                                ids:""
                            }) %>

                            <div class="form-body">
                                <div class="row">


                                                <%- include('../../components/image.ejs', {
                                                    required:'required',
                                                    url:"" ,
                                                    id:'image',
                                                    name:'image',
                                                    invalidFeedback:i18n.__('common.pleaseEnterImage'),
                                                    layout : 1
                                                }) %>

                                                <%- include('../../components/input.ejs', inputAttrs = {
                                                    type: "text",
                                                    name:"titleAr",
                                                    label:i18n.__('infoSite.titleAr'),
                                                    invalidMsg:i18n.__('common.{{field}}Required',{field:i18n.__('infoSite.titleAr')}),
                                                    required:true,
                                                    placeholder:i18n.__('common.{{field}}Placeholder',{field:i18n.__('infoSite.titleAr')}),
                                                    classes:["form-control"],
                                                    ids:"",
                                                    oninput: "validateInput(this)"
                                                }) %>

                                                <%- include('../../components/input.ejs', inputAttrs = {
                                                    type: "text",
                                                    name:"titleEn",
                                                    label:i18n.__('infoSite.titleEn'),
                                                    invalidMsg:i18n.__('common.{{field}}Required',{field:i18n.__('infoSite.titleEn')}),
                                                    required:true,
                                                    placeholder:i18n.__('common.{{field}}Placeholder',{field:i18n.__('infoSite.titleEn')}),
                                                    classes:["form-control"],
                                                    ids:"",
                                                    oninput: "validateInput(this)"
                                                }) %>


                                               
                                    <div class="col-md-6 col-12">
                                        <div class="form-group">
                                            <label for="first-name-column"><%= i18n.__('infoSite.descriptionAr') %> </label>
                                            <div class="controls">
                                                <textarea name="descriptionAr" class="form-control" placeholder="<%=  i18n.__('common.{{field}}Placeholder',{field:i18n.__('infoSite.descriptionAr')}) %>" oninput="validateInput(this)" required  cols="30" rows="10"></textarea>
                                                <div class="invalid-feedback">
                                                    <%= i18n.__('common.{{field}}Required',{field:i18n.__('infoSite.descriptionAr')}) %> *
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="col-md-6 col-12">
                                        <div class="form-group">
                                            <label for="first-name-column"> <%= i18n.__('infoSite.descriptionEn') %></label>
                                            <div class="controls">
                                                <textarea name="descriptionEn" class="form-control" placeholder="<%=  i18n.__('common.{{field}}Placeholder',{field:i18n.__('infoSite.descriptionEn')}) %>" oninput="validateInput(this)" required  cols="30" rows="10"></textarea>
                                                <div class="invalid-feedback">
                                                    <%= i18n.__('common.{{field}}Required',{field:i18n.__('infoSite.descriptionEn')}) %> *
                                                </div>
                                            </div>
                                        </div>
                                    </div>

                                   
                                    <div class="pt-4 d-flex justify-content-center mt-3">
                                        <button type="submit" class="btn btn-primary me-sm-3 me-1 waves-effect waves-light submit_button"><%= i18n.__('common.add') %></button>
                                        <a class="btn btn-label-dribbble waves-effect"  href="<%=referer%>"> <%= i18n.__('common.referer') %></a>
                                    </div>
                                </div>
                            </div>
                        </form>
                    </div>
                </div>
            </div>
        </div>
    </div>
</section>
<!-- // Basic Floating Label Form section end -->

<%- include('./includes.ejs') %>
<%- include('../../includes/imageJs.ejs') %>


<script>
     $('form').on('submit', function (e) {
            const fileInput = $('input[type="file"]');
            const file = fileInput[0].files[0];
            const feedback = fileInput.closest('.image_groub').find('.invalid-feedback');

            if (!file) {
                fileInput.addClass('is-invalid');
                feedback.text("<%= i18n.__('common.pleaseEnterImage') %>").addClass('d-block');
                e.preventDefault();
            }
        });
</script>
