行を自動的に追加htmlデータグリッドをドロップダウンメニューで追加する

コードを修正するのを手伝ってもらえますか？私はHTMLグリッドを構築し、自動的に新しい行を追加するボタンを持っています。ボタンに関連付けられた機能が動作しません。ここで行を自動的に追加htmlデータグリッドをドロップダウンメニューで追加する

は、HTMLコード

<html> 
<head> 
    <script src="test.js"></script> 
</head> 
<body> 
    <div id="wrapper"> 
     <table align='center' cellspacing=2 cellpadding=5 id="data_table" border=1> 
      <tr> 
       <th>Advertiser</th> 
       <th>Formato</th> 
       <th>Tipo</th> 
       <th>Autoplay</th> 
       <th>Audio</th> 
      </tr> 
      <tr id="row1"> 
       <td id="advertiser_row1"> 
        <select name="client"> 
         <option value="Mcvities">Mcvities</option> 
         <option value="Enel">Enel</option> 
         <option value="Brita">Brita</option> 
        </select> 
       </td> 
       <td id="formato_row1"> 
        <select name="formato"> 
         <option value="intro shaa">intro shaa</option> 
         <option value="intro xaxis">intro xaxis</option> 
         <option value="carousel">carousel</option> 
         <option value="mid-strip">mid-strip</option> 
        </select> 
       </td> 
       <td id="tipo_row1"> 
        <select name="tipi"> 
         <option value="video">video</option> 
         <option value="immagine">immagine</option> 
        </select> 
       </td> 
       <td id="audio_row1"> 
        <select name="audio"> 
         <option value="video">yes</option> 
         <option value="immagine">no</option> 
        </select> 
       </td> 
       <td id="tipo_row1"> 
        <select name="autoplay"> 
         <option value="video">yes</option> 
         <option value="immagine">no</option> 
        </select> 
       </td> 
      </tr> 
      <tr> 
       <td><input type="text" id="new_cl"></td> 
       <td><input type="text" id="new_fo"></td> 
       <td><input type="text" id="new_ti"></td> 
       <td><input type="text" id="new_au"></td> 
       <td><input type="text" id="new_at"></td> 
       <td><input type="button" class="add" onclick="add_row();" value="Add Row"></td> 
      </tr> 
     </table> 
    </div> 
</body> 
</html>

は、ここに私のJSです：

function add_row() 
{ 
var new_ad=document.getElementById("new_cl").value; 
var new_im=document.getElementById("new_fo").value; 
var new_cp=document.getElementById("new_ti").value; 
var new_st=document.getElementById("new_au").value; 
var new_en=document.getElementById("new_at").value; 

var table=document.getElementById("data_table"); 
var table_len=(table.rows.length)-1; 
var row = table.insertRow(table_len).outerHTML="<tr id='row"+table_len+"'><td id='advertiser_row"+table_len+"'>"+new_cl+"</td><td id='formato_row"+table_len+"'>"+new_fo+"</td><td id='tipo_row"+table_len+"'>"+ti_cp+"</td><td id='audio_row"+table_len+"'>"+au_cl+"</td><td id='autoplay_row"+table_len+"'>"+new_at+"</td>; 

document.getElementById("new_cl").value=""; 
document.getElementById("new_fo").value=""; 
document.getElementById("new_ti").value=""; 
document.getElementById("new_au").value=""; 
document.getElementById("new_at").value=""; 
}

出典

2017-06-08 Alessandro Longo

はこれを試してみてください：

変更：<table id="myTable">

function add_row() 
{ 
    var table = document.getElementById("myTable"); 
    var row = table.insertRow(0); 
    var cell1 = row.insertCell(0); 
    var cell2 = row.insertCell(1); 
    var cell3 = row.insertCell(2); 
    var cell4 = row.insertCell(3); 
    cell1.innerHTML = "NEW CELL1"; 
    cell2.innerHTML = "NEW CELL2"; 
    cell3.innerHTML = "NEW CELL3"; 
    cell4.innerHTML = "NEW CELL4"; 
}

出典

2017-06-08 16:39:51

を –

は私が何であったか持って働いていません間違っている。今働いている仲間たち –

行を自動的に追加htmlデータグリッドをドロップダウンメニューで追加する

答えて

関連する問題