<django RestaurantShare PJT> 맛집 상세정보 출력 (DB값에 따른 url 동적처리 방법)

 

위의 <왼쪽 그림>처럼 맛집을 추가하면, restaurant table에 data가 등록되고,
<오른쪽 그림>처럼 추가한 db가 보인다.

<오른쪽 그림>의 소스인 index.html의 restaurant table의 data 등록되는 부분을 살펴보면

{% for restaurant in restaurants %}
	{% if restaurant.category == category %}
		<div class = "input-group">
			<span class="input-group-addon">
				<input name="'checks" id="check{{restaurant.id}}" type="checkbox" value="{{restaurant.id}}">
			</span>
			<a href="restaurantDetail/{{restaurant.id}}">
			<input name="res{{restaurant.id}}" id="res{{restaurant.id}}" type="text" class="form-control" disabled style="cursor:pointer;" value="{{restaurant.restaurant_name}}"></a>
		</div>
	{% endif %}
{% endfor %}

위와 같이 id나 href가 DB의 restaurant 테이블(모델)에 있는 id 값을 참조한다.
이 id 값은 초기 1부터 생성할때마다 1씩 올라간다.
즉, restaurant Data가 채워질 때마다 맛집 목록이 추가되고, 맛집에 대한 세부사항을 볼 수 있는 url이 추가된다.

이를 처리해주기 위해서 urls.py의 6번째 줄을 보면,

from django.urls import path, include
from . import views

urlpatterns = [
    path('',views.index, name='index'),
    path('restaurantDetail/<str:res_id>', views.restaurantDetail, name='resDetailPage'),
    path('restaurantCreate/', views.restaurantCreate, name='resCreatePage'),
    path('restaurantCreate/create', views.Create_restaurant, name='resCreate'),
    path('categoryCreate/', views.categoryCreate, name='cateCreatePage'),
    path('categoryCreate/create', views.Create_category, name='cateCreate'),
    path('categoryCreate/delete', views.Delete_category, name='cateDelete'),

    ]

<str:res_id>의 형식으로 restaurantDetail/<str:res_id> 를 표현했다. 이렇게 꺽쇠로 표현된 것은 동적인 값을 의미한다.
그리고 꺽쇠 안에 있는 이름으로 서버에서 받아내겠다는 의미이다.
콜론을 중심으로 좌측에는 어떤 데이터 타입으로 받을 지를 결정해주며, 우측은 어떤 이름으로 받을 지를 결정해준다.

res_id에 대한 설정을 해줘야하므로 views.py로 가서

def restaurantDetail(request, res_id):
    restaurant = Restaurant.objects.get(id = res_id)
    content = {'restaurant': restaurant}
    #return HttpResponse("restaurantDetail")
    return render(request, 'shareRes/restaurantDetail.html', content)

와 같이 수정해준다.

그리고 http://127.0.0.1:8000/restaurantDetail/2 의 url로 접속해보면 아래와같이 잘 접속되는 것을 알 수 있다.

이제 restaurant의 id값이 2인 data의 내용을 빈칸에 넣어주는 소스만 작성해주면 완성되는데,

그러기 위해서는 restaurantDetail.html로 가서 아래처럼 채워준다.

        <div class="content">
            <div class="inputDiv">
                <div class="input-group">
                    <span class="input-group-addon" id="sizing-addon2">카테고리</span>
                    <input id="resCategory" name="resCategory" type="text" class="form-control" disabled value="{{restaurant.category.category_name}}">
                </div>
                <div class="input-group">
                    <span class="input-group-addon" id="sizing-addon2">맛집 이름</span>
                    <input id="resTitle" name="resTitle" type="text" class="form-control" disabled value="{{restaurant.restaurant_name}}">
                </div>
                <div class="input-group">
                    <span class="input-group-addon" id="sizing-addon2">관련 링크</span>
                    <input id="resLink" name="resLink" type="text" class="form-control" disabled value="{{restaurant.restaurant_link}}">
                </div>
                <div class="input-group">
                    <span class="input-group-addon" id="sizing-addon2">상세 내용</span>
                    <textarea id="resContent" name="resContent" cols="90" rows="10" disabled>{{restaurant.restaurant_content}}</textarea>
                </div>
                <div class="input-group">
                    <span class="input-group-addon" id="sizing-addon2">장소 키워드</span>
                    <input id="resLoc" name="resLoc" type="text" class="form-control" disabled value="{{restaurant.restaurant_keyword}}">
                </div>
                <a href ="/" class="resAddBtn btn btn-info" role="button">홈으로</a>
            </div>
        </div>

그러면 아래와같이 완성.