2

テキストエリアのあるダイアログを使用しています。[OK]ボタンをクリックすると、textareaの値がajax経由でサーバーに送信されます。
ユーザーが初めてテキストエリアに書き込むと、値は正しく読み取られますが、その後のすべてのアクションで、送信される値は、ユーザーが同じ文字列を何度も入力した場合と同じです。

function message(url) { 
  var mydiv; 
  mydiv = $(document.createElement('div')); 
  mydiv.html("enter message: <textarea name='message' id='message'/>"); 
  mydiv.dialog(setProps(url));
  mydiv.dialog('open');
}

function setProps(url) {
  return {
    buttons: {
      "ok": function() {
        $.get('/act?url=' + url + '&message=' + $("#message").val().trim(),
          function(data) { 
            $("#content").load('/react?url=' + url); 
          }
        ); 
        $(this).dialog("close"); 
        $(this).dialog("destroy"); 
        // If I use the following all subseq. actions are empty:
        // $("#message").val(''); 
      }
    } 
  } 
}
4

1 に答える 1

5

ダイアログを作成すると、ダイアログの最後に追加され<body>ます。ダイアログを破棄しているからといって、ダイアログ内の要素がなくなるわけではなく、元の場所に戻るだけです。この場合は、最後になります。の、次のような要素<body>も必要です。.remove()

$(this).dialog("destroy").remove();

そうでなければ（現在）毎回新しい要素を追加していて、表示されているのは古典的な重複IDの問題であり、最初の要素（最初に追加した...決して残っていない）の値を取得しています。 #message

全体として、さらにいくつかの問題があります。たとえば、IE <9がないString.prototype.trim()ため、そのようなものがある場合と同様&に、値が大きくなります。次のように、jQueryに値をエンコードさせます。

function message(url) { 
 $("<div>enter message: <textarea name='message' id='message'></textarea></div>")
   .dialog(setProps(url));
}

function setProps(url) {
  return {
    buttons: {
      "ok": function() {
        $.get('/act', { url: url, message: $.trim($("#message").val()) },
          function(data) { 
            $("#content").load('/react?url=' + url); 
          }
        ); 
        $(this).dialog("destroy").remove(); 
      }
    } 
  } 
}
于 2010-11-23T10:36:54.120 に答える