<div class="row">
    <div class="col-md-12 mt-2">
        <form name="" id="cmsForm" method="post" action="/cms/update" enctype="multipart/form-data" novalidate>
            <div class="card card-info">
                <div class="card-header">
                    <h4 class="card-title">
                        <%=sectionTitle%>
                    </h4>
                </div>
                <div class="card-body">
                    <div class="form-row">
                        <div class="form-group col-md-12">
                            <label class="required" for="inputName">Title</label>
                            <input type="text" id="page_name" name="page_name" class="form-control"
                                placeholder="Enter title" required value="<%=dataInfo.page_name%>"
                                oninput="validate(this)">
                        </div>
                        <div class="form-group col-md-12">
                            <label class="required" for="inputName">Short Description</label>
                            <textarea type="text" rows="5" cols="5" id="page_short_description"
                                name="page_short_description" class="form-control" placeholder="Enter short description"
                                required oninput="validate(this)"><%=dataInfo.page_short_description%></textarea>
                        </div>
                        <div class="form-group col-md-12">
                            <label class="required" for="inputName">Description</label>
                            <textarea type="text" id="editor" data-oc-toggle="ckeditor" data-lang="en" name="page_description"
                                class="form-control editor" placeholder="Enter description" required
                            >
                                <%=dataInfo.page_description%></textarea>
                        </div>
                        <div class="form-group col-md-6">
                            <label for="inputName">Meta Title</label>
                            <input type="text" id="meta_title" name="meta_title" class="form-control"
                                placeholder="Enter meta title" value="<%=dataInfo.meta_title%>"
                                oninput="validate(this)">
                        </div>
                        <div class="form-group col-md-6">
                            <label for="inputName">Meta Description</label>
                            <input type="text" id="meta_description" name="meta_description" class="form-control"
                                placeholder="Enter meta description" value="<%=dataInfo.meta_description%>"
                                oninput="validate(this)">
                        </div>
                        <div class="form-group col-md-6">
                            <label for="inputName">Meta keyword</label>
                            <input type="text" id="meta_keyword" name="meta_keyword" class="form-control"
                                placeholder="Enter meta keyword" value="<%=dataInfo.meta_keyword%>"
                                oninput="validate(this)">
                        </div>
                        <div class="form-group col-md-6">
                            <label for="inputName">SEO URL</label>
                            <input type="text" id="seo_URL" name="seo_URL" class="form-control"
                                placeholder="Enter SEO URL" value="<%=dataInfo.seo_url%>" readonly>
                        </div>
                        <div class="form-group  col-md-6">
                            <label for="inputName">Page Banner</label>
                            <input type="file" class="form-control imagepickerWithPreviewId"
                                data-previewelement="imagePreview" id="image" name="image" accept="image/*"
                                onchange="return fileValidation()">
                            <label id="image-error" style="display: none;" class="error" for="image">Please upload file
                                having extensions .jpeg/.jpg/.png/.gif only.</label>
                        </div>
                        <div class="form-group col-md-6">
                        </div>
                        <div class="form-group col-md-6">
                            <%if(dataInfo.banner_pic !=null && dataInfo.banner_pic !="" ){%>
                                <img class="img-thumbnail " id="imagePreview" style="width: 100px"
                                    src="/uploads/cms/<%=dataInfo.banner_pic %>" alt="Image">
                                <%}else{%>
                                    <img class="img-thumbnail" id="imagePreview" style="width: 100px"
                                        src="/images/no-image.jpg%>" alt="Image">
                                    <%}%>
                        </div>

                        <input type="hidden" id="page_id" name="page_id" value="<%=dataInfo.id%>" />
                        <input type="hidden" id="banner_pic" name="banner_pic" value="<%=dataInfo.banner_pic%>" />
                    </div>
                </div>
                <div class="card-footer">
                    <button type="submit" id="savebtn" class="btn btn-info">Update</button>
                    <button type="submit" class="btn btn-default">
                        <a href="/cms/list">Cancel</a>
                    </button>
                </div>
            </div>
        </form>
    </div>
</div>

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.6.1/jquery.min.js"></script>

<%- contentFor('pageStyleSection')%>
    <link rel="stylesheet" href="/stylesheets/style.css" />