Question

我有2个课程，我想根据第一个课程显示第二个课程的字段列表。例如：

servico：

id  desc_servico
1   teste1
2   teste2

itemservico：

id desc_itemservico servico
1  itemteste1        1
2  itemteste2        2

在这个例子中，如果我选择servico = 1，则itemservico必须向我显示itemteste1。如果我选择servico = 2，则itemservico必须显示itemteste2。

Models.py：

class servico(models.Model):
    desc_servico = models.CharField('Descrição', max_length=50, default='', blank=False, null=False)

class itemservico(models.Model):
    desc_itemservico = models.CharField('Descrição', max_length=50, default='', blank=False, null=False)
    val_itemservico = models.DecimalField(max_digits=8, decimal_places=2)
    servico = models.ForeignKey(servico, default='', blank=True, null=True)  # Chave estrangeira da Classe Serviço
    ind_selecionado = models.BooleanField(default=False)

forms.py：

class itemservicoForm(forms.ModelForm):
    servico = forms.ModelChoiceField(queryset=servico.objects.all().order_by('desc_servico'), empty_label="Serviço")

    class Meta:
        model = itemservico
        fields = (
                    'servico',
                  )

template.html：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>ORÇAMENTO</title>
</head>
<body>
<h2>ORÇAMENTO</h2>

    <form class=" bd-form-20 " action="" name="form-name" method="POST" enctype="multipart/form-data">
    {% csrf_token %}

        <label class="bd-form-label" >Serviço  </label>{{form.servico}}<br><br>
        <p><h1>{{form.servivo.id}}</h1></p>

          <div class=" bd-customhtml-29 bd-tagstyles bd-custom-table">
            <div class="bd-container-inner bd-content-element">
              <table border="1" rules="all" cellspacing="0" cellpadding="10">
                <tbody>

                <tr>
                    <th>Testar</th>
                    <th>Selecionar</th>
                    <th>ID Item Serviço</th>
                    <th>Item Serviço</th>
                    <th>Valor Serviço</th>
                    <th>Serviço</th>
                </tr>

                {% for item in instance_itens %}
                <tr>
                        <td> <input type="checkbox" id="item.ind_selecionado"></td>
                        <td>{{ item.ind_selecionado }}</td>
                        <td>{{ item.id }}</td>
                        <td>{{ item.desc_itemservico }}</td>
                        <td>{{ item.val_itemservico }}</td>
                        <td>{{ item.servico_id}}</td>
                </tr>
                {% endfor %}
                </tbody>

              </table>
            </div>
          </div>

    </form>

    <br><br>
    <button class="bd-linkbutton-60  bd-button  bd-own-margins bd-content-element"  type = "submit" >
    OK</button>

</body>
</html>

Answer 1

我认为您需要使用Ajax帖子根据选择生成结果。

对于view.py部分，您需要使用此函数：

def ajax_post(request):
if request.POST:
    if request.POST.get('servico') and request.is_ajax():
        itemservico_list = itemservico.objects.filter(servico = request.POST.get('servico'))
        return render_to_response('itemservico.html',{'itemservico_list':itemservico_list})

对于Html部分，您需要生成itemservico.html分隔并将其包含到主html中，例如

<form method="post">{% csrf_token %}
<tbody><tr>
<th>Testar</th>
<th>Selecionar</th>
<th>ID Item Serviço</th>
<th>Item Serviço</th>
<th>Valor Serviço</th>
<th id='targetselection'>Serviço</th>
</tr>
<div id='inner'>
{% include "itemservico.html" %}
</div>
</tbody>
</form>

您需要为itemservico创建另一个html文件，例如

{% for item in itemservico_list %}
<tr>
<td> <input type="checkbox" id="item.ind_selecionado"></td>
<td>{{ item.ind_selecionado }}</td>
<td>{{ item.id }}</td>
<td>{{ item.desc_itemservico }}</td>
<td>{{ item.val_itemservico }}</td>
<td>{{ item.servico_id}}</td>
</tr>
{% endfor %}

对于JS部分，您需要创建一个js文件，检测状态发生变化或按下任何给定字段:(我使用jquery进行选择）

$('#targetselection').on('change keyup paste', function() { 
    servico = $(this).val() // get the current value of the input field.
    ajaxPost(servico);
});

function ajaxPost(query){
  $.ajax({
            type:"POST",
            url:'',
            data: {
                csrfmiddlewaretoken:token,
                servico : servico
            },
            dataType:'html',
            success:function (data,textStatus,jqXHR){
            $('#inner').html(data);
            }
        });
}

总结：当网站上的某些选择发生变化时，它会在服务器上创建一个ajax请求。作为视图部分，您根据ajax post请求过滤数据。渲染html文件并将其推送到网页的特定部分。我希望这会有所帮助

显示基于选择第一个字段的字段列表

1 个答案: