CODEWITHSUNDEEP
htmldjangodjango-formsdjango-views
Lucky
Lucky

Reputation: 106

Django form submit is not working

I am trying to render a django form with custom styles. When i submit the form it is not working. But when i render the form without custom styles it is working. Below code is my html file content. Could anybody help me to solve my problem.

{% 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>

Upvotes: 0

Views: 3802

Answers (1)

drew
drew

Reputation: 781

Add the name of the view that processes the form into the action element of the form tag:

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

Even though it is not technically required, it is best practise to add it anyway.

If this does not work, check the browser console for any errors.

Upvotes: 3

Related Questions