AJAX Jquery is not able to call PHP backend with Multipart/form data

77 Views Asked by At

I want to send form data to the backend PHP via Ajax JQuery call but it is not able to call the PHP controller class function. Giving me Internal 500 error. The code is as follows:

HTML

<form class="montform" id="reused_form1" enctype="multipart/form-data"; >
    {{ csrf_field() }}
         ...
    ...
    ...
    <div class="control-group form-group">
        <div class="controls">
            <label>Upload Images: 5mb max size</label>

            <p class="file">
                <input name="image" type="file" id="file" class="feedback-input">
            </p>
        </div>
    </div>

    ....
</form> 

JS code

$(function() {

    $("#reused_form1 input,#reused_form1 select").jqBootstrapValidation({
        preventSubmit: true,
        submitError: function($form, event, errors) {
            // additional error messages or events
        },
        submitSuccess: function($form, event) {
            event.preventDefault(); // prevent default submit behaviour

        var formobj = $form[0];
        var formd = new FormData(formobj);
            
            $this = $("#sendMessageButton");
            $this.prop("disabled", true); // Disable submit button until AJAX call is complete to prevent duplicate messages
            $.ajax({
                url: '/custom-template',
                type: "POST",
        enctype: 'multipart/form-data',
        data: formd,
        headers: {
            'Accept': 'multipart/form-data',
            'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
        },
        processData: false,
        contentType: false,
                cache: false,
                success: function(response) {
                ....
                },
                error: function(response) {
                ....
                },
                complete: function() {
                ....
                }
});

Web.php

Route::post('/custom-template', [EmailController::class, 'customTemplate'])->middleware('web');

EmailController.php

use Illuminate\Http\Request;
use Mail;
use App\Mail\SendMail;

class EmailController extends Controller
{
    public function customTemplate(Request $req)
    {
        echo("im in controller\n");
        
        return true;
    }

}

I have checked the php config it has upload_max_filesize = 10M and post_max_size = 8M The file I upload is of 289KB

The Request header looks like this:

Accept: multipart/form-data
Accept-Encoding: gzip, deflate, br
Accept-Language: en-US,en;q=0.9
Cache-Control: no-cache
Connection: keep-alive
Content-Length: 291087

I expect to see "im in controller" in the network response.

I am able to see the result when I upload a pdf. But it does not work with PNG or JPG format.

I also checked the error.log for the site This is what it logs

 mod_fcgid: HTTP request length 133937 (so far) exceeds MaxRequestLen (131072)

Thank you for helping.

0

There are 0 best solutions below