jquery:提交表单并将变量值传递给Python

时间:2017-07-13 15:39:07

标签: javascript jquery post html-form

我正在尝试将表单的值和fromtill变量的值传递给Python。但结果是变量的形式或价值的转移或价值。

如果我只发布var a = $('#form').serialize();然后在python中我可以通过应用form.projects.data

自由获取值

如果我发布var a = $('#form').serialize();和变量fromtill,那么在python中,变量会以下列形式显示:projects=1,这会导致额外的处理。< / p>

{% set d_from, d_till = from_till %}

{% block module_scripts %}
    {{ super() }}
    <script>
        var from = '{{ d_from.strftime("%m/%d/%Y") }}';
        var till = '{{ d_till.strftime("%m/%d/%Y") }}';

        $(function my() {
            $("#reservation").daterangepicker({
                "locale": {
                    "format": "DD/MM/YYYY"
                },
                "opens": "right",
                "showDropdowns": true,
                "showWeekNumbers": true
            }, function (start, end, label) {
                from= start.format('MM/DD/YYYY');
                till = end.format('MM/DD/YYYY');
            });
        });

        $( "#go" ).click(function() {
            var a = $('#form').serialize();
            $.post(
                '{{ url_for("reporting_backoffice.download_report") }}', {
                    a:a,
                    d_from: from,
                    d_till: till
                }
            );
        });
    </script>

{% endblock %}

{% block report_block_content %}
        <form id="form">
        <div class="form-group">
            <div class="input-group">
                <div class="input-group-addon"><i class="fa fa-calendar"></i></div>
                <input type="text" class="form-control pull-right" id="reservation"
                       value="{{ d_from.strftime("%m/%d/%Y") }} - {{ d_till.strftime("%m/%d/%Y") }}">
            </div>
        </div>

        <div class="row">
            <div class="col-lg-6">
                {{ wtf.form_field(form.projects, class="form-control select2") }}

                <button class="btn btn-primary" id="go">{{ _("Download report") }}</button>
            </div>
        </div>

    </form>

请告诉我,也许有一种更正确,更简单的方法来向Python发送POST数据?

2 个答案:

答案 0 :(得分:1)

$(function() {
  $("#form").on("submit", function() {
    var $this = $(this);
    $.ajax({
      url: '{{ url_for("reporting_backoffice.download_report") }}',
      data: $this.serialize(),
      method: "POST",
      success: function(data) {
        //Here if u have to do something with the response
      }
    });
  })
 });

现在使用python,你在查询字符串对象中有变量。

PS:如果你没有设置属性&#34; name&#34;在表单输入上,$(this).serialize()没用,也没有变量传递给python。

答案 1 :(得分:1)

可以使用$.param()手动将其他项目添加为字符串,以转换时间对象

 var formData = $('#form').serialize(),
   times = { d_from: from, d_till: till },
   postDataString = formData  + '&' + $.param(times);

 $.post('{{ url_for("reporting_backoffice.download_report") }}', postDataString );

演示:

var formData = $('#myForm').serialize(),
   times = { d_from: 'xxxx', d_till: 'yyyy' },
   postDataString = formData  + '&' + $.param(times);
   
console.log(postDataString)
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<form id="myForm">
  <input name="AAA" value="a">
  <input name="BBB" value="b">
</form>