1

私はプログラミングに比較的慣れておらず、このサイトにも慣れていません。この問題を説明する際に私が犯した単純な誤りに耐えてください。

Pythonを使用してGoogleAppEngineでウェブアプリを実装しjinja2、HTMLテンプレートのレンダリングに使用しています。

base.htmlユーザーがフォームに入力ボックスを動的に追加できるように、テンプレートにjqueryをいくつか含めました。入力ボックスのセットが追加されるたびに、ページ上でちらつき、問題のフォームがサーバーに送信されているように見えます（入力ボックスの名前（追加されたものを含む）を含むクエリ文字列がURLに表示されます） 。その後、ブラウザに空白のページが表示されます。

この問題のトラブルシューティング方法がわかりません。GET関数とPOST関数が正しくフォーマットされていないことに関係していると思いますが、どのように進めればよいかわかりません。関連するjquery、html、GAEハンドラー、および関連する関数定義を含めました。トラブルシューティングのための潜在的な解決策または提案についての洞察をいただければ幸いです。

jqueryは次のとおりです。

$(document).ready(function() {
  $('#btnAdd').click(function() {
    var num     = $('.clonedInput').length;
    var newNum  = new Number(num + 1);

    var newElemName = $('#inputName' + num).clone().prop('id', 'inputName' + newNum);
    var newElemValue = $('#inputValue' + num).clone().prop('id', 'inputValue' + newNum);

    newElemName.children(':first').prop('id', 'name' + newNum).prop('name', 'name' + newNum);
    newElemValue.children(':first').prop('id', 'value' + newNum).prop('name', 'value' + newNum);

    $('#inputValue' + num).after(newElemName);
    $(newElemName).after(newElemValue);
    $('#btnDel').removeAttr('disabled');

    if (newNum == 13) {
        $('#btnAdd').prop('disabled', true);
    };
  });

  $('#btnDel').click(function() {
    var num = $('.clonedInput').length;

    $('#inputName' + num).remove();
    $('#inputValue' + num).remove();
    $('#btnAdd').removeAttr('disabled');

    if (num-1 == 1) {
      $('#btnDel').prop('disabled', true);
    };
  });

    $('#btnDel').attr('disabled', true);
});

フォームのマークアップは次のとおりです。

<form class="well form-inline" method="post">
  <legend>custom post</legend>
  <button class="btn" id='btnAdd'>add another row</button> 
  <button class="btn" id='btnDel'>remove row</button>            
    <fieldset>
      <div id='inputName1' class='clonedInput'>
        <input type="text" class="input-xlarge" id="name1" placeholder="name" name="name1" value="{{name1}}">
      </div>
      <div id='inputValue1' class='clonedInput1'>
        <input type="text" class="input-xlarge" id="value1" placeholder="value" name="value1" value="{{value1}}">
      </div>
      <p class="help-block">enter your custom name and value, please.</p>
    </fieldset>
  <input type="submit">
</form>

そして、これが私のGAEハンドラーと関連する関数定義です（不完全です。post関数の大部分はまだ実装していません）：

class Create(Handler):
    def get(self):
        if not self.getCookieVal('user_id'):
            self.redirect('/register/')
        self.render('create.html', userCookie=User.by_id(int(self.getCookieVal('user_id'))).username)

    def post(self):
        if not self.getCookieVal('user_id'):
            self.redirect('/register/')

def write(self, *a, **kw):
    self.response.out.write(*a, **kw)

def render_str(self, template, **params):
    return render_str(template, **params)

def render(self, template, **kw):
    self.write(self.render_str(template, **kw))

def getCookieVal(self, name):
    cookieVal = self.request.cookies.get(name)
    if cookieVal:
        return verification.checkSecureVal(cookieVal)  #returns string if value is secure
4

2 に答える 2

0

HTML、スクリプト、およびネットワーク IO をデバッグするための Chrome 開発者ツールに精通していますか。 https://developers.google.com/chrome-developer-tools/

于 2012-08-08T23:24:41.973 に答える