簡體   English   中英

ASP.NET WebMatrix表單發布頁面重新加載后出錯?

[英]ASP.NET WebMatrix After form post page reload Error?

我正在使用ASP.NET Webmatrix,並嘗試通過Form Post請求從SQL數據庫加載更多數據。

默認情況下,我有2個結果,每當結果增加+2時,單擊“加載更多”按鈕。

在此處輸入圖片說明

一切正常。 !但是,當我嘗試重新加載頁面時,瀏覽器顯示錯誤。

在此處輸入圖片說明

即使我的表單已經發布,但瀏覽器仍顯示重新提交錯誤。 如何清除此錯誤? 請幫我! &這是我的代碼:

**.cshtml**
@{
    var rowsNumb = 2;
    var db = Database.Open("Northwind");
    if (IsPost){
        rowsNumb = Request["lastRec"].AsInt() + 2;
    }else{}
    var maxRecs = db.QueryValue("SELECT COUNT([Product Id]) FROM Products");
    var sql = @"SELECT * FROM Products ORDER BY [Product Id] 
                OFFSET 0 ROWS FETCH NEXT @0 ROWS  ONLY";
    rowsNumb = (rowsNumb > maxRecs ? maxRecs : rowsNumb);
    var result = db.Query(sql, rowsNumb);
}
<!DOCTYPE html>
<html lang="en">
    <head>
    </head>
    <body>
        <table>
            @foreach(var row in result){
                <tr>
                    <td>@row["Product Name"]</td>
                    <td>@row["English Name"]</td>
                    <td>@row["Unit Price"]</td>
                </tr>
            }
        </table>
        <form method="post">
            <input type="hidden" name="lastRec" value="@rowsNumb"/>
            <button type="submit">Load More</button>
        </form>
    </body>
</html>

它不是錯誤

這不是瀏覽器或代碼中的錯誤。 當瀏覽器想要詢問用戶是否要使用他上次傳遞的相同數據加載頁面時,這僅僅是瀏覽器的問題。 沒錯!

原因

那是因為您通過提交表單來獲取數據。 因此,它的行為就像您要通過傳遞一些數據(如用戶名等)獲得的數據一樣。這就是為什么它要求此對話框的原因。

<button type="submit">Load More</button>

上面的按鈕是這樣做的原因。

您可以做的是使用action並將自己轉發到新頁面,在該頁面中,您將使用帶有額外參數的Response.Redirect()到后頁,例如www.example.com/products?page=2 在HTML中,您將不會編寫page = 2或其他任何內容。 但這表示該頁面是新頁面並且該頁面使用POST請求加載

這樣,您就不會再出現該對話框。 直到您使用“提交”按鈕加載頁面的內容,您才會看到此框。

變通

還有另一種替代方法。 哪個正在使用jQuery(我知道我知道jQuery始終不是唯一的功能,但是)並刪除了type="submit"屬性。 例如,HTML將是

<button id="submit">Load More</button>

負責處理此代碼的jQuery將是

$('#submit').click(function () {
   // either use ajax to load the content and add it, or
   // use window.location() to move to the next page and
   // come back to this page using Response.Redirect();
}

ASP.NET的Response.Redirect方法

jQuery API的jQuery Ajax

刪除if(IsPost)

if (IsPost) { 
   rowsNumb = Request["lastRec"].AsInt() + 2;
   Response.Redirect("~/Default?v2");
}

僅當有Header表示請求已過時才執行此代碼塊(如果提交的表單具有method="post"則該請求為post)。 因此,如果遇到障礙,使用我的想法將行不通。

刪除條件並執行。

rowsNumb = Request["lastRec"].AsInt() + 2;
Response.Redirect("~/Default?v2");

就是這樣,這會將變量更新2,然后再次提供結果。 僅當通過表單發出請求並且將方法設置為post時,才會執行POST。 這也是您的UI中產生錯誤的地方。

您的完整代碼

@{
    var rowsNumb = 2;
    var db = Database.Open("Northwind");
    rowsNumb = Request["lastRec"].AsInt() + 2;
    // no need for else block since there is no code there
    var maxRecs = db.QueryValue("SELECT COUNT([Product Id]) FROM Products");
    var sql = @"SELECT * FROM Products ORDER BY [Product Id] 
            OFFSET 0 ROWS FETCH NEXT @0 ROWS  ONLY";
    rowsNumb = (rowsNumb > maxRecs ? maxRecs : rowsNumb);
    var result = db.Query(sql, rowsNumb);
}
<!DOCTYPE html>
<html lang="en">
    <head>
    </head>
    <body>
        <table>
            @foreach(var row in result){
                <tr>
                    <td>@row["Product Name"]</td>
                    <td>@row["English Name"]</td>
                    <td>@row["Unit Price"]</td>
                </tr>
            }
        </table>
        <a href="~/page?lastRec=@rowsNumb">Load More</a>
   </body>
</html>

如果我必須編寫代碼,那么上面的代碼就是它自己的代碼。 這段代碼就是您所需要的。 它將重新加載頁面並更新內容,依此類推。 不使用POST請求。

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM