Question

我更改了默认设置＆＃34;选择文件＆＃34;到一个字形图标，现在当我点击它时，自定义文件上传将不起作用。我不明白为什么它没有响应

这是主页

 div class="col-md-8 col-md-offset-2">
                    {!! Form::open(['url' => 'home','files' =>true]) !!}
                    <div class="panel panel-default">
                        <div class="panel-heading">Add a new status</div>

                        <div class="panel-body">
                            <div class="form-group">
                                <label>Write a new status</label>
                                <textarea class="form-control" name="status-text" id="status-text"></textarea>

                            </div>
                        </div>
                        <div class="panel-footer clearfix">
                            <div class="row">
                                <div class="col-md-6">
                                    <div id="image_upload">

                                    <label for="file upload" class="custom-file-upload">

                                        <i class="fa fa-image"></i> or <i class="fa fa-video-camera"></i>

                                    </label>
                                        <input id="file-upload" name="status_image_upload" type="file"/>
                                </div>
                            </div>
                                <div class="col-md-9=">

                                    <button class="btn btn-info pull-right btn-sm"><i class="fa fa-plus"></i>Add status
                                    </button>

                                </div>

                            </div>

                        </div>
                    </div>

这是style.css类

.profile-header
{


}


.profile-header-wrapper {

    background-color: rgba(0,0,0,0.5);
    padding: 200px;
    color:#fff;
    text-align: center;
}

#file-upload {
    display: none;

}

.custom-file-upload{


    display:inline-block;
    padding: 6px 12px ;
    cursor: pointer;
}

这是我的控制器

<?php

namespace App\Http\Controllers;

use App\Eloquent\Status;
use App\Friends;
use Illuminate\Support\Facades\Auth;
use Illuminate\Support\Facades\Validator;
use Laracasts\Flash\Flash;
//use Request;
use Illuminate\Http\Request;
use Illuminate\Support\Facades\Input;
use Illuminate\Support\Facades\DB;


class HomeController extends Controller
{
    /**
     * Create a new controller instance.
     *
     * @return void
     */
    public function __construct()
    {
        $this->middleware('auth');
    }

    /**
     * Show the application dashboard.
     *
     * @return \Illuminate\Http\Response
     */
    public function index(Request $request)
    {
        if (Input::has('like_status')) {
            $status = Input::get('like_status');

            $selectedStatus = Status::find($status);

            $selectedStatus->likes()->create([
                'user_id' => Auth::user()->id,
                'status_id' => $status
            ]);
            return redirect(route('home'));
        }

        if (Input::has('post_comment')) {
            $status = Input::get('post_comment');
            $commentBox = Input::get('comment-text');
            $selectedStatus = Status::find($status);

            $selectedStatus->comments()->create([

                'comment_text' => $commentBox,
                'user_id' => Auth::user()->id,
                'status_id' => $status
            ]);
            Flash::message('Your comment has been posted');
            return redirect(route('home'));

        }
        if (Input::has('status-text')) {
            $text = e(Input::get('status-text'));

            $rules = [
                'status-text' => 'required|string',


            ];

            $vaildator = Validator::make($request->all(), $rules);
            if (Input::hasFile('status_image_upload')) {

                $file = Input::file('status_image_upload');
                $mime = $file->getMimeType();

                $image = $request->file('status_image_upload');

                $imageName = str_random(8) . '_' . $image->getClientOriginalName();
                //$imageFull = str_random(8).'_'.$image->getClientOriginalExtension();

                $userStatus = new Status();
                $userStatus->status_text = $text;
                $userStatus->image_url = $imageName;
                $userStatus->type = 1;
                $userStatus->user_id = Auth::user()->id;


                if ($mime == "video/x-flv" || $mime == "video/mp4" || $mime == "application/x-mpegURL" || $mime == "video/MP2T" || $mime == "video/3gpp" || $mime == "video/quicktime" || $mime == "video/x-msvideo" || $mime == "video/x-ms-wmv") {//process upload}

                    $vaildator = Validator::make($request->all(), $rules);
                    if (!$vaildator->fails()) {
                        $image->move('status_videos', $imageName);
                        $userStatus->type = 2;
                        $userStatus->save();
                        Flash::success('Your status has been posted');
                        return redirect(route('home'));
                    } else {
                        return back()->with('error', 'Validation failed:' . $vaildator->errors);
                    }
                } else {
                    $rules['status_image_upload'] = 'image';
                    $vaildator = Validator::make($request->all(), $rules);
                    if (!$vaildator->fails()) {
                        $image->move('status_images', $imageName);
                        $userStatus->type = 1;
                        $userStatus->save();
                        Flash::success('Your status has been posted');
                        return redirect(route('home'));
                    } else {
                        return back()->with('error', 'Validation failed:' . $vaildator->errors);
                    }
                }


            } else {
            }
            if (!$vaildator->fails()) {
                $userStatus = new Status();
                $userStatus->status_text = $text;
                $userStatus->user_id = Auth::user()->id;
                $userStatus->save();
                Flash::success('Your status has been posted');
                return redirect(route('home'));
            } else {
                return back()->with('error', 'Validation failed:' . $vaildator->errors);
            }


        }

        //Get top 15 post
        $user_id = Auth::id();
        $all_friends = Friends::where(['friend_id' => $user_id, 'status' => 1])
            ->orWhere(['user_id' => $user_id, 'status' => 1])
            ->get();

        $friends = [];
        foreach ($all_friends as $val) {
            array_push($friends, $val->user_id, $val->friend_id);
        }

        $unique_friends = array_unique($friends);

        if (!empty($unique_friends)) {
            $top_15_posts = Status::whereIn('user_id', $unique_friends)
                ->orderBy('id', 'DESC')
                ->take(15)
                ->get();
        } else {
            $top_15_posts = Status::where('user_id', $user_id)
                ->orderBy('id', 'DESC')
                ->take(15)
                ->get();
        }

        //Get available friend request
        $user_id = Auth::id();
        $available_req_count = Friends::where(['friend_id' => $user_id, 'status' => 0])
            ->orderBy('id', 'desc')
            ->get()
            ->count();

        return view('home', [
            'top_15_posts' => $top_15_posts,
            'available_req_count' => $available_req_count
        ]);
    }
}

Answer 1

使用连字符for="file upload"将for="file-upload"更改为-。 input的ID与for的{{1}}值不符。

在：

label

https://jsfiddle.net/v4wjutfc/

后：

<label for="file upload" class="custom-file-upload">
  <i class="fa fa-image"></i> or <i class="fa fa-video-camera"></i>
</label>
<input id="file-upload" name="status_image_upload" type="file">

https://jsfiddle.net/v4wjutfc/1/

自定义文件上传未显示

1 个答案: