0
私はJSファイルを呼び出すPHPファイルを持っています。 PHPには、テーブルソータープラグインを使用する2つのテーブルがあります.1つは動作し、もう1つは動作しません。動作するものは、Ajax呼び出しからまっすぐに来ます。同じAjax呼び出しの情報だけでなく、いくつかのjs varから情報が読み込まれます。私はAjaxで返された列で並べ替えることができますが、JS変数の値で満たされ、編集可能な4つの列(Code、QtyOrder、$、Comments)で並べ替えることができません。 PHP 5.3.24とjqueryui/1.10.0を使用していますが、編集可能な列とjs列で並べ替えることが可能ですか?それはtablesorterの新しいバージョンでは可能であると同じ問題を持つ人のための動的な値を持つテーブルを持つjsテーブル・ソートではない
$(document).ready(function() {
$('#loading').hide();
$("#guides").tablesorter();
$("#inv").tablesorter();
function populate(cnt) {
$("#cheggNote").hide();
$("#getting").hide();
$("#getting").hide();
$("#getting2").hide();
$("#getting3").hide();
$("#getting4").hide();
$("#guides tbody").remove();
$("#inv tbody").remove();
$("#detailSales tbody").remove();
$("#detailSales2 tbody").remove();
var po = $('#po').val();
$.ajax({
type: "POST",
url: "poInfo2.php",
//async:false,
dataType: "json",
data: ({
po: po,
filter: $('#filter').val(),
cnt: cnt,
end: $('#end').html()
}),
success: function(data) {
var isbn = data.isbn;
$("#qtyA").val(data.qty);
$("#price").val(data.price);
$("#priceOffered").val(data.pr_off);
$("#title").val(data.title);
$("#isbn10").val(data.isbn10);
$("#publisher").val(data.Publisher);
$("#copy").val(data.Copyright);
$("#weight").val(data.Weight);
$("#isbn13").val(data.isbn);
$("#list").val(data.list);
$("#AmzLow").val(data.AmzLow);
$("#AmzNewPrice").val(data.AmzNew);
$("#Rank").val(data.Rank);
$("#source").val(data.source);
$("#end").html(data.pages);
$("#start").html(cnt + 1);
if (data.isbn == null) {
$("#guides").append('<tr><td>No Records Found</td></tr>');
$("#inv").append('<tr><td>No Records Found</td></tr>');
} else {
for (var x = 0; x < data.PurPO.length; x++) {
$("#inv").append('<tr><td id=tableDATE>' + data.PurDate[x] + '</td><td id=tablePO>' + data.PurPO[x] +
'</td><td id=tableQtyOrdered>' + data.PurQty[x] + '</td><td id=tablePrice>' + data.PurPrice[x] + '</td></tr>');
}
$("#inv").trigger("update");
$("#guides").append('<tr><td>' + data.AMGprice + '</td><td>Amtext</td><td><input type="text" class="qty" id="ACode" value="' + data.ACode +
'"</td><td><input type="text" class="qty" id="AQty" value="' + data.AQty +
'"</td><td id="ANewPricemarg">' + ANewPricemarg + '</td><td><input type="text" class="qty" id="ANewPrice" value="' + data.ANewPrice +
'"</td><td><input type="text" class="qty" id="Acomments" value="' + data.Acomments +
'"/></td><td class="price">' + data.Atitle +
'</td></tr><tr><td>' + data.FGnew + '</td><td>Follett N</td><td><input type="text" class="qty" id="FNewCode" value="' + data.FNewCode +
'"</td><td><input type="text" class="qty" id="FNewQty" value="' + data.FNewQty +
'"</td><td id="FNewmarg">' + FNewmarg + '</td><td><input type="text" class="qty" id="FNew" value="' + data.FNew +
'"</td><td><input type="text" class="qty" id="Fcomments" value="' + data.Fcomments +
'"/></td><td class="price">' + data.Ftitle +
'</td></tr><tr><td>' + data.FGused + '</td><td>Follett U</td><td><input type="text" class="qty" id="FUsedCode" value="' + data.FUsedCode +
'"</td><td><input type="text" class="qty" id="FUsedQty" value="' + data.FUsedQty +
'"</td><td id="FUsedPricemarg">' + FUsedPricemarg + '</td><td><input type="text" class="qty" id="FUsedPrice" value="' + data.FUsedPrice +
'"</td><td><input type="text" class="qty" id="FUsedcomments" value="' + data.FUsedcomments +
'"/></td><td class="price">' + data.Ftitle +
'</td></tr><tr><td>' + data.NEBGPrice + '</td><td>Nebraska</td><td></td><td><input type="text" class="qty" id="NQty" value="' + data.NQty +
'"</td><td id="NPricemarg">' + NPricemarg + '</td><td><input type="text" class="qty" id="NPrice" value="' + data.NPrice +
'"</td><td><input type="text" class="qty" id="Ncomments" value="' + data.Ncomments +
'"</td><td></td></tr><tr><td>' + data.BWGNewPrice +
'</td><td>BkWin N</td><td><input type="text" class="qty" id="BWCode" value="' + data.BWCode +
'"</td><td><input type="text" class="qty" id="BWQty" value="' + data.BWQty +
'"</td><td id="BWmarg">' + BWmarg + '</td><td><input type="text" class="qty" id="BW" value="' + data.BW +
'"</td><td><input type="text" class="qty" id="BWcomments" value="' + data.BWcomments +
'"</td><td></td></tr><tr><td>' + data.BWGPrice +
'</td><td>BkWin U</td><td><input type="text" class="qty" id="BWCodeU" value="' + data.BWCodeU +
'"</td><td><input type="text" class="qty" id="BWQtyU" value="' + data.BWQtyU +
'"</td><td id="BWUmarg">' + BWUmarg + '</td><td><input type="text" class="qty" id="BWU" value="' + data.BWU +
'"</td><td><input type="text" class="qty" id="BWUcomments" value="' + data.BWUcomments +
'"</td><td></td></tr><tr><td>' + data.BKBGPrice +
'</td><td>BookByte</td><td><input type="text" class="qty" id="BKBCode" value="' + data.BKBCode +
'"</td><td><input type="text" class="qty" id="BKBQty" value="' + data.BKBQty +
'"</td><td id="BKBmarg">' + BKBmarg + '</td><td><input type="text" class="qty" id="BKB" value="' + data.BKB +
'"</td><td><input type="text" class="qty" id="BKBcomments" value="' + data.BKBcomments +
'"</td><td></td></tr><tr><td></td><td>F Qoute N</td><td><input type="text" class="qty" id="FquoteNewCode" value="' + data.FQuoteNewCode +
'"</td><td><input type="text" class="qty" id="FQuoteNewQty" value="' + data.FQuoteNewQty +
'"</td><td id="FQuoteNewmarg">' + FQuoteNewmarg + '</td><td><input type="text" class="qty" id="FQuoteNew" value="' + data.FQuoteNew +
'"</td><td id="FQuoteNewmarg><input type="text" class="qty" id="FQNcomments" value="' + data.FQNcomments + '"/></td><td class="price">' + data.FQtitle +
'</td></tr><tr><td></td><td>F Qoute U</td><td><input type="text" class="qty" id="FQuoteUsedCode" value="' + data.FQuoteUsedCode +
'"</td><td><input type="text" class="qty" id="FQuoteUsedQty" value="' + data.FQuoteUsedQty +
'"</td><td id="FQuoteUsedmarg">' + FQuoteUsedmarg + '</td><td><input type="text" class="qty" id="FQuoteUsed" value="' + data.FQuoteUsed +
'"</td><td><input type="text" class="qty" id="FQUcomments" value="' + data.FQUcomments + '"/></td><td class="price">' + data.FQtitle +
'<td></tr><tr><td></td><td>Valore</td><td></td><td><input type="text" class="qty" id="VLRQty" value="' + data.VLRQty +
'"</td><td id="VLRmarg">' + VLRmarg + '</td><td><input type="text" class="qty" id="VLR" value="' + data.VLR +
'"</td><td><input type="text" class="qty" id="VLRcomments" value="' + data.VLRcomments +
'"</td><td></td><tr><td></td><td>Bkscouter</td><td></td><td><input type="text" class="qty" id="Bookscouter1Qty" value="' + data.Bookscouter1Qty +
'"</td><td id="Bookscouter1marg">' + Bookscouter1marg + '</td><td><input type="text" class="qty" id="Bookscouter1" value="' + data.Bookscouter1 +
'"</td><td><input type="text" class="qty" id="BKScomments" value="' + data.BKScomments +
'"</td><td></td><tr><td></td><td>Recycle</td><td></td><td><input type="text" class="qty" id="ScoutRecycleQty" value="' + data.ScoutRecycleQty +
'"</td><td id="ScoutRecyclemarg">' + ScoutRecyclemarg + '</td><td><input type="text" class="qty" id="ScoutRecycle" value="' + data.ScoutRecycle +
'"</td><td><input type="text" class="qty" id="Recycomments" value="' + data.Recycomments +
'"</td><td></td></tr><tr><td></td><td>Bks Amz</td><td></td><td><input type="text" class="qty" id="ScoutAmzQty" value="' + data.ScoutAmzQty +
'"</td><td id="ScoutAmzmarg">' + ScoutAmzmarg + '</td><td><input type="text" class="qty" id="ScoutAmz" value="' + data.ScoutAmz +
'"</td><td><input type="text" class="qty" id="AMZcomments" value="' + data.AMZcomments +
'"</td><td></td></tr><tr><td></td><td>McKenzie</td><td></td><td><input type="text" class="qty" id="McKenzieQty" value="' + data.McKenzieQty +
'"</td><td id="MCKmarg">' + MCKmarg + '</td><td><input type="text" class="McKenzie" id="McKenzie" value="' + data.McKenzie +
'"</td><td><input type="text" class="qty" id="MCKcomments" value="' + data.MCKcomments +
'"</td><td></td></tr>');
var shipweight = document.getElementById("weight").value;
} //END OF ELSE
$("#cnt").val(data.cnt);
$("#guides").trigger("update");
} // END OF SUCCESS
}); //END OF AJAX
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.10.0/jquery.min.js"></script>
<div id="inventory" class="noprint">
<table id="inv" class="tablesorter" style="border: 1px solid black;">
<caption class="cap">Order History</caption>
<thead>
<tr>
<th>DATE</th>
<th>PO</th>
<th>QtyOrdered</th>
<th>Price</th>
</th>
</tr>
</thead>
<tbody>
</tbody>
</table>
</div>
<!--INVENTORY-->
<div id="guide">
<table class="tablesorter" id="guides" style="border: 1px solid black;">
<thead>
<tr>
<th>Current</th>
<th>Guide</th>
<th>Code</th>
<th>QtyOrder</th>
<th>Margin</th>
<th>$</th>
<th>Comments</th>
<th>Title</th>
</tr>
</thead>
<tbody>
</tbody>
<tfoot>
</tfoot>
</table>
</div>
<!--GUIDE-->
イベントを使用するようですが、それはあなたのAjaxの成功の機能に追加された要素のために動作しない理由 [イベント委任](https://learn.jquery.com/events/event-delegation/)に見えますあなたが見ているところには存在しないからです。既存の要素を参照し、DOMの読み込み後に追加された要素を見つけるためにDOMツリーを走査する必要があります。 –
私の[tablesforporterのフォーク](https://mottie.github.io/tablesorter/docs)を使用している場合、[コンテンツ編集可能なウィジェット](https://mottie.github.io/tablesorter/docs/example)があります-widget-editable.html)が利用可能です。 – Mottie