2017-01-06 13 views
0

PHPで生成されたテーブルでは、行をドラッグアンドドロップして並べ替えを変更します。 (最初の画像、2番目の画像....)ドラッグアンドドロップ後にテーブル内の行番号を変更する

最初に4番目の行を削除すると、最初の行になりますが、削除された行は4番目の行になります。

どのように行の番号を変更し、インデックスをsorrend_hiddenという非表示の入力に入れることができますか?

<table class="table table-hover table-bordered list" id="table_2"> 
    <thead> 
     <tr> 
      <td style="width: 1px; text-align: center;"><input type="checkbox" class="checkAllCheckboxes" /></td> 
      <td style="text-align: center;">ID</td> 
      <td class="left">Kép</td> 
      <td class="left">Megnevezés</td> 
      <td style="text-align: center;">Sorrend</td> 
      <td style="text-align: center;">Státusz</td> 
      <td class="right">Műveletek</td> 
     </tr> 
    </thead> 
    <tbody> 
     <tr id="sor24"> 
      <td class="left"><input class="table_row_checkbox" type="checkbox" name="selectedRows[]" value="24" /></td> 
      <td style="text-align: center;">24</td> 
      <td class="left"><img width="200" src="images/homepage_slideshow/89-FIFA_17_B4jlEln.jpg" class="img-responsive" /></td> 
      <td class="left"></td> 


      <input type="hidden" value="" name="sorrend_hidden" /> 


      <td style="text-align: center;">2</td> 
      <td style="text-align: center;">Intaktív</td> 
      <td class="right"> 
       <a href="cms/slideshow-szerkesztes.php?id=24"><span class="btn btn-sm button"><span class="glyphicon glyphicon-pencil"></span></span></a> 
       <a id="24" href="#" class="deleteLink"><span class="btn btn-sm btn-danger "><span class="glyphicon glyphicon-remove"></span></span></a> 
      </td> 
     </tr> 
     <tr id="sor31"> 
      <td class="left"><input class="table_row_checkbox" type="checkbox" name="selectedRows[]" value="31" /></td> 
      <td style="text-align: center;">31</td> 
      <td class="left"><img width="200" src="images/homepage_slideshow/503-WatchDogs2_FarCrayPrimal_1_.jpg" class="img-responsive" /></td> 
      <td class="left"></td> 


      <input type="hidden" value="" name="sorrend_hidden" /> 


      <td style="text-align: center;">2</td> 
      <td style="text-align: center;">Aktív</td> 
      <td class="right"> 
       <a href="cms/slideshow-szerkesztes.php?id=31"><span class="btn btn-sm button"><span class="glyphicon glyphicon-pencil"></span></span></a> 
       <a id="31" href="#" class="deleteLink"><span class="btn btn-sm btn-danger "><span class="glyphicon glyphicon-remove"></span></span></a> 
      </td> 
     </tr> 
     <tr id="sor30"> 
      <td class="left"><input class="table_row_checkbox" type="checkbox" name="selectedRows[]" value="30" /></td> 
      <td style="text-align: center;">30</td> 
      <td class="left"><img width="200" src="images/homepage_slideshow/324-DeadRising4_megjelent.jpg" class="img-responsive" /></td> 
      <td class="left"></td> 


      <input type="hidden" value="" name="sorrend_hidden" /> 


      <td style="text-align: center;">3</td> 
      <td style="text-align: center;">Aktív</td> 
      <td class="right"> 
       <a href="cms/slideshow-szerkesztes.php?id=30"><span class="btn btn-sm button"><span class="glyphicon glyphicon-pencil"></span></span></a> 
       <a id="30" href="#" class="deleteLink"><span class="btn btn-sm btn-danger "><span class="glyphicon glyphicon-remove"></span></span></a> 
      </td> 
     </tr> 
     <tr id="sor32"> 
      <td class="left"><input class="table_row_checkbox" type="checkbox" name="selectedRows[]" value="32" /></td> 
      <td style="text-align: center;">32</td> 
      <td class="left"><img width="200" src="images/homepage_slideshow/492-PS-VR_.jpg" class="img-responsive" /></td> 
      <td class="left"></td> 


      <input type="hidden" value="" name="sorrend_hidden" /> 


      <td style="text-align: center;">4</td> 
      <td style="text-align: center;">Aktív</td> 
      <td class="right"> 
       <a href="cms/slideshow-szerkesztes.php?id=32"><span class="btn btn-sm button"><span class="glyphicon glyphicon-pencil"></span></span></a> 
       <a id="32" href="#" class="deleteLink"><span class="btn btn-sm btn-danger "><span class="glyphicon glyphicon-remove"></span></span></a> 
      </td> 
     </tr> 
     <tr id="sor23"> 
      <td class="left"><input class="table_row_checkbox" type="checkbox" name="selectedRows[]" value="23" /></td> 
      <td style="text-align: center;">23</td> 
      <td class="left"><img width="200" src="images/homepage_slideshow/90-konzolkiraly_sl_1467362325.jpg" class="img-responsive" /></td> 
      <td class="left"></td> 


      <input type="hidden" value="" name="sorrend_hidden" /> 


      <td style="text-align: center;">5</td> 
      <td style="text-align: center;">Intaktív</td> 
      <td class="right"> 
       <a href="cms/slideshow-szerkesztes.php?id=23"><span class="btn btn-sm button"><span class="glyphicon glyphicon-pencil"></span></span></a> 
       <a id="23" href="#" class="deleteLink"><span class="btn btn-sm btn-danger "><span class="glyphicon glyphicon-remove"></span></span></a> 
      </td> 
     </tr> 
    </tbody> 
</table> 

のjQuery:

$("#table_2").tableDnD(
    { 
     onDrop: function(table, row) 
     { 
      var rows = table.tBodies[0].rows; 
      var RowID = row.id.substr(3); 
      var RowIndex = $(row).index() + 1; 

      // name = sorrend_hidden 

      $.ajax({ 
       data: { RowID:RowID, RowIndex:RowIndex }, 
       type: 'POST', 
       url: 'files/update_slide_index.php', 
       success: function(data) 
       { 
        var result = $.trim(data); 
        $('#newsletterResult').html(result); 
        $('#newsletterModal').modal('show'); 
       }, 
       complete: function() 
       { 
        setTimeout(function() 
        { 
         location.reload(); 
        }, 3000); 
       } 
      }); 
     } 
    }); 

SQLの更新:

<?php 
include_once("../../files/connect.php"); 
if(isset($_POST['RowID'])) 
{ 
    $RowID = intval($_POST['RowID']); 
    $RowIndex = intval($_POST['RowIndex']); 




    $sql = "UPDATE slideshow SET slide_sorrend = '$RowIndex' WHERE slide_id = '$RowID'"; 
    /*if(mysqli_query($kapcs, $sql)) 
    { 
     mysqli_query($kapcs, "UPDATE slideshow SET slide_sorrend = slide_sorrend + 1 WHERE slide_id != '$RowID'") or die(mysqli_error($kapcs)); 
    } 
    else 
    { 
     die(mysqli_error($kapcs)); 
    }*/ 

    echo 'A kép sorrendje sikeresen megváltozott.'; 
} 
else 
{ 
    echo 'Nincs ID'; 
} 
?> 
+0

[SQLによる単一レコードの変更に基づいて複数のレコードに変更を加える]可能な複製(http://stackoverflow.com/questions/40623132/making-changes-to-multiple-records-based-on-change- of-single-record-with-sql) – e4c5

+0

行の番号を変更し、すべての行をSQL​​で更新するにはどうすればよいですか? 1つの行が変化する場合、すべての行のソート番号を変更する必要があります。 –

+0

これはリンクされた質問 – e4c5

答えて

0

私は同様の問題のヶ月前に持っていました。私は、jQuery UIに含まれるソート可能な機能を使用して終了しました。

+0

しかし、それはSQLを更新します。私はそれを解決する必要があります。 –

関連する問題