Question

我正在尝试使用自定义样式呈现django表单。当我提交表格时，它不起作用。但是当我渲染没有自定义样式的表单时，它正在工作。下面的代码是我的html文件内容。任何人都可以帮我解决我的问题。

{% load staticfiles %}

<!DOCTYPE html>
<html>
<head>
    <link rel="stylesheet" type="text/css" href='{% static "signup/css/style.css" %}' />
    <link href="http://www.jqueryscript.net/css/jquerysctipttop.css" rel="stylesheet" type="text/css">
    <title>SignUp</title>
</head>
<body>
    <form id="msform" action="" method="post">
      <!-- progressbar -->
    {% csrf_token %}
      <center>
      <ul id="progressbar">
        <li class="active">Location on Map</li>
        <li>Personal Details</li>
        <li>Account Setup</li>
      </ul>
      </center>
      <!-- fieldsets -->
      <fieldset>
        <h2 class="fs-title">Location on Map</h2>
        <h3 class="fs-subtitle">Your address on planet Earth</h3>
        <div id="googleMap" style="padding: 119.4px;border: 1px solid #ccc;border-radius: 4px;margin-bottom: 10px;width: 100%;box-sizing: border-box;"></div>
        <script>
        function initialize() {
          var myLatLng = {lat: -25.363, lng: 131.044};
          var mapProp = {
            center:new google.maps.LatLng(17.508742,79.120850),
            zoom:5,
            mapTypeId:google.maps.MapTypeId.ROADMAP
          };
          var map=new google.maps.Map(document.getElementById("googleMap"), mapProp);
          google.maps.event.addDomListener(window, 'load', initialize);
          google.maps.event.trigger(initialize, "resize");
        }
    </script>
        <script async defer src="https://maps.googleapis.com/maps/api/js?key=AIzaSyCpwz7s9u7ZOnrhafotZ_Pas-LLsMaapiQ&callback=initialize"></script>
        <input type="button" name="next" class="next action-button" value="Next" />
      </fieldset>
      <fieldset>
        <h2 class="fs-title">Personal Details</h2>
        <h3 class="fs-subtitle">We will never sell it</h3>
        {{ form.fname }}
        {{ form.lname }}
        {{ form.phone }}
        {{ form.address }}
        <input type="button" name="previous" class="previous action-button" value="Previous" />
        <input type="button" name="next" class="next action-button" value="Next" />
      </fieldset>
      <fieldset>
        <h2 class="fs-title">Create your account</h2>
        <h3 class="fs-subtitle">Your Account Deatils</h3>

        {{ form.username }}
        {{ form.email }}
        {{ form.password }}
        {{ form.cpassword }}
        <input type="button" name="previous" class="previous action-button" value="Previous" />
        <input type="submit" name="submit" class="submit action-button" value="Submit" />
      </fieldset>

    </form>
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
    <script src='{% static "signup/js/jquery.easing.min.js" %}' type="text/javascript"></script>
    <script type="text/javascript" src='{% static "signup/js/jqueryS.js" %}'></script>
</body>

Answer 1

将处理表单的视图名称添加到表单标记的action元素中：

<form id="msform" action="{% url 'my_form_view'  %}" method="post">

即使技术上不需要，但最好还是添加它。

如果这不起作用，请检查浏览器控制台是否有任何错误。

Django表单提交无效

1 个答案: