3

javascript 関数内からサーバー側の python スクリプトに整数の値を渡そうとしています。この値を JavaScript から Python に直接渡す方法を見つけようとしましたが、まだ成功していません。代わりに、javascript 関数を使用して、html フォーム内に int の値を含む隠し要素を作成しようとしました。次に、Python Bottle フレームワークで「POST」アクションを使用して、値を Python スクリプトにコピーしようとしました。ただし、int は int ではなく NoneType として処理されているため、処理スクリプト内では使用できません。int という名前のインスタンスを持つ要素を作成する私の JS 関数の部分は次のとおりです。

function newItem(){
  instance++;

  var oldInput = document.getElementById("itemInfo");
  var parent = oldInput.parentNode;
  var newDiv = document.createElement("div");

  var item = document.createElement("INPUT");
  var qty = document.createElement("INPUT");
  var color = document.createElement("INPUT");
  var count = document.createElement("HIDDEN");

  item.name = "item" + instance;
  qty.name = "qty" + instance;
  color.name = "color" + instance;
  count.value = instance;
  newDiv.appendChild(item);
  newDiv.appendChild(qty);
  newDiv.appendChild(color);
  newDiv.appendChild(count);

「POST」メソッドを使用した HTML フォーム

<form method ="post" class="form" action = "/newguest" method = 'post'>
   Name: <input type="text" name="name"/>


   <p>Item: <input type="text" name="item"/> 
   Qty: <input type="text" name="qty"/>
   Color: <input type="text" name="color"/></p>
   <div class="itemInfo" id="itemInfo"></div>
    <input type ="button" value="Add Item" onclick="newItem();"/>


   <p>Phone: <input type="text" name="phone"/>
   Email: <input type="text" name="email"/>
   Artwork: <input type="file" name="file"/>
   <p>Quote: <input type="text" name="quote"/></p>
 </p>
   <p>Notes: <textarea cols="40" rows="10"></textarea>
 </p>
   <input type="submit" value='Add Order'/>
 </form>

そして最後にサーバー側のpythonスクリプト

 @bottle.route('/newguest', method = 'POST')
def insert_newguest():
    name = bottle.request.forms.get("name")
    email = bottle.request.forms.get("email")
    item = bottle.request.forms.get("item")
    qty = bottle.request.forms.get("qty")
    color = bottle.request.forms.get("color")
    count = bottle.request.forms.get(count)
    itemDict = dict()
    qtyDict = dict()
    colorDict = dict()
    for num in range(1, count):

    itemkey = "item" + str(num)
    qtyKey = "qyt" + str(num)
    colorKey = "color" + str(num)
    itemDict[itemKey]= bottle.request.forms.get("item"+str(num))
    qtyDict[qtyKey] = bottle.request.forms.get("qty"+str(num))
    colorDict[colorKey] = bottle.request.forms.get("color"+str(num))

「POST」メソッドで情報を追加しようとすると、次のエラーが表示されます。

ここに画像の説明を入力

4

1 に答える 1

1

非表示フィールドが正しく作成されていないため、このメッセージが表示される可能性があります。

  • newDivまず、上記のコードで DOM に 実際に を追加している様子がわかりません。

  • 第二に、あなたが提供した HTML フォームはハードコードされていますか? もしそうなら、なぜフォームをハードコーディングしてから、javascript でフィールドを再度作成するのですか? これは少し奇妙に思えます。

  • 第三に、最も重要なことは、非表示フィールドは単なる であるため<input>、置き換える必要があることです。

    var count = document.createElement("HIDDEN");

    と：

    var count = document.createElement("INPUT");
count.setAttribute('type', 'hidden');
count.setAttribute('name', 'count');
count.setAttribute('value', my_count_variable);

この回答とjsFiddleの例を参照してください。フォームを送信するcountと、Python スクリプトでフィールドに入力する必要があります。

余談ですが、この種のリクエストは多くの場合、AJAX によって処理されます。考え方は同じで、カウントを Python サーバーに送信するためにブラウザーを更新する必要がないということだけです。jQuery を使用せずにこれを行う方法の例をここで見ることができます。

于 2013-07-24T05:39:08.180 に答える