Magento 2 : Image Validation is not working in back end form

Question

I have a custom module which manage to upload the banners.

Everything working fine except image validation.

Below is my code for the image in

app/code/E25media/Bannersmanager/Block/Adminhtml/Banners/Edit/Tab/Main.php

<?php
namespace E25media\Bannermanager\Block\Adminhtml\Banners\Edit\Tab;
class Main extends \Magento\Backend\Block\Widget\Form\Generic implements \Magento\Backend\Block\Widget\Tab\TabInterface
{
 /* -- some code here */ 
protected function _prepareForm()
{ 
 /* -- some code here */ 
 $fieldset->addType('image', '\E25media\Bannermanager\Block\Adminhtml\Banners\Helper\Image');
$fieldset->addField('banner_image_mobile', 'image', array(
'name' => 'banner_image_mobile',
'class' => 'required-entry required-file',
'label' => __('Mobile Banner Image'),
'title' => __('Mobile Banner Image'),
'required' => true,
'disabled' => $isElementDisabled));
 /* -- some code here */ 
 }

My form file upload is look like this. enter image description here

But i can submit the form without uploading the image.

How to validate the image file ?

Answer 1

Try this.
Use javascript to add the class.

$fieldset->addField( 
 'banner_image_mobile', 
 'image',
 [ 
 'name' => 'banner_image_mobile', 
 'label' => __('Mobile Banner Image'), 
 'title' => __('Mobile Banner Image'), 
 'note' => __('Size: 164px x 24px, Allowed File Types : (JPG,JPEG,PNG), Max Size:2MB.'), 
 'path'=> $model->getImagePath(),
 'required' => true, 
 'value' => $model->getImagePath()
 ] 
 )->setAfterElementHtml('
 <script>
 require([
 "jquery",
 ], function($){
 $(document).ready(function () {
 if($("#page_banner_image_mobile").attr("value")){
 $("#page_banner_image_mobile").removeClass("required-file");
 }else{
 $("#page_banner_image_mobile").addClass("required-file");
 }
 $( "#page_banner_image_mobile" ).attr( "accept", "image/x-png,image/gif,image/jpeg,image/jpg,image/png" );
 });
 });
 </script>
 ');

• Mujahidh: thanks for your answer.I am getting this error Parse error: syntax error, unexpected ''disabled'' (T_CONSTANT_ENCAPSED_STRING), expecting ')' in D:\xampp\htdocs\tork\app\code\E25media\Bannermanager\Block\Adminhtml\Banners\Edit\Tab\Main.php on line 159
• Chirag Patel: check my updated answer and compare with your current code.
• Chirag Patel: @Mujahidh still getting error?
• Mujahidh: still allow me to submit the form without upload the image
• Chirag Patel: I think there is a problem with your field id mentioned in script, alert in JavaScript code and check field id is correct or not, because this code working for me.