从服务器接收数据而不更新页面

时间:2017-11-08 02:41:45

标签: javascript python django

美好的一天!  我原谅宽恕,我在编程方面是零。但我想学习。我需要使用POST方法传输数据,而不更新页面。通过django,javascript和views.py应该怎么样!

  <form class="form-horizontal" role="form" method="post" id="lol">
            <div class="form-group">
            <label for="" class="col-sm-2 control-label">ФИО</label>
                <div class="col-sm-4">
            <input name="firstname" class="form-control"  placeholder="ФИО">
                </div>
            </div>
            <div class="form-group">
            <label for="" class="col-sm-2 control-label">Шифр Группы</label>
                <div class="col-sm-4">
            <input  name="Code" class="form-control"  placeholder="Шифр Группы">
                </div>
            </div>
            <div class="form-group">
            <label for="" class="col-sm-2 control-label">Пол</label>
                <div class="col-sm-4">
            <input  name="Pol" class="form-control"  placeholder="М или Ж">
                </div>            </div>
            <div class="form-group">
            <label for="" class="col-sm-2 control-label">Семейное положение</label>
                <div class="col-sm-4">
            <input name="Floor" class="form-control"  placeholder="0 или 1">
                </div>
            </div>
            <div class="form-group">
            <label for="" class="col-sm-2 control-label">Номер комнаты</label>
                <div class="col-sm-4">
            <input name="Room" class="form-control"  placeholder="Номер комнаты">
                </div>
                </div>
  <div class="form-group">
    <div class="col-sm-offset-2 col-sm-10">
      <button type="submit" class="btn btn-default">Войти</button>
    </div>
  </div>
</form>
<div class="examples">

    <script language="javascript" type="text/javascript">
    </script>

    <div class="results">Ждем ответа</div>

    @csrf_exempt
def polls(request, form=None):
    if request.method == 'POST' and form.is_valid():
        pass
    else:
        return render(request, 'base.html')

1 个答案:

答案 0 :(得分:0)

在Html页面中,首先将“Войти”按钮的类型从“提交”更改为“按钮”

<div class="col-sm-offset-2 col-sm-10">
   <button type="submit" id="submit_button" class="btn btn-default">Войти</button>
</div>

将id标记添加到所有输入元素。例如

<input name="firstname" id="firstname" class="form-control"  placeholder="ФИО">
<input  name="Code" id="Code" class="form-control"  placeholder="Шифр Группы">

然后在html页面中添加脚本

<script type="text/javascript">
    $('#submit_button').click( function (){

      $.ajax({
          url: '/submit/',
          data: {
          'firstname': $("#firstname").val(),
          'Code': $("#Code").val(),
          // and all other input element

          },
          type: 'post',
          cache: false,

          success: function (data) {
            if (data.status)
            {
             alert('Post method');
            }
            else{
              alert('error')
            }
          }

        });


    });
</script>

然后将此行添加到django

的项目urls.py文件中
urlpatterns = [

    url(r'',include('YourAppName.urls')),
]

然后在app目录中创建urls.py文件并添加

from django.conf.urls import url
from . import views

urlpatterns =   [
    url(r'^submit/', views.get_ajax_request, name='ajaxPost'),
]

在视图中,您的代码就像

import json
from django.shortcuts import HttpResponse
from django.core.serializers.json import DjangoJSONEncoder

def get_ajax_request(request):

    room = request.POST.get('Room') # get html element value by name tag of element
    ##############
     Your Operation
    ##############

    response = {'status':True,'msg':'Success'}
    return HttpResponse(json.dumps(response, cls=DjangoJSONEncoder))