0

I am trying to upload the image to database and folder using ajax and laravel but i am getting the error like call to a member function getclientoriginalextension on string and when i dd the values in my controller image path only not coming.

my view :

<form role="form" name="campaignForm" id="campaignForm" action="" method="post"  enctype="multipart/form-data">


    <input type="text" name="project_name" autocomplete="off" id="project_name" placeholder="Company name" class="form-control">

    <input type="text" name="website_url" id="website_url" autocomplete="off" placeholder="http://www.yourdomain.com" class="form-control">
    <input type="file" name="image" id="image" autocomplete="off" placeholder="" class="form-control">

    <input type="text" name="location" id="location" autocomplete="off" placeholder="Enter the location you want to target" class="form-control">

    <input type="text" name="group" id="group" autocomplete="off" placeholder="Group (optional)" class="form-control">
    <button type="submit" id="btn-save" value="add"  class="btn actionBtn btn-primary">
</form>

my ajax :

$("#btn-save").click(function (e) {
    $.ajaxSetup({
        headers: {
            'X-CSRF-TOKEN': $('meta[name="_token"]').attr('content')
        }
    })

    e.preventDefault(); 

    var formData = {
        project_name: $('#project_name').val(),
        website_url: $('#website_url').val(),
        location: $('#location').val(),
        group: $('#group').val(),

        image : $('#image').val(),
    }


    $.ajax({

        type: type,
        url: my_url,
        data: formData,
        dataType: 'json',
        success: function (data) {
            console.log(data);

        },
        error: function (data) {
            console.log('Error:', data);
        }
    });
});

controller:

    public function campaign(Request $request){


    $task = new projects();

    $task->project_name = trim($request->project_name);
    $task->website_url = trim($request->website_url);
    $task->location = trim($request->location);
    $task->group = trim($request->group);


    $file = trim($request->image);

    if ($request->hasFile($file)) {
    $destinationPath = 'images'; // upload path
    $extension = $file->getClientOriginalExtension(); // getting image extension
    $fileName = rand(11111,99999).'.'.$extension; // renameing image
    $file->move($destinationPath, $fileName);

    $task->image = $fileName; 
  }   

  dd($task);

}

any help would be appreciated .Thank you .

1 Answer 1

2

Looks like Laravel does not receive uploaded image. $request->image should be instance of UploadedFile class, but in your case it is just string like "C:\fakepath\custom-image.jpg"

Giving respect to this answer, try this:

$("#btn-save").click(function (e) {
    $.ajaxSetup({
        headers: {
            'X-CSRF-TOKEN': $('meta[name="_token"]').attr('content')
        }
    });

    e.preventDefault();

    var form = document.forms.namedItem("campaignForm"); // high importance!, here you need change "yourformname" with the name of your form
    var formData = new FormData(form); // high importance!

    $.ajax({
        type: type,
        url: my_url,
        dataType: "json", // or html if you want...
        contentType: false, // high importance!
        data: formData, // high importance!
        processData: false, // high importance!
        success: function (data) {
            console.log(data);

        },
        error: function (data) {
            console.log('Error:', data);
        }
    });
});
Sign up to request clarification or add additional context in comments.

8 Comments

Its worked for inserting Data .But when i am trying to edit the form , its storing as empty values . I don't understand why ?
i am glad it worked. do you mean editing existing instance? well in that case you may put old('username') in form fields, like this <input type="text" name="username" value="{{ old('username') }}">. Here is old input docs
I sorted out the issue .Now everything is working like charm .Thank you :)
i have one more problem here . if i use form data like this , i m not getting all the selected values from the drop down . Is there any solution for it ?
@HarshithaNaidu ok may be try to add value via formData.append(name, value); Here is source docs
|

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.