如何识别ASP.NET向导控件中的步骤?

时间:2016-12-29 12:47:29

标签: javascript c# jquery asp.net

我正在使用ASP.NET向导控件。我有11个幻灯片(IN GIF)格式,我在每个向导步骤中使用了Image Control。现在我使用JQuery在每个步骤的NEXT按钮中添加了5秒延迟,并且我做到了并且它工作正常。

我的问题是我在每个步骤的每个NEXT按钮后面的代码中分配Java脚本现在,问题是NEXT按钮在Wizard控件中呈现为三个不同的名称,即(StartNextButton)然后(StepNextButton)和最后一个步骤它呈现为(FinishButton)

现在怎样才能使我的Jquery功能足够通用,可以与所有NEXT按钮一起使用?或者在代码后面有什么方法我可以识别哪一步(幻灯片)所以我可以相应地分配Jquery函数?

第一步:

ScriptManager.RegisterStartupScript(Page, Page.GetType(), "disabled", JsTimerFunction("Wizard1_StartNavigationTemplateContainerID_StartNextButton"), true);

这是我为Wizard Control中的每个步骤分配Jquery函数的方式,除了第一个和最后一个..

ScriptManager.RegisterStartupScript(Page, Page.GetType(), "disabled", JsTimerFunction("Wizard1_StepNavigationTemplateContainerID_StepNextButton"), true);

最后一个按钮

ScriptManager.RegisterStartupScript(Page, Page.GetType(), "disabled", JsTimerFunction("Wizard1_FinishNavigationTemplateContainerID_FinishButton"), true);

这是我的服务器端代码,用于生成Jquery字符串

     private string JsTimerFunction(string ctrlID){

        var str = new StringBuilder();
        str.AppendLine();
        str.AppendLine(" $( document ).ready(function() {");
        str.AppendLine("var button = $(\"#" + ctrlID + "\");" );
        str.AppendLine("var oldValue = $(\"#" + ctrlID + "\").value;");
        str.AppendLine("button.attr('disabled', true);");
        str.AppendLine("button.value = 'Wait 5 sec';");
        str.AppendLine();
        str.AppendLine("setTimeout(function () {");
        str.AppendLine("button.value = oldValue;");
        str.AppendLine("button.removeAttr('disabled');");
        str.AppendLine(" }, 5000)");
        str.AppendLine();
        str.AppendLine(" });");

        return str.ToString();
    }

这是我在ASP.NET页面中的向导控制列表:

 <asp:Wizard ID="Wizard1" runat="server" ActiveStepIndex="0" DisplaySideBar="False" Height="357px" Width="623px" FinishPreviousButtonText="سابق" StepNextButtonText="التالى" StepPreviousButtonText="سابق" FinishCompleteButtonText="اذهب الى اختبار" StartNextButtonText="التالى" OnActiveStepChanged="Wizard1_ActiveStepChanged" OnNextButtonClick="Wizard1_NextButtonClick">
        <FinishNavigationTemplate>
            <asp:Button ID="FinishButton" runat="server" CommandName="MoveComplete" Text="اذهب الى اختبار" />
            <asp:Button ID="FinishPreviousButton" runat="server" CausesValidation="False" CommandName="MovePrevious" Text="سابق" />
        </FinishNavigationTemplate>
        <NavigationStyle HorizontalAlign="Left" />
        <StepNextButtonStyle BorderStyle="None" />
        <StartNavigationTemplate>
            <asp:Button ID="StartNextButton" runat="server" CommandName="MoveNext" Text="التالى" />
        </StartNavigationTemplate>
        <StepNavigationTemplate>
            <asp:Button ID="StepNextButton" runat="server"  EnableTheming="True" CommandName="MoveNext" Text="التالى" />
            <asp:Button ID="StepPreviousButton" runat="server" CausesValidation="False" CommandName="MovePrevious" EnableTheming="True" Text="سابق" />
        </StepNavigationTemplate>
        <WizardSteps>
            <asp:WizardStep runat="server" title="Step 1">
                <asp:Image ID="Image1" runat="server" ImageUrl="~/images/1.png" Width="614px" />
            </asp:WizardStep>
            <asp:WizardStep runat="server" title="Step 2">
                <asp:Image ID="Image2" runat="server" ImageUrl="~/images/2.png" Width="614px" />
            </asp:WizardStep>
             <asp:WizardStep runat="server" title="Step 3">
                <asp:Image ID="Image3" runat="server" ImageUrl="~/images/3.png" Width="614px" />
            </asp:WizardStep>
             <asp:WizardStep runat="server" title="Step 4">
                <asp:Image ID="Image4" runat="server" ImageUrl="~/images/4.png" Width="614px" />
            </asp:WizardStep>
             <asp:WizardStep runat="server" title="Step 5">
                <asp:Image ID="Image5" runat="server" ImageUrl="~/images/5.png" Width="614px" />
            </asp:WizardStep>
             <asp:WizardStep runat="server" title="Step 6">
                <asp:Image ID="Image6" runat="server" ImageUrl="~/images/6.png" Width="614px" />
            </asp:WizardStep>
             <asp:WizardStep runat="server" title="Step 7">
                <asp:Image ID="Image7" runat="server" ImageUrl="~/images/7.png" Width="614px" />
            </asp:WizardStep>
             <asp:WizardStep runat="server" title="Step 8">
                <asp:Image ID="Image8" runat="server" ImageUrl="~/images/8.png" Width="614px" />
            </asp:WizardStep>
             <asp:WizardStep runat="server" title="Step 9">
                <asp:Image ID="Image9" runat="server" ImageUrl="~/images/9.png" Width="614px" />
            </asp:WizardStep>
            <asp:WizardStep runat="server" title="Step 10">
                <asp:Image ID="Image10" runat="server" ImageUrl="~/images/10.png" Width="614px" />
            </asp:WizardStep>
            <asp:WizardStep runat="server" title="Step 11">
                <asp:Image ID="Image11" runat="server" ImageUrl="~/images/11.png" Width="614px" />
            </asp:WizardStep>

        </WizardSteps>
    </asp:Wizard>

现在怎样才能使我的Jquery函数足够通用,可以与向导控件中的所有NEXT按钮一起使用,或者在代码后面有什么方法我可以识别哪一步(Slide)所以我可以相应地分配Jquery函数? / p>

任何人都可以帮助我吗?

0 个答案:

没有答案