【问题标题】：Display JavaScript alert after form submit - Django表单提交后显示 JavaScript 警报 - Django
【发布时间】：2017-04-23 01:22:37
【问题描述】：

我试图在提交的表单有效与否时显示警报。
在视图中，我有一个隐藏的输入，如果表单有效或无效，它会更改值。

我有这个 JavaScript：

$( document ).ready(function() {
  if (document.registroForm.alert.value==1){
    swal("¡Bien hecho!", "El registro fue exitoso.", "success")
  }
  if (document.registroForm.alert.value==0){
    swal("¡Oops!", "Algo salió mal.", "error")
  }
});

问题是我每次刷新页面时都会收到警报。
我只想在用户提交表单并刷新页面时这样做

谢谢。

问题解决了。

我所做的是在页面加载时将变量“alert”设置为 None。表单提交后发生变化：（我在views.py上修改了这个）

views.py

def registroUsuario(request):
    if request.method == "POST":
        form = registroForm(request.POST or None)
        if form.is_valid():
            alert = 1
            instance = form.save(commit=False)
            instance.is_active = False
            instance.save()
        else:
            alert = 0
    else:
        alert = None
        form = registroForm()
    context = {
        "titulo": "Registrarse",
        "form": form,
        "alert": alert,
    }
    template = "micuenta/registro.html"
    return render(request, template, context)

和我的 .html：

<form method="POST" action=".">
[... some labels and inputs ...]
<input type="hidden" name="alert" value="{{alert}}" readonly>
</form>
<script>
$( document ).ready(function() {
  if (document.registroForm.alert.value==1){
    swal("¡Bien hecho!", "El registro fue exitoso.", "success")
  }
  if (document.registroForm.alert.value==0){
    swal("¡Oops!", "Algo salió mal.", "error")
  }
});
</script>

谢谢。

【问题讨论】：

如何刷新页面？作为获取还是发布？
作为 POST 方法。
由于数据是使用隐藏值集发布的，因此它会保留该值。也许尝试刷新页面作为获取。
显示更多代码...帖子提交是如何发生的...真的吗？
另一种可能性是，当您需要显示弹出窗口的条件时，将其存储在 sessionStorage 中，并在显示警报后将其删除。

标签： javascript django django-forms

【解决方案1】：

我以前用过类似的东西。

$( document ).ready(function() {
    $('#your-form').on('submit', function(e) {
        e.preventDefault();
          if (document.registroForm.alert.value==1){
                swal("¡Bien hecho!", "El registro fue exitoso.", "success");
                return true;

          } else if (document.registroForm.alert.value==0){
                swal("¡Oops!", "Algo salió mal.", "error")

          }
    });
});

无论你如何完成它，我相信你需要一个事件监听器来提交表单并默认禁用回发。然后，您可以检查是否提交有效。

【讨论】：

【解决方案2】：

您可以使用标志变量来控制它。您通过 URL 传递变量。

在您的按钮中：

<button type="button" onclick="myFunction(1)">Submit</button>

在同一页面的脚本中：

<script type="text/javascript">
   function myFunction(value){
        window.location = "page.html?myVariabel="+value;
   }
</script>

在您要检查和显示的页面中，您可以使用这个：

<script type="text/javascript">
    var query = location.search.slice(1);
    var part = query.split('=');
    if(part[1] == 1){
        //Your code
    }
</script>

【讨论】：

【解决方案3】：

我所做的是在页面加载时将变量“alert”设置为 None。表单提交后发生变化：（我在views.py上修改了这个）

views.py

def registroUsuario(request):
    if request.method == "POST":
        form = registroForm(request.POST or None)
        if form.is_valid():
            alert = 1
            instance = form.save(commit=False)
            instance.is_active = False
            instance.save()
        else:
            alert = 0
    else:
        alert = None
        form = registroForm()
    context = {
        "titulo": "Registrarse",
        "form": form,
        "alert": alert,
    }
    template = "micuenta/registro.html"
    return render(request, template, context)

和我的 .html：

<form method="POST" action=".">
[... some labels and inputs ...]
<input type="hidden" name="alert" value="{{alert}}" readonly>
</form>
<script>
$( document ).ready(function() {
  if (document.registroForm.alert.value==1){
    swal("¡Bien hecho!", "El registro fue exitoso.", "success")
  }
  if (document.registroForm.alert.value==0){
    swal("¡Oops!", "Algo salió mal.", "error")
  }
});
</script>

谢谢。

【讨论】：