2017-01-30 10 views
2

多分私はこれを間違っていますが、私が理解できるものから、私がHTMLページにフォームを持っていれば、タイプ - それは、サーバー上のトリガー「POST」を行いますが、任意の値を渡さずjQueryはPOSTSですが、値を返すことはありませんPython、Flask

$("#formid").submit(). 

でjQueryの機能を作成することによって、私はそれを行うことができますも、「提出」。関数のコードは次のとおりです - 私は "i"を参照します。これは私の星評価スクリプトが自分の入力タイプ番号を生成する方法であるからです。ここで

<script> 
$(document).ready(function() { 

$("i").click(function() { 

    $("form").submit(); 
    alert("nothing"); 
}) 
}); 

フォームのコードです:

<form method="post" name="test" id="myform" action="{{ url_for('whatulike', page = page)}}"> 

<input type="number" name="{{ row[1] }}" id="some_id" class="rating" 
data-icon-lib="fa" data-active-icon="fa-star" data-inactive-icon="fa-star-o" 
{% for rating in user_rating %}{% if rating[0]==row[1] %} value="{{ rating[1] }}"{% endif %}{% endfor %}data-empty-value="0" /> 

マイページには、スター評価と20個の要素を持っており、それらのユーザー・レートの倍数の後、私はボタンを使用して提出することができ、サーバーにデータを送信します。私はボタンを必要とせずにデータを送信したいと思います。明確にするには、通常の<input type="submit" >をクリックした後、すべて正常に動作します。

何らかの原因で干渉する可能性があるので、評価入力スクリプト(星評価を生成する)も追加しています。

! function(a) { 
"use strict"; 

function b(a) { 
    return "[data-value" + (a ? "=" + a : "") + "]" 
} 

function c(a, b, c) { 
    var d = c.activeIcon, 
     e = c.inactiveIcon; 
    a.removeClass(b ? e : d).addClass(b ? d : e) 
} 

function d(b, c) { 
    var d = a.extend({}, i, b.data(), c); 
    return d.inline = "" === d.inline || d.inline, d.readonly = "" === d.readonly || d.readonly, d.clearable === !1 ? d.clearableLabel = "" : d.clearableLabel = d.clearable, d.clearable = "" === d.clearable || d.clearable, d 
} 

function e(b, c) { 
    if (c.inline) var d = a('<span class="rating-input"></span>'); 
    else var d = a('<div class="rating-input"></div>'); 
    d.addClass(b.attr("class")), d.removeClass("rating"); 
    for (var e = c.min; e <= c.max; e++) d.append('<i class="' + c.iconLib + '" data-value="' + e + '"></i>'); 
    return c.clearable && !c.readonly && d.append("&nbsp;").append('<a class="' + f + '"><i class="' + c.iconLib + " " + c.clearableIcon + '"/>' + c.clearableLabel + "</a>"), d 
} 
var f = "rating-clear", 
    g = "." + f, 
    h = "hidden", 
    i = { 
     min: 1, 
     max: 5, 
     "empty-value": 0, 
     iconLib: "glyphicon", 
     activeIcon: "glyphicon-star", 
     inactiveIcon: "glyphicon-star-empty", 
     clearable: !1, 
     clearableIcon: "glyphicon-remove", 
     inline: !1, 
     readonly: !1 
    }, 
    j = function(a, b) { 
     var c = this.$input = a; 
     this.options = d(c, b); 
     var f = this.$el = e(c, this.options); 
     c.addClass(h).before(f), c.attr("type", "hidden"), this.highlight(c.val()) 
    }; 
j.VERSION = "0.4.0", j.DEFAULTS = i, j.prototype = { 
    clear: function() { 
     this.setValue(this.options["empty-value"]) 
    }, 
    setValue: function(a) { 
     this.highlight(a), this.updateInput(a) 
    }, 
    highlight: function(a, d) { 
     var e = this.options, 
      f = this.$el; 
     if (a >= this.options.min && a <= this.options.max) { 
      var i = f.find(b(a)); 
      c(i.prevAll("i").andSelf(), !0, e), c(i.nextAll("i"), !1, e) 
     } else c(f.find(b()), !1, e); 
     d || (a && a != this.options["empty-value"] ? f.find(g).removeClass(h) : f.find(g).addClass(h)) 
    }, 
    updateInput: function(a) { 
     var b = this.$input; 
     b.val() != a && b.val(a).change() 
    } 
}; 
var k = a.fn.rating = function(c) { 
    return this.filter("input[type=number]").each(function() { 
     var d = a(this), 
      e = "object" == typeof c && c || {}, 
      f = new j(d, e); 
     f.options.readonly || f.$el.on("mouseenter", b(), function() { 
      f.highlight(a(this).data("value"), !0) 
     }).on("mouseleave", b(), function() { 
      f.highlight(d.val(), !0) 
     }).on("click", b(), function() { 
      f.setValue(a(this).data("value")) 
     form.submit()}).on("click", g, function() { 
      f.clear() 
     }) 
    }) 
}; 
k.Constructor = j, a(function() { 
    a("input.rating[type=number]").each(function() { 
     a(this).rating() 
    }) 
}) 
}(jQuery); 

https://github.com/javiertoledo/bootstrap-rating-inputから入手しました。私はそれが非常に一番下にform.submitを持っていることを見ることができますコンソールで私はエラーが表示されますbootstrap-rating-input.min.js:79 Uncaught ReferenceError: form is not defined

答えて

0

私はすでに私が作成したフォームを使用するのではなく、私が必要とすることを行うjQueryの.post関数が登場しました。

$(document).ready(function() { 
    $("i").click(function() { 
     var values = $(this).attr("data-value") 
     var name = $(this).closest("h4").find("input").attr("name") 
     $.ajax({ 
type: "POST", 
contentType: "application/json; charset=utf-8", 
url: "/whatulike/", 
data: JSON.stringify([values,name]), 
success: function (data) { 
console.log(data.title); 
console.log(data.article); 
}, 
dataType: "json" 
}); 
     }) 
}) 

今私はrequests.get_json()

を使用する前よりもさらに良い形でそれを受け取ることができます
関連する問題