0

私のページには、3 つのステップがある ASP ウィザードがあります。

<asp:Wizard ID="wizardBestellen" runat="server" ActiveStepIndex="0" DisplaySideBar="False" onfinishbuttonclick="wizard_NextButtonClick" onnextbuttonclick="wizard_NextButtonClick" onpreviousbuttonclick="wizard_PreviousButtonClick">
          <StartNavigationTemplate></StartNavigationTemplate>
          <StepNavigationTemplate></StepNavigationTemplate>
          <FinishNavigationTemplate></FinishNavigationTemplate>
          <WizardSteps>
            <asp:WizardStep runat="server" ID="step1" StepType="Start">
              <uc1:control ID="uc1" runat="server" />
            </asp:WizardStep>
            <asp:WizardStep runat="server"ID="step2" StepType="Step">
              <uc2:control ID="uc2" runat="server" />
            </asp:WizardStep>
            <asp:WizardStep ID="step3" runat="server" StepType="Finish">
              <uc3:control ID="uc3" runat="server" />
            </asp:WizardStep>
          </WizardSteps>
        </asp:Wizard>

これで、すべてのコントロールに [次へ] ボタンと [前へ] ボタンがあり、クリックするとデータが検証され、次のステップに進みます。ボタンはすべて次のようになります。

<asp:LinkButton ID="bntPrevious" runat="server" CommandName="MovePrevious" CssClass="buttonOrange" CausesValidation="false"><span>Previous</span></asp:LinkButton>
<asp:LinkButton ID="btnNext" runat="server" CommandName="MoveNext" CssClass="buttonOrange" CausesValidation="true"><span>Next</span></asp:LinkButton>

これまでのところ、すべてが完全に機能しています..ボタンをクリックした後、ボタンを無効にして、ローダー画像付きのdivを表示したかったのです。だから私は名前付きdivLoaderのdivと、ボタンが入っているdivを隠し、ローダーでdivを表示するjavascript関数を作成しました。

function ToggleDiv(divButton, divLabel)
{

        if (divButton.style.display == 'block')
        {
            divButton.style.display = 'none';
            divLabel.style.display = 'block';
        }
        else
        {
            divButton.style.display = 'block';
            divLabel.style.display = 'none';
        }
}

しかし、私はこれを機能させることができません。ToggleDiv 関数は別の状況でうまく機能するので、それは問題ではありません。リンクボタンの OnClick 属性から関数を呼び出そうとしましたが、これによりエラーが発生しました。OnClientClick を試しましたが、これは機能せず、コード ビハインドで onclick 属性を設定しようとしましたが、これも行き止まりでした。

誰かが私が間違っていることを説明できますか、またはユーザーがボタンを2回クリックするのを防ぐ別の方法はありますか?

4

1 に答える 1

1

バインディングが機能していないようです。

最初に行うことは、ソースの表示を実行して、発行されたコントロール ID を確認することです。.NET フレームワークの一部の実装では、これらのコントロール ID に余分な綿毛が追加されるため、フォームに表示されるものと同じになることは保証できません。

次に、JavaScript の遅延バインディングを試してみます。JavaScript ファイルがある場合は、そこに置きます。そうでない場合は、JavaScript ブロックを作成するか、フォームの下部に追加します (新しいファイルを作成してください)。

jQuery などの JavaScript ライブラリを使用すると、これらすべてがはるかに簡単になりますが、ここでは、ライブラリがないことを前提とします。

ウィンドウの onload イベント ハンドラーを追加する

window.onload = function(){
    //code to go here
}

次に、ボタンのクリック バインディングを追加します。

window.onload = function(){
    document.getElementById("***YOUR BUTTON ID***").onclick = function(){
        ToggleDiv(this, document.getElementById("***YOUR LABEL ID***"));
    }
}

これは jQuery を使用すると少し簡単になると言いましたが、これは同等の実装です。

$(document).ready(function(){
    $("#***YOUR BUTTON ID***").click(function(){
        $(this).toggle();
        $("#***YOUR LABEL ID***")).toggle();
    });
});

上記のサンプルでは、ToggleDiv​​関数の必要性が完全になくなります。

于 2012-04-04T08:24:08.870 に答える