我需要了解如何在重新加載頁面時更改第 2 頁上的客戶資料而不回傳到第 1 頁。在實踐中我需要留在當前頁面,但目前當我更改客戶的資料并保存卡時,如果我在第 3 頁它總是回傳到第 1 頁。我試過window.location.reload()
有什么辦法可以避免重置過濾器?
這是我的 JavaScript 函式:
function rinnova(id) {
var formData = new FormData();
var abbonamento = id.split("-");
var abb = $("#abb" abbonamento[3]).val();
console.log(abb);
formData.append(
"id",
abbonamento[0] "-" abbonamento[1] "-" abbonamento[2]
);
formData.append("abb", abb);
$.ajax({
url: "include/rinnovaabbonamento.php",
data: formData,
type: "POST",
contentType: false,
processData: false,
beforeSend: function () {
return confirm("Vuoi rinnovare l'abbonamento?");
},
success: function (response) {
$(".box").html(
"<h3 class='text-center pb-3 pt-3'>Rinnovo confermato!</h3>"
);
document.location.reload();
}
});
}
這是 FooTable 函式
if( $('.footable-editing').length ) {
var $modal = $('#footable-editor-modal'),
$editor = $('#footable-editor'),
$editorTitle = $('#footable-editor-title'),
ft = FooTable.init('.footable-editing', {
editing: {
enabled: true,
addRow: function(){
$modal.removeData('row');
$editor.find('#id').val("");
$editor.find('#account').show();
$editor.find('#categoria').val("1");
$editor.find('#costo').val("40.00");
$editor[0].reset();
$editorTitle.text('Add a new row');
$modal.modal('show');
},
editRow: function(row){
var values = row.val();
$editor.find('#account').hide();
$editor.find('#id').val(values.id);
$editor.find('#nome').val(values.nome);
$editor.find('#cognome').val(values.cognome);
$editor.find('#data').val(values.data);
$editor.find('#luogonascita').val(values.luogonascita);
$editor.find('#residenza').val(values.residenza);
$editor.find('#codicefiscale').val(values.codicefiscale);
$editor.find('#scadenza').val(values.scadenza);
$editor.find('#costo').val(values.costo);
$editor.find('#note').val(values.note);
$editor.find('#attivo').val(values.attivo);
var cat = values.categoria.split(".");
var idcat = cat[0];
if(values.categoria=="Nessuna categoria"){
$("#nessunacategoria").attr('selected', 'selected');
}else{
$("#cat" idcat).attr('selected', 'selected');
}
$modal.data('row', row);
$editorTitle.text('Edit - ' values.nome ' Data');
$modal.modal('show');
},
deleteRow: function(row){
if (confirm('Sei sicuro di voler cancellare?')){
var values = row.val();
var formData = new FormData();
formData.append('id', values.id);
formData.append('elimina',"1");
$.ajax({
url: "include/register_account.php",
data: formData,
type: "POST",
contentType: false,
processData:false,
success: function(response){
alert(response);
}
});
}
}
}
}),
uid = 10;
uj5u.com熱心網友回復:
您必須在 ajax 呼叫后使用更新的內容填充 html 頁面,而不是呼叫 window.reload 或 document.reload
uj5u.com熱心網友回復:
如果不查看更多相關代碼,很難了解詳細資訊,但聽起來 - 從您的服務器的角度來看 - 只加載了一個頁面。當用戶看到“第 2 頁”時,瀏覽器只是改變了頁面的外觀(可能,但不一定,包括與服務器交換一些資訊的 AJAX 請求),而沒有實際加載整個新頁面。然后,當您要求服務器重新加載頁面時,您在邏輯上會獲得頁面的原始狀態,看起來像“頁面 1”。
如果 URL 欄中的地址在用戶視圖發生變化時發生變化(例如從“第 1 頁”到“第 2 頁”),那么您可以通過設定document.location屬性來控制用戶看到的視圖,(盡管使用歷史 API可能會給您更精確的控制)。
另一方面,如果地址始終相同,您可能無法依靠瀏覽器的幫助來設定特定狀態,但如果更改為“第 2 頁”使用了對服務器的 AJAX 請求,則您可以發送類似的請求來重現類似的狀態。
在任一情況下,您獲得的狀態(來自瀏覽器的歷史 API 或服務器的 AJAX 回應)可能不會完全匹配您想要的狀態,因為用戶已經對“第 2 頁”進行了一些更改。您已經在捕獲一些用戶輸入的資訊:id您的rinnova函式的引數可能代表用戶輸入的內容。一旦您捕獲了您需要的任何此類資訊,您將觸發“第 2 頁”的重置,然后通過將捕獲的值恢復到它們從中捕獲的任何頁面元素來添加畫龍點睛。
例如,讓我們想象一下前面的代碼說:
const cardID = ("#card-id").val();
rinnova(cardID);
現在您已重置“第 2 頁”,您將#card-id通過執行以下操作來重新填充該元素:
$("#card-id").val(cardID);
關于直接在瀏覽器中進行更改的一個小警告:
看到 URL 中的更改(當用戶的視圖更改時)確實意味著瀏覽器知道更改,但并不能保證瀏覽器直接對更改負責. 在“單頁應用程式”網站中,使用瀏覽器在視圖之間導航是合適的,這種導航通常在客戶端(即由瀏覽器)處理。但是,如果您的站點通過 AJAX 從服務器端進行這些更改,則您的“第 2 頁”重置也應通過 AJAX 完成,以便服務器始終知道您在做什么。
轉載請註明出處,本文鏈接:https://www.uj5u.com/net/357462.html
標籤:javascript
