在django-crispy-forms字段中添加或添加图标 [英] Prepend or append icon in field of django-crispy-forms

问题描述

我在表单中有以下字段:

I have the following field in a Form:

<div class="form-group ">
 <div class="input-group">
  <input class="form-control" id="To" name="To" placeholder="To" type="text"/>
  <i class="glyphicon glyphicon-map-marker form-control-feedback"></i>
 </div>
</div>

看起来像

并且我正在尝试使用 crispy-forms 获得类似的结果.

and I am trying to have a similar result using crispy-forms.

我尝试过

self.helper.layout = Layout(
            Fieldset(
                'Title',
                PrependedText(
                    'From',
                    <i class="glyphicon glyphicon-map-marker"></i>
                    ),
                'To',
                'Date',
                ButtonHolder(
                    Submit('submit', 'Search', css_class='button white')
                )
            )
        )

但是我得到一个 SyntaxError:无效的语法.

是否可以在 crispy-forms 中添加图标作为PrependedText?如果没有，还有其他选择吗?

Is it possible to add an icon as PrependedText in crispy-forms? If not, is there any alternative?

(编辑)

尝试

self.helper.layout = Layout(
                        Field(PrependedText('From', HTML('<span class="glyphicon glyphicon-map-marker"></span>')), placeholder='From'),
                        'To',
                        'Date',
                        ButtonHolder(
                            Submit('submit', 'Search', css_class='button white')
                        )
                    )

不会引发任何错误，但不会显示任何图标.

does not raise any error, but no icon is shown.

推荐答案

self.helper.layout = Layout(
   Div(HTML('''
       <div class="input-group"> 
         <input class="form-control" id="To" name="To" placeholder="To" type="text"/>
         <i class="glyphicon glyphicon-map-marker form-control-feedback"></i> 
       </div>'''), 
      class="form-group") 

这篇关于在django-crispy-forms字段中添加或添加图标的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！