如何从jQuery或javascript向python Flask发送滑块值？

Question

I have a round slider with the slider value on client side or web page. 我有一个圆形滑块，在客户端或网页上有滑块值。 when the user changes the slider position, the client has to send the value to the server. 当用户更改滑块位置时，客户端必须将值发送到服务器。 Here i use python flask as a server side. 在这里我使用python flask作为服务器端。 So the value has to be sent from j Query or java script to flask. 所以该值必须从j Query或java脚本发送到flask。 I tried with the following code. 我尝试使用以下代码。 But when i use Ajax, the web page becomes blank. 但是当我使用Ajax时，网页变得空白。 It doesn't show the slider. 它不显示滑块。 If i remove the Ajax way of sending, the slider appears but value is not sent to server. 如果我删除Ajax发送方式，则会出现滑块，但不会将值发送到服务器。

CLIENT SIDE: 客户端：

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>jQuery roundSlider - JS Bin</title>
<script src="https://code.jquery.com/jquery-1.11.3.js"></script>
<link rel="stylesheet" href="//cdn.jsdelivr.net/jquery.roundslider/1.0/roundslider.min.css">
<script src="//cdn.jsdelivr.net/jquery.roundslider/1.0/roundslider.min.js"></script>
</head>   
<body>
<div id="slider"></div>
<div id="slide"></div>
<script>
$(document.ready(function(){
var value;
$("#slider").roundSlider({
    sliderType: "min-range",
    change: function(){
    var obj1 =  $("#slider").data("roundSlider");
    value = obj1.getValue();
$("#slide").html(value);
});
$.ajax({
    type: 'POST',
    url: "{{url_for('test')}}",
    contentType: 'application/json;charset=UTF-8',
    data: {'data':value}
});
});

</script>
</body>

</html>

SERVER SIDE: 服务器端：

    def flask():
            connection()
            app = Flask(__name__, template_folder='Templates')
            @app.route('/test/', methods=['GET', 'POST'])
            def test():
                    if request.method == "POST":
                            value=request.json['data']
                            print(value)
                    return render_template('roundslider1.html')

            if __name__ == "__main__":
                    app.run(host='192.168.42.1',port=2030, debug=True)

Answer 1

After reading some more documentations, i used the below code to send the variable from j Query to flask server. 在阅读了一些文档之后，我使用下面的代码将变量从j Query发送到flask服务器。

CLIENT SIDE: 客户端：

var value;
$("#slider").roundSlider({
  sliderType: "min-range",
  change: function(){
  var obj1 =  $("#slider").data("roundSlider");
  value = obj1.getValue();
  $.getJSON('/valueofslider', {
    a:value
  });

SERVER SIDE: 服务器端：

@app.route('/valueofslider')
def slide():
    a = request.args.get('a')
    print (a)

如何从jQuery或javascript向python Flask发送滑块值？

问题描述

1 个解决方案

解决方案1
0 2017-05-31 09:20:37

如何从jQuery或javascript向python Flask发送滑块值？

问题描述

1 个解决方案

解决方案1 0 2017-05-31 09:20:37

解决方案1
0 2017-05-31 09:20:37