简体   繁体   English

ASP.NET WebMatrix表单发布页面重新加载后出错?

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

I'm using ASP.NET Webmatrix and trying to load more data from SQL Database by Form Post request. 我正在使用ASP.NET Webmatrix,并尝试通过Form Post请求从SQL数据库加载更多数据。

By default I have 2 Results and When I click the Load More Button each time the result increases by +2. 默认情况下,我有2个结果,每当结果增加+2时,单击“加载更多”按钮。

在此处输入图片说明

Everything is working fine. 一切正常。 !But When I'm trying to reload my page, browser shows error. !但是,当我尝试重新加载页面时,浏览器显示错误。

在此处输入图片说明

Even if my form is already posted but browser is still showing for Resubmission error. 即使我的表单已经发布,但浏览器仍显示重新提交错误。 How can I remove this error? 如何清除此错误? Plz Help Me! 请帮我! & Here is my code: &这是我的代码:

**.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>

Its not Error 它不是错误

This is not an error in Browser, or your code. 这不是浏览器或代码中的错误。 It is just the question by Browser when it wants to ask the user whether the user wants to load the page with the very same data that he passed on previous time. 当浏览器想要询问用户是否要使用他上次传递的相同数据加载页面时,这仅仅是浏览器的问题。 No error! 没错!

Reasons for this 原因

That is because you're getting the data by submitting the form. 那是因为您通过提交表单来获取数据。 So it behaves like you want to get the data againt that was achieved by passing on some data, like username etc. That is why it asks for this dialog. 因此,它的行为就像您要通过传递一些数据(如用户名等)获得的数据一样。这就是为什么它要求此对话框的原因。

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

The above button is the reason for this. 上面的按钮是这样做的原因。

What you can do, is to use action and forward yourself to a new page where you will use the Response.Redirect() to the back page with an extra parameter, maybe a User Friendly like www.example.com/products?page=2 . 您可以做的是使用action并将自己转发到新页面,在该页面中,您将使用带有额外参数的Response.Redirect()到后页,例如www.example.com/products?page=2 In the HTML you won't write the page = 2 or anything. 在HTML中,您将不会编写page = 2或其他任何内容。 But it would denote that the page is new and the page was not load using a POST request. 但这表示该页面是新页面并且该页面使用POST请求加载

This way, you won't get the dialog again. 这样,您就不会再出现该对话框。 Untill you use the submit button to load the content of the page, you will get this box. 直到您使用“提交”按钮加载页面的内容,您才会看到此框。

A work around 变通

There is another alternate way of doing this. 还有另一种替代方法。 Which is using jQuery (I know I know jQuery always is not the only function, but) and removing the type="submit" attribute. 哪个正在使用jQuery(我知道我知道jQuery始终不是唯一的功能,但是)并删除了type="submit"属性。 For example, the HTML would be 例如,HTML将是

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

The jQuery to handle this code would be 负责处理此代码的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();
}

Response.Redirect method of ASP.NET ASP.NET的Response.Redirect方法

jQuery Ajax from jQuery API jQuery API的jQuery Ajax

Remove the if(IsPost) block 删除if(IsPost)

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

This code block would only execute when there is a Header to denote the request was post (the request is post if the form submitted has method="post" ). 仅当有Header表示请求已过时才执行此代码块(如果提交的表单具有method="post"则该请求为post)。 So using my idea won't work if you're having that block. 因此,如果遇到障碍,使用我的想法将行不通。

Remove the condition and execute it. 删除条件并执行。

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

Just this, this would update the variable by 2 and then provide the result again. 就是这样,这会将变量更新2,然后再次提供结果。 POST would only execute if the request is made through form and has the method set to post. 仅当通过表单发出请求并且将方法设置为post时,才会执行POST。 That is also the point where the error generates in your UI. 这也是您的UI中产生错误的地方。

Entire code for you 您的完整代码

@{
    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>

If I had to write the code the above would have been the code it self. 如果我必须编写代码,那么上面的代码就是它自己的代码。 This code is all that you need. 这段代码就是您所需要的。 It would reload the page and would update the content and so on. 它将重新加载页面并更新内容,依此类推。 Without using the POST request. 不使用POST请求。

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM