Django/Jquery表单提交_Jquery_Django

Django/Jquery表单提交

jquery django

Django/Jquery表单提交,jquery,django,Jquery,Django,我试图创建一个带有表单验证的简单输入框，但我不能100%确定如果成功，如何向URL发送帖子。我不是100%确定我是否需要在jquery脚本中发布帖子，或者我是否还需要修改views.py文件中的任何内容 <html> <head> <meta charset="utf-8"> <title>Demo</title> </head> <body> <script src="{{ ST

我试图创建一个带有表单验证的简单输入框，但我不能100%确定如果成功，如何向URL发送帖子。我不是100%确定我是否需要在jquery脚本中发布帖子，或者我是否还需要修改views.py文件中的任何内容

<html>
 <head>
    <meta charset="utf-8">
    <title>Demo</title>
  </head>

<body>

<script src="{{ STATIC_URL }}js/jquery.js"></script>

<script type="text/javascript">
jQuery(function(){
        $("#btn-search").click(function(){
        $(".error").hide();
        var hasError = false;
        var searchReg = /^[a-zA-Z0-9-]+$/;
        var searchVal = $("#search-text").val();
        if(searchVal == '') {
            $("#search-text").after('<span class="error">Please enter a search term.</span>');
            hasError = true;
        } else if(!searchReg.test(searchVal)) {
            $("#search-text").after('<span class="error">Enter valid text.</span>');
            hasError = true;
        }
        if(hasError == true) {return false;}
                            else {
                                    $("#search-text").after('<span class="error">Search term accepted.</span>');
                                    return false;
                            }
    });
});
</script>

<form method="post" name="form1" action="/whatmask_output/">
{% csrf_token %}
     <fieldset>
          <div><label>Search:</label><input type="text" name="search-text" id="search-text" value="" size="32" /></div>
          <div><label></label><input type="submit" value="Submit" id="btn-search" /></div>
     </fieldset>
</form>

</body>
</html>


演示
jQuery（函数（）{
$（“#btn搜索”）。单击（函数（）{
$（“.error”）.hide（）；
var hasError=false；
var searchReg=/^[a-zA-Z0-9-]+$/；
var searchVal=$（“#搜索文本”）.val（）；
如果（searchVal=''）{
$（“#搜索文本”）。之后（'请输入搜索词'）；
hasrerror=true；
}如果（！searchReg.test（searchVal））则为else{
$（“#搜索文本”）。在（'输入有效文本'）之后；
hasrerror=true；
}
如果（hasError==true）{return false；}
否则{
$（“#搜索文本”）。在（'接受搜索词'）之后；
返回false；
}
});
});
{%csrf_令牌%}
搜索：

有什么想法吗？

给你的表格一个id：

<form method="post" id="form1" name="form1" action="/whatmask_output/">

为您的表单提供一个id：

<form method="post" id="form1" name="form1" action="/whatmask_output/">

有两件事需要改变。首先，替换

$("#btn-search").click(function(){

与

因为可以通过在文本框中点击return/enter来提交搜索表单，完全绕过按钮

第二，改变

else {
    $("#search-text").after('<span class="error">Search term accepted.</span>');
    return false;
}

else{
$（“#搜索文本”）。在（'接受搜索词'）之后；
返回false；
}

到

else{
$（“#搜索文本”）。在（'接受搜索词'）之后；
返回true；
}

这将允许

提交

继续进行，无需进一步干预。

有两件事需要更改。首先，替换

$("#btn-search").click(function(){

与

因为可以通过在文本框中点击return/enter来提交搜索表单，完全绕过按钮

第二，改变

else {
    $("#search-text").after('<span class="error">Search term accepted.</span>');
    return false;
}

else{
$（“#搜索文本”）。在（'接受搜索词'）之后；
返回false；
}

到

else{
$（“#搜索文本”）。在（'接受搜索词'）之后；
返回true；
}

这将允许

提交

继续进行，无需进一步干预