5

架空のページに 5 つのチェックボックスがあり、そのうちの 1 つがチェックされている場合は、ポストバックを実行したいと考えています。ただし、ポストバックを少し遅らせて、ユーザーがボックスをチェックした場合、サーバーへの往復を行う前に、ユーザーがそれ以上ボックスをチェックしたくないことを確認するために 1 秒ほど待機するようにします。したがって、5 つすべてを立て続けにチェックすると、ポストバックが送信される前に 5 つすべてをチェックすることができます。

誰かがこれを行ったことがありますか、これが行われたのを見ましたか、それがどのように行われるかを知っていますか、またはまったく行わない正当な理由がありますか?

4

4 に答える 4

7

AutoPostBack="false"チェックボックスをオンにして、ボタンを介してポストバックを起動してみませんか？そうすれば、ユーザーは必要なものすべてをチェックし、必要なときに結果を送信することができます。

ポストバックへの1つのボタンについてのコメントはユーザーにとって直感に反しているため、各チェックボックスをUpdatePanelでラップしてみませんか？これはもう少しマークアップかもしれませんが、「ポストバックの遅延」シナリオを実行しなくても、必要なことを正確に実行できます。

<asp:UpdatePanel ID="UpdatePanel1" runat="server" UpdateMode="Conditional">
    <asp:CheckBox ID="CheckBox1" runat="server" AutoPostBack="true" />
</asp:UpdatePanel>

<asp:UpdatePanel ID="UpdatePanel2" runat="server" UpdateMode="Conditional">
    <asp:CheckBox ID="CheckBox2" runat="server" AutoPostBack="true" />
</asp:UpdatePanel>

<asp:UpdatePanel ID="UpdatePanel3" runat="server" UpdateMode="Conditional">
    <asp:CheckBox ID="CheckBox3" runat="server" AutoPostBack="true" />
</asp:UpdatePanel>

<asp:UpdatePanel ID="UpdatePanel4" runat="server" UpdateMode="Conditional">
    <asp:CheckBox ID="CheckBox4" runat="server" AutoPostBack="true" />
</asp:UpdatePanel>

<asp:UpdatePanel ID="UpdatePanel5" runat="server" UpdateMode="Conditional">
    <asp:CheckBox ID="CheckBox5" runat="server" AutoPostBack="true" />
</asp:UpdatePanel>
于 2012-04-14T01:45:16.843 に答える
7

あなたは jQuery を使用しているとは言いませんでしたが、説明と明確化のために、jQuery が使用可能であると仮定します。これに沿った何かがあなたのために働くはずです：

var timeout = null;

// Set up code to respond to when the checkbox is checked/unchecked
$('input[type="checkbox"]').change(function() {
    // If this is the second check box in a row, clear previous timeout
    if (timeout != null) 
        clearTimeout(timeout);

    // Set a timeout that will fire in 5 seconds 
    timeout = setTimeout(function() {
          // Post back the form
        __doPostBack();
    }, 5000);
});
于 2012-04-13T22:49:32.723 に答える
2

誰かがこれを行ったことがありますか、これが行われたのを見ましたか、それがどのように行われるかを知っていますか、またはまったく行わない正当な理由がありますか?

ページの構造をリロードまたは変更する遅延アクションには反対します。理由は次のとおりです。

理由 #1
人々はさまざまな入力方法を使用して、非常に異なる速度でクリックします。

理由 2
行動は一貫しているべきであり、自分だけが知っている隠れた規則に従うべきではありません。ユーザーは十分なトレーニングを受けており、最適化を活用できる場合もありますが、ほとんどの場合、そうではありません。

理由 #3
構造的な変更 (特に非同期で実行された変更) により、後続のアクションが取り消される可能性があります。

例：

  • ユーザーがボックスをチェックします。
  • ページは少し遅れて非同期にポストバックします。
  • ユーザーは同じボックスのチェックを外します。
  • 非同期ポストバックが完了し、ボックスを再チェックします。

これは非同期ポストバックの設計上の考慮事項ですが、遅延によりさらに直感的ではなくなります。

別
の方法 ポストバックが発生したときにライフサイクル全体を実行する必要がある場合は、ポストバックをすぐに実行することをお勧めします。

操作でページのライフサイクル全体を実行する必要がない場合は、何らかの AJAX 呼び出しを使用してバックグラウンドでロジックを実行し、ポストバックを完全に排除することをお勧めします。その後、結果の値を使用してブラウザーを更新できます (必要な場合)。

于 2012-04-23T04:48:51.557 に答える
0

私も一度この問題に遭遇しました。非表示フィールドに格納されたフラグを使用して、なんとか機能させることができました。このことを考慮：

<%-- SomePage.aspx --%>
<asp:HiddenField ID="checkboxClicked" runat="server" Value="false" />

<asp:CheckBox ID="checkBox1" runat="server" Text="Check 1" AutoPostBack="true" OnClientClick="return onCheckboxClick();" OnClick="OnCheckBoxClick" />
<asp:CheckBox ID="checkBox2" runat="server" Text="Check 2" AutoPostBack="true" OnClientClick="return onCheckboxClick();" OnClick="OnCheckBoxClick" />
<asp:CheckBox ID="checkBox3" runat="server" Text="Check 3" AutoPostBack="true" OnClientClick="return onCheckboxClick();" OnClick="OnCheckBoxClick" />
<asp:CheckBox ID="checkBox4" runat="server" Text="Check 4" AutoPostBack="true" OnClientClick="return onCheckboxClick();" OnClick="OnCheckBoxClick" />
<asp:CheckBox ID="checkBox5" runat="server" Text="Check 5" AutoPostBack="true" OnClientClick="return onCheckboxClick();" OnClick="OnCheckBoxClick" />

<%
    protected void OnCheckBoxClick(object sender, EventArgs args)
    {
        // Your code here...

        checkboxClicked.Value = "false";
    }
%>

<script type="text/javascript">

    function onCheckboxClick() {
        var canPostBack = true;

        if ($('#checkboxClicked').val() === 'true') {
            canPostBack = false;
        }
        else {
            $('#checkboxClicked').val('true');
            canPostBack = true;
        }

        return canPostBack;
    }

</script>
于 2012-04-23T14:53:43.280 に答える