使文本框根据下拉选择自动填充(laravel)

时间:2019-01-06 05:45:58

标签: javascript php laravel laravel-5.5

我是laravel的新手,我只想问一下在下拉菜单中选择数据时,如何填写另一个文本框。 在我名为“ booklist”的表中 我有此列“ book_title”和“ type_id” 与“ booktypes”表有关系 带有“ type_id”和“ book_types”列的

我想根据我在下拉菜单中选择的书名显示书籍类型 (例如,几何(标题)数学(类型))

现在我只能根据此代码显示和选择下拉菜单中的所有图书类型

<div class="form-group">
<label>Select Book</label>
<select class="form-control" name="book_id">
<option value="">-----------</option>
 @foreach ($booklist as $boo)
<option value="{{$boo->book_id}}">{{ $boo->book_title }}</option>
 @endforeach
</select>
</div>

我的ShelfController

public function addshelfa()
{
    return view('addshelf.addtoshelfa',['booklist'=>Booklist::all()]);
}

如果例如几何图形的选择要在此处显示其类型:

<div class="form-group">
<label>Book Type</label>


<input value="" type="text" class="form-control" name="type_id" disabled>



</div>

1 个答案:

答案 0 :(得分:1)

要实现这种功能,您需要添加ajax调用,这将是一个很长的答案。所以,我一步一步地做,这是一个粗糙的照相版。

第1步:您的Ajax功能部分,

  // meta tag add inside your html head
  <meta name="csrf-token" content="{{ csrf_token() }}" />

    // ajax header setup
        $.ajaxSetup({
            headers: {
            'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
            }
        });

    /**
     * change book action
     */
    // you need to give id attribute to book_id field.
    $(document).on('change', '#book_id', function (e) {
        e.preventDefault();
        var book_id = $('#book_id').val();
        var route = "/book-type/set";
        $.ajax({
            type: 'POST',
            url: route,
            data: {
                book_id: book_id
            },
            success: function (data) {
                   // you can check for status here 
                   $("input[name=type_id]").val(data.book_type_id);

            },
            error: function(XMLHttpRequest) {
                // toastr.error('Something Went Wrong !');
            }
        });
    });

第2步:后端处理部分

为句柄请求定义路由,

    Route::post('/book-type/set', 'YourController@bookTypeSet');

定义您的方法,

    public function bookTypeSet(Request $request) 
    {
        // this is a rough prototype you need to give your actual data from here
        $bookId = $request->get('book_id');

        $book = Book::findOrFail($bookId);

        $bookType = $book->bookTypes;

        return response()->json(['book_type_id'=>$bookType->id, 'status'=>'200']);
    }