使用自定义小部件覆盖Django JSONField

时间:2020-07-07 13:30:33

标签: json django forms widget

我正在尝试使用django-json-widget之类的三方小部件来编辑表单中的JSONField。

这是到目前为止我的表格的外观:

class ConfigsForm(forms.Form):
    ks_config = JSONField()

此代码可以正常工作,但是界面非常难看。我正在寻找类似 django-json-widget 包的东西来能够编辑JSON数据。但是到目前为止,我还无法正确实现它。 这是我的看法:

def configs_details(request, sim_id):
    simulation = get_object_or_404(Simulation, pk=sim_id)
    
    ks_config = os.path.join(os.getcwd(),'configs', str(simulation.uuid), 'ks_config.json')
    with open(ks_config) as jsn:

        form = ConfigsForm(request.POST or None,initial={'ks_config': json.load(jsn)})
        if form.is_valid():
            # validate and save
            pass

    template = 'sim_configuration.html'
    context = {'Form': form}
    return render(request,template, context)

我尝试过的事情

在上面的表单中添加以下行:

class ConfigsForm(forms.Form):
    ks_config = JSONField()
    widgets = {
        'ks_config':  JSONEditorWidget(mode='code')
    }

此外,我必须专门使用Form而不是ModelForm。

这是我的HTML表单页面:

{% extends 'base.html' %} {% block head %}
<title>Configs</title> {% endblock head %} {% block body %}
<div class="container">
  <br>
  <form action="" method="post">
    {% csrf_token %} {{ Form.as_p}}
    <input type="submit" value="Submit" />
  </form>
</div>
{% endblock body %}

1 个答案:

答案 0 :(得分:0)

在表单元素顶部添加export LANG=en_US.UTF-8

{{ Form.media }}
class ConfigsForm(forms.Form):
    ks_config = JSONField(widget=JSONEditorWidget(mode='code'))