Django / Jquery表单提交

时间:2012-04-10 21:32:05

标签: jquery django

我试图创建一个带有表单验证的简单输入框,但我不能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>

任何想法??

2 个答案:

答案 0 :(得分:1)

要改变两件事。首先,替换

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

$("form").submit(function(){

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

其次,改变

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

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

这应该允许submit继续进行而无需进一步干预。

答案 1 :(得分:0)

给你的表单一个id:

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

无论何时您准备提交使用:

$('#form1').submit();