jquery - 没有提交的Django jquery表单验证

Question

我正在开发一个 Django Web 应用程序，并且正在使用带有自定义验证器的表单（例如，用于 IP 地址）。我的网络布局是一个侧边栏，其中包含一些项目（模型）的列表，单击这些项目在主 div 中打开项目编辑器（= 更改 div 的内容）。像这样的东西：

<li class="nav-item">
  <a class="nav-link"
      onclick="changeMainContent('{% url "edit" pk=item.id %}')">
                    {{ item.name }}
  </a>
</li>

changeMainContent 脚本如下所示：

function changeMainContent(url) {
    $("#main-wrapper").load(url);
}

单击侧边栏 div 中的链接后，主包装器 div 内容会更改。那里没问题。

表格：

class Item(forms.ModelForm):
class Meta:
    model = models.Item
    fields = ['ip_subnet']

    ip_subnet = IPAddrSubnetField(widget=forms.TextInput(attrs={'placeholder': 'IP subnet'}))

IPAddrSubnetField 实现了自己的验证。

在 web 的第一个版本中，我在不更改一个 div 的内容的情况下进行了链接，因此整个页面都会重新加载。因此，每个子页面（.html 文件）都必须包含所有元素（侧边栏、主 div、页脚等）。使用这种新方法，edit.html 仅包含表单，因为侧边栏/页脚等已经存在。问题出在 Django 验证中。在第一个版本中，它运行得很好，因为它返回了一个填充的表单，其中可能是红色的无效字段，这是完美的。在这种新方法中虽然这是一个问题，因为我只能从 html 中获得纯文本 - 没有侧边栏，没有页脚，没有样式......这显然是一个问题。

我想做的是某种形式的ajax表单验证......？这个想法是，要么a）具有无效输入的字段会在没有显式提交表单的情况下立即变红，或者b）提交表单只会为无效字段添加带有一些错误消息的红色边框，但保持原始页面不变.

我怎么会去做那样的事情？

标签： jquerydjangoajaxformsvalidation