Upload or Draw Signature on Laravel form

Viewed 500

I used this https://www.itsolutionstuff.com/post/laravel-signature-pad-example-tutorialexample.html to create a signature pad. I am looking for a way to add an option to upload a signature or use the pad to draw a signature.

Here's what I wrote:

Laravel Blade Code

    <form method="POST" action="{{ route('signaturepad.upload') }}">              
        <div class="tab-content">
            <div class="tab-pane fade show active" id="draw">
                <div class="col-md-12">
                    <label class="" for="">Draw Signature:</label>
                    <br/>
                    <div id="sig"></div>
                    <br><br>
                    <button id="clear" class="btn btn-danger">Clear Signature</button>
                    {{--<button class="btn btn-success">Save</button>--}}
                    <textarea id="signature" name="signature" style="display: none"></textarea>
                </div>
            </div>
            <div class="tab-pane fade" id="upload">
                <label class="" for="">Upload Signature:</label>
                {{--<div class="form-group"></div>
                <input type="file" name="file" id="file" required>--}}
                {{--<button type="submit">Submit</button>--}}
            </div>
            <button class="btn btn-success">Save</button>
        </div>
    </form>

Javascript

<script src="{{ asset('js/pages/jquery.signature.js')}}"></script>
<script type="text/javascript">
    var sig = $('#sig').signature({syncField: '#signature', syncFormat: 'PNG'});
    $('#clear').click(function(e) {
        e.preventDefault();
        sig.signature('clear');
        $("#signature").val('');
    });
</script>

Controller

if(!empty($request->input('signature')) || (!empty($request->input('file')))) {
            echo $request->signature;
            echo $request->file;
            dd('passed');
        //$folderPath = public_path('uploads/');
        //$data_uri = $request->signature;
        //$encoded_image = explode(",", $data_uri)[1];
        //$decoded_image = base64_decode($encoded_image);
        //$file = $folderPath . uniqid();
        //file_put_contents($file, $decoded_image);
        return view('dashboard');
} else {
        //dd('Signature is empty.');
        return back()->withErrors(['msg', 'Signature Empty']);
        }

Drawing the Signature works when one of the file uploads is commented out. When both are active they don't post and both don't work. My question is how do I work with both where one can either draw or upload the signature. I have tried if statements in the controller to no avail.

Thanks in Advance!

0 Answers
Related