2

行が動的に追加されるテーブルがあります。

セルの1つで、ドロップダウンと入力ボックスを切り替えたいと思います。

ドロップダウンは、AJAXを介してロードされたPHPファイルです。問題は、ドロップダウンが1回だけレンダリングされることです。初めてトグルボタンをクリックすると、ドロップダウンが表示されます。2回目のクリックで、入力フィールドに切り替わります。3回目のクリックは何もしません。入力ボックスに留まり、ドロップダウンに戻りません。

AJAX呼び出しをコメントアウトして単純なドロップダウンを入れると、うまく前後に切り替わります。したがって、問題はAJAX部分にあると思います。

http://jsfiddle.net/6h5BD/1/へのリンク 注：AJAXは現在jsfiddleでコメント化されており、一時ドロップダウンに置き換えられているため、私が探している結果を確認できます。

問題のJSの部分：

  $('input[name="button"]').toggle(function() {
      $.ajax({
            url: 'http://localhost/brandDropdown.php',
            type:'POST',
            dataType: 'html',
            success: function(output_string){
            $('#brand').html(output_string);
             } 
      }); 
   }, function() {
       $(this).closest('td').prev().html("<input type=\"text\" name=\"itemBrand[]\" id=\"itemBrand\" size=\"10\" placeholder=\"New Brand\" style=\"text-transform: uppercase\"/>");
 });

PHP：

  $sqlbrand = "SELECT BRD_Name FROM Brands ORDER BY BRD_Name asc";
  $resultbrand = odbc_exec($conn, $sqlbrand);
  ECHO "<select name='itemBrand[]' style='width:120px' size='1'>";
  while ($rowbrand = odbc_fetch_array($resultbrand)) {
      echo "<option value='".$rowbrand['BRD_Name']."'>".$rowbrand['BRD_Name']."</option>";
  }
  echo "</select></td>";

私はこれを別の方法で処理することに非常にオープンです。私はいくつかの異なるアプローチを試しましたが、役に立ちませんでした。

この問題についてご協力いただき、ありがとうございます。

4

2 に答える 2

2

PHP ファイルが表示されない場合、デバッグを完全に支援することはできません。

しかし、HTML/JS から、潜在的な問題が見えてきます。$("#brand")を選択し、html を output_string に変更しています。ただし、行を複製するときは、#brand のIDを持つ複数の div を作成しており、IDは一意である必要があるため、代わりにクラスを使用する必要があります。

これでうまくいくか試してみませんか？

$('input[name="button"]').toggle(function() {
      var $this = $(this);
      $.ajax({
            url: 'http://localhost/brandDropdown.php',
            type:'POST',
            dataType: 'html',
            success: function(output_string){
                 $this.closest('td').prev().html(output_string);
            } 
      }); 
   }, function() {
       $(this).closest('td').prev().html("<input type=\"text\" name=\"itemBrand[]\" id=\"itemBrand\" size=\"10\" placeholder=\"New Brand\" style=\"text-transform: uppercase\"/>");
 });
于 2012-11-20T18:56:27.413 に答える
0

あなたのコードで（フィドルで）

$(this).closest('td').prev().html(...)

する必要があります

$(this).closest('td').prev().find('#brand').html(...)

$(this).closest('td').prev().html(...)html を置き換えているため、 with idを 内からtd削除しているだけなので、トグルすると内にないため、成功したコールバックは機能しません。div#brandtdajax$('#brand').html(output_string);td

于 2012-11-20T19:15:00.137 に答える