2015-12-29 3 views
0

Я создаю простое приложение. Главная страница этого приложения отображаются все объекты с помощью одной модели, и когда я нажимаю на объекте, JS скрипт визуализации параметров объекта в <div> Я использую некоторые уродливые логику этого решения: добавить все параметры с HTML-теги в модели методDjango. Параметры модели рендера js

class SimpleObject(models.Model): 
    param1 = models.CharField(max_length=200) 
    param2 = models.CharField(max_length=200) 

    def object_info(self): 
     param1 = '<p>' + self.param1 + '</p>' 
     param2 = '<p>' + self.param2 + '</p>' 
     return param1 + param2 

отправить его по ListView:

class SimpleObjectList(ListView): 
    model = SimpleObject 

и сделать так (с начальной загрузки):

<div class="col-md-4"> 
{% for object in object_list %} 
    <ul class="nav nav-pills nav-stacked"> 
     <li class="object_item" name="{{object.object_info}}"> 
      <a href="#">{{object.param1}}</a></li> 
     </li> 
    </ul> 
{% endfor %} 
</div> 
<div class="col-md-8 object_info"> 
</div> 


$('.object_item').click(function(){ 
    var simple_object = this; 
    $('.object_info').empty();  
    $('.object_info').append($(simple_object).attr('name')); 
}); 

похоже, я тусклый t, но я определенно уверен, имею решение beter для этой проблемы. Можете ли вы помочь мне с какой-то лучшей практикой для работы с полем моделей И.С.

* Как это выглядит следующим образом: enter image description here

ответ

1

вы должны использовать .load() для загрузки только части DOM, который должен быть использован, чтобы показать новые данные с сервера.

идея:

<div> 
    {% for object in object_list %} 
    <a class="obj_cls" data-object_id="{{ object.id }}"></a> 
    {% endfor %} 
</div> 
<div class="snippet_wrapper"> 
    {% include "html_snippet_only_for_this_part.html" %} 
</div> 

<script src="http://code.jquery.com/jquery-1.11.3.min.js"></script> 
<script> 
$(function(){ 
    $('.obj_cls').on('click', function() { 
    var object_id = $(this).data('object_id'); 
    $('.snippet_wrapper').html('').load("/"+object_id, function() {   
    }); 
    }); 
}); 
</script> 

и вид с URL /PK/ где object_id это идентификатор щелкнули объекта должен сделать это:

def PartyDetailView(DetailView): 
    model = YourModel 
    template_name = "html_snippet_only_for_this_part.html" 

и содержание html_snippet_only_for_this_part.html просто:

<div> 
    {{ object.name }} etc etc... 
</div> 

надеюсь, это поможет! :)

+0

отлично! спасибо –

Смежные вопросы