i want to have category name instead to category id
how can i achive that
here is my SubCategory modal
protected $fillable = [
'name', 'category_id',
];
public function category(){
$this->hasMany(Category::class);
}
and Category model is
protected $fillable = [
'name',
];
public function subcategory(){
$this->belongsTo(SubCategory::class);
}
may SubCategoryController is
public function index()
{
return view('admin.subcategory.index')->with('subcategories',SubCategory::all())->with('categories',Category::all());
//
}
and my SubCategory blade file is
@extends('admin.dashboard')
@section('content')
<!-- ########## START: MAIN PANEL ########## -->
<div class="sl-mainpanel">
<nav class="breadcrumb sl-breadcrumb">
<a class="breadcrumb-item" href="{{ route('subcategory.index') }}">Category</a>
<span class="breadcrumb-item active">Sub Category</span>
</nav>
<div class="sl-pagebody">
<div class="card pd-20 pd-sm-40">
<h6 class="card-body-title">Sub Category List
<a href="" class=" btn btn-sm btn-warning" style="float: right" data-toggle="modal" data-target="#addCategoryModal" >Add New</a>
</h6>
<div class="table-wrapper">
<table id="tabledata1" class="table display responsive nowrap">
<thead>
<tr>
<th class="wd-15p">ID</th>
<th class="wd-15p">Sub Category</th>
<th class="wd-15p">category_id</th>
<th class="wd-20p">Edit</th>
<th>Delete</th>
</tr>
</thead>
<tbody>
@foreach ($subcategories as $subcategory)
<tr>
<td>{{ $subcategory->id }}</td>
<td>{{ $subcategory->name }}</td>
<td>{{ $subcategory->category_id }}</td>
<td><a href="{{ route('category.edit',$subcategory->id) }}" class=" btn btn-sm btn-info">Edit</a></td>
<td>
<form action="{{ route('subcategory.destroy',$subcategory->id) }}" method="POST">
@csrf
@method('DELETE')
<button type="submit" class="btn btn-sm btn-danger delete-confirm" style="float:" id="delete-confirm" >Delete</button>
</form>
</td>
</tr>
@endforeach
</tbody>
</table>
</div><!-- table-wrapper -->
</div><!-- card -->
</div><!-- sl-pagebody -->
</div><!-- sl-mainpanel -->
<!-- ########## END: MAIN PANEL ########## -->
<!-- LARGE MODAL -->
<div id="addCategoryModal" class="modal fade">
<div class="modal-dialog modal-lg" role="document">
<div class="modal-content tx-size-sm">
<div class="modal-header pd-x-20">
<h6 class="tx-14 mg-b-0 tx-uppercase tx-inverse tx-bold">
Add Category
</h6>
<button type="button" class="close" data-dismiss="modal" aria-label="Close">
<span aria-hidden="true">×</span>
</button>
</div>
<div class="modal-body pd-20">
<form method="POST" action="{{ route('subcategory.store') }}" enctype="multipart/form-data">
@csrf
<div class="form-group">
<label for="Category">Sub Category Name</label>
<input type="text" class="form-control" required id="name" name="name" placeholder="Sub Category name">
</div>
<div class="form-group">
<label for="Category">Category Name</label>
<select name="category_id" id="category_id">
@foreach ($categories as $category)
<option value="{{ $category->id }}">{{ $category->name }}</option>
@endforeach
</select>
</div>
</div><!-- modal-body -->
<div class="modal-footer">
<button type="submit" class="btn btn-info pd-x-20">Save changes</button>
<button type="button" class="btn btn-secondary pd-x-20" data-dismiss="modal">Close</button>
</div>
</form>
</div>
</div><!-- modal-dialog -->
</div><!-- modal -->
@endsection