2016-12-10 2 views
1

「プラス」ボタンをクリックすると行を追加できるデータテーブルが作成されました。 rowIdをパラメータとしてurlにajaxリクエストを送信します。 (rowIdは、プラスボタンが押された行です。)次に、jsonを戻り値として取得して、このjsonが新しい行でデータテーブルを更新するようにしたいとします。戻り値としてjsonを使用したAjax reuquestの成功が機能しない

問題は次のとおりです。私のajaxリクエストは、ネットワークモニタで見るにしても成功セクションに到達しません。なぜ誰が知っていますか?ここでは、コールバック関数として

<table class="table display" id="tabelle_benutzerHead" cellspacing="0" width="100%"> 
    <thead > 
     <tr> 
      <th>Uhrzeit</th> 
      <th>SpNr</th> 
      <th>Platz</th> 
      <th>Heimmannschaft</th> 
      <th>Gastmannschaft</th> 
      <th>Freispiele</th> 
     </tr> 
    </thead> 
    <tbody> 
      <tr id="Row1"> 
       <td>08:00</td> 
       <td>134</td> 
       <td>Platz 1</td> 
       <td>Team 5</td> 
       <td>Team 3</td> 
       <td><button class="btn btn-default AddDaten" type="button"><i class="glyphicon glyphicon-plus-sign"></i></button></td> 
      </tr> 
      <tr id="Row2"> 
       <td>09:00</td> 
       <td>76</td> 
       <td>Platz 3</td> 
       <td>Team 7</td> 
       <td>Team 1</td> 
       <td><button class="btn btn-default AddDaten" type="button"><i class="glyphicon glyphicon-plus-sign"></i></button></td> 
      </tr> 
      <tr id="Row3"> 
       <td>17:30</td> 
       <td>45</td> 
       <td>Platz 11</td> 
       <td>Team 2</td> 
       <td>Team 9</td> 
       <td><button class="btn btn-default AddDaten" type="button"><i class="glyphicon glyphicon-plus-sign"></i></button></td> 
      </tr> 
    </tbody> 
</table> 
var oTable = $('#tabelle_benutzerHead').DataTable({ 
    responsive: true, 
    "bAutoWidth": false, 
    "bFilter": false, 
    "info": false, 
    "scrollCollapse": true, 
    "paging": false, 
    rowReorder: true 
}) 

oTable.on('row-reorder', function(e, diff, edit) { 

    var draggedRow = diff[(diff.length - 1)].node; 
    var draggedRowId = $(draggedRow).attr('id'); <!-- dragged and dropped Row --> 
    var previousRow = diff[(diff.length - 2)].node; 
    var previousRowId = $(previousRow).attr('id'); <!-- the row before the dragged and dropped --> 

    $.ajax({ 
     type: "POST", 
     url: "myurl.html", 
     data: { 
      draggedRowId, 
      previousRowId    
      } 
    });      
}); 

var uhrzeit; 
var spNr; 
var platz; 
var heimmannschaft; 
var gastmannschaft; 

$(function() { 

    $('#tabelle_benutzerHead').delegate('button.AddDaten', 'click', function() { 
     var row = $(this).closest('tr'); // get the parent row of the clicked button 

     var tableRowAppend = '<tr><td>' + uhrzeit + '</td><td>' + spNr + '</td><td>' + platz + '</td><td>'+ heimmannschaft + '</td><td>'+ gastmannschaft + 
          '</td><td><button class="btn btn-default AddDaten" type="button"><i class="glyphicon glyphicon-plus-sign"></i></button></td></tr>';   

     var rowId = $(row).attr('id'); // clicked RowId 

     $.ajax({ 
      type: "POST", 
      url: "myurl.html", 
      data: { 
       rowId 
      }, 
      dataType: 'json', 
      contentType: "application/json", 
      success: function(data) { 
       var dataJson = [ 
        "10:30", 
        "77", 
        "Platz 1", 
        "Team 7", 
        "Team 12", 
        "<button class='btn btn-default AddDaten' type='button'><i class='glyphicon glyphicon-plus-sign'></i></button>" 
       ]; 

       $.getJSON(dataJson, function(){    
        oTable.clear(); 
        oTable.rows.add(dataJson); 
        oTable.draw(); 
       });  
      } 
     }); 
    }); 
}); 
+3

に、なぜあなたは' ERROR'ハンドラを追加しない すなわち? – Andreas

+0

成功のセクションに達していないこと、成功のセクションで何が起こっているのか、どうやって知っていますか?返されたデータを使用せず、独自のデータを作成し、データ(URLではない)に別のajax呼び出しを行いますか? – Craicerjack

+0

これはおそらく問題ではありませんが、サーバーにJSONを送信していますが、JSONは送信していないと言いました。 'contentType'オプションを削除するか、JSONを送信してください。 –

答えて

0

.success行為。あなたは何かを返信していますか?それは `SUCCESS`ハンドラを実行していない場合は、ポストmyurl/operationOnData

operationOnData(req,res){ // do something here with req, than res.send("Got it!"); }

+0

私はしません。私はそれを行う方法がわかりません。 –

+0

エラー:機能(データ){ } –

+0

成功:機能(データ){// 何らかの操作 }、 エラー:関数(ERR){ はconsole.log( "!ガット・エラー"、ERR)。 } –

関連する問題