noblemfd's avatar

How to make input type="image" not clickable

How do I make

input type="image"

not clickable in:

              <input type="image" class="profile-user-img img-fluid img-circle"
                   src="{{asset('theme/adminlte3/dist/img/default.png')}}"

                    id="wizardPicturePreview" title="" width="150" >

                <input type="file"  name="emp_image" id="wizard-picture" class="form-control">


    <script>
        $(document).ready(function(){
           // bsCustomFileInput.init();
            $("#wizard-picture").change(function(){
                readURL(this);
            });
        });
        function readURL(input) {
            if (input.files && input.files[0]) {
                var reader = new FileReader();

                reader.onload = function (e) {
                    $('#wizardPicturePreview').attr('src', e.target.result).fadeIn('slow');
                }
                reader.readAsDataURL(input.files[0]);
            }           }
    </script>

Thanks

0 likes
5 replies
Snapey's avatar

You are looking for $("#wizard-picture") but it seems to be called wizardPicturePreview

next, you should hook into the click handler and specify preventDefault()

(you do know that input type of image is for using a picture as a submit button ?)

noblemfd's avatar

No. I didn't call $("#wizard-picture") as wizardPicturePreview. They are separate. I've updated the code.

How do I apply preventDefault()

Snapey's avatar

why are you using this input type?

Amaury's avatar
Amaury
6 years ago
Best Answer
Level 43

Just add the attribute disabled as for a submit button.

<input type="image" 
    class="profile-user-img img-fluid img-circle"
    src="{{asset('theme/adminlte3/dist/img/default.png')}}"
    id="wizardPicturePreview" 
    title="" 
    width="150" 
    disabled
>

Please or to participate in this conversation.