.html（）はテーブルを表示するjqueryで動作していません

Question

こんにちは、私はレコードを表示するテーブルを持っており、私はjqueryのメソッド.html（）を使用してテーブルを表示しています。 help..Hereは

$(document).ready(function(){ 
$('#dateButton').click(function(){ 
var val=$('#datetextboxid').val(); 
    $.ajax({ 
     url : 'T_Oms_08_D_Delivery_Servlet', 
     type : 'POST', 
     dataType : 'json', 
     success : function(json) { 
      var dateTableRow = ""; 
      var headerOfTable="";      
      $.each(json, function(key, value){ 
       if(value.date==val){ 
        dateTableRow=dateTableRow 
        +"<tr bgcolor='#F0F8FF'>" 
        +"<td>" + value.omsOrderId+ "</td>" 
        +"<td>" + value.orderId+ "</td>" 
        +"<td>" + value.customerId+ "</td>" 
        +"</tr>"; 
       } 
      }); 
      headerOfTable=headerOfTable 
      + "<tr bgcolor='#6495ED'>" 
      +"<td>Order DB ID</td>" 
      +"<td>Order ID</td>" 
      +"<td>Customer ID</td>" 
      +"</tr>"; 
      $("#form").html(headerOfTable+dateTableRow).fadeOut(2000).fadeIn(1000); 
     }, 
     error : function(xhr, status, errorThrown) { 
      alert("Sorry, there was a problem!"); 
      console.log("Error: " + errorThrown); 
      console.log("Status: " + status); 
      for (key in xhr) 
       console.log(key + ":" + xhr[key]); 
     }, 
     complete : function(xhr, status) { 
      //alert("The request is complete!"); 
     } 
    }); 
    }); 
}); 

「datebutton」私のjavascriptのコードである私がクリックして、テーブルを参照することが出来るのですbutton.whereのIDでください。ここ はvelowコードを試し、簡単に見てから、私のhtmlコード

<div id="divOfDateTable"> 
Search:<input type="text" id="datetextboxid"><button id="dateButton">Search</button> 
<table cellpadding="5" cellspacing="1" border="1" style="empty-cells: hide;" width="2800" > 
<tbody id="form"> 
</tbody> 
</table> 
</div> 

Answer 1

です：

$(document).ready(function(){ 
    $('#dateButton').click(function(){ 
    var val=$('#datetextboxid').val(); 
     $.ajax({ 
      url : 'T_Oms_08_D_Delivery_Servlet', 
      type : 'POST', 
      dataType : 'json', 
      success : function(json) { 
       var dateTableRow = ""; 
       var headerOfTable="";  
     $.each(json, function(key, value){ 
         if(value.date==val){ 
          dateTableRow+="<tr bgcolor='#F0F8FF'>" 
          +"<td>" + value.omsOrderId+ "</td>" 
          +"<td>" + value.orderId+ "</td>" 
          +"<td>" + value.customerId+ "</td>" 
          +"</tr>"; 
         } 
        }); 
        headerOfTable+= "<tr bgcolor='#6495ED'>" 
        +"<td>Order DB ID</td>" 
        +"<td>Order ID</td>" 
        +"<td>Customer ID</td>" 
        +"</tr>"; 
    $("#form").html(headerOfTable+dateTableRow).fadeOut(2000).fadeIn(1000); 
      }, 
      error : function(xhr, status, errorThrown) { 
       alert("Sorry, there was a problem!"); 
       console.log("Error: " + errorThrown); 
       console.log("Status: " + status); 
       for (key in xhr) 
        console.log(key + ":" + xhr[key]); 
      }, 
      complete : function(xhr, status) { 
       //alert("The request is complete!"); 
      } 
     }); 
     }); 
    }); 

理由：理由は動作していないためかもしれませんが、この2行を下回っている -

if(value.date==val){ 
        dateTableRow=dateTableRow 
        +"<tr bgcolor='#F0F8FF'>" 
} 
headerOfTable=headerOfTable 
"<tr bgcolor='#6495ED'>" 

文字列の次の行をアタッチするために、それ自身のラフターに空の変数を割り当てます。私はdateTableRow=dateTableRowをdateTableRow= +"<tr bgcolor='#F0F8FF'>"に、headerOfTable=headerOfTableをheaderOfTable+="<tr bgcolor='#6495ED'>"に変更しました。これが役に立つと願っています。