0

This is an c# asp.net based environment running [webmethod] codebehind and PageMethods on the rendered page to make calls to the codebehind.

I use asp: type labels, textboxes, buttons and validators. I have several buttons which become visible at different points in a process. Also on the form are field validators (asp:RequiredFieldValidator), which fire when the Enter key is pressed or the "DefaultButton" is clicked. I want the validation to occur, however I want the DefaultButton to change so that the function which is fired is never executed again. That is, if the enter key is pressed, at any time, the DefaultButton (and associated OnClientClick event) is fired. I wish to change what the DefaultButton is using javascript.

On the form is:

<form id="form1" runat="server" DefaultButton="btnCreateAccount">
.
.
.
<asp:Button ID="btnCreateAccount" runat="server" Text="Signup" style="display: inherit;" OnClientClick="ValidEmailTest(); return false;"/>
<asp:Button ID="btnVerifyAccount" runat="server" Text="Verify Mail Account" style="display: none;" OnClientClick="TestSetup(); return false;"/>
<asp:Button ID="btnValidate" runat="server" Text="Check Verification Code" style="display: none;" OnClientClick="Validation(); return false;"/>

I believe that if I can change the value of DefaultButton to a different button, then when the newly exposed fields are populated and the Enter key is pressed, then the fields would be validated and that button's "OnClientClick" action is performed. I am looking for the value of "DefaultButton", or where it can be modified, so I know what can be changed.

I have tried:

xyz = document.getElementById('<%= form1.ClientID %>')..getdefaultbutton;
alert ("Default Button is: "+ xyz);

The results: "Default Button is: undefined"

xyz = document.getElementById('<%= form1.ClientID %>').getAttribute("DefaultButton");
alert ("Default Button is: "+ xyz);

The results: "Default Button is: null"

var xyz = document.getElementById('<%= form1.ClientID %>').getAttributeNames();
alert ("Attributes are: "+ xyz);

The results: "Attributes are: method,action,onkeypress,id"

I do not want a post or a call back as everything is running as pagemethods running in the codebehind async. and delivering results to the page. Any call or post back refreshes the page and resets what the page displays and values the user has entered, or the system has returned.

Suggestions?

2 Answers2

0

Try to change the type of your default button to "submit".

Like:

myButton.type = "submit"; 

Try to read this answer: How to set the default button in content page using asp.net?

Nicola Biada
  • 2,325
  • 1
  • 8
  • 22
  • That would produce a submit of the page to the codebehind, which would reset the page to the default values, including erasing all of the data held on the page, correct? I am firing functions on the page, not submitting the page. – Jc Williams Aug 26 '21 at 19:51
  • If your code behind accepts and validate the data the page will be reload empty If you got a validation error I don't think your page will be cleaned. – Nicola Biada Aug 26 '21 at 20:00
  • This is a dynamic page with calls to the codebehind (AJAX), and there are a total of 3 different functions, which are produced using the calls to the c# code. Think of a banking transaction. You do not want to wipe out the data presented on the screen. It is an async process, with returned values which either promotes the process along, or throws an error. The user can then fix the error (wrong zip code or CCV entered for the card, for example), without destroying the information on the customer's webpage. – Jc Williams Aug 26 '21 at 20:14
  • I have also tried: ``` function getdefaultbutton1() { alert("Default Button fired"); this.Page.Form.DefaultButton = Button2.UniqueID; } function getdefaultbutton2() { alert("Default Button 2 fired"); } – Jc Williams Aug 26 '21 at 20:42
  • I have looked at the article you referenced above. That would be great if I have panels or other format schema. This form only has 6 fields of information the user enters, the code behind goes through up to 37 different iterations to determine what is the proper configuration to use. Using call backs or other methods would create significant communication overhead as there is dynamic updates sent back to the user in a async fashion, not to mention the constant flickering of the page as it is updated every 5-10 seconds. – Jc Williams Aug 26 '21 at 21:11
0

It appears that there is not a way to directly modify which button is the default. I designed a get around (not eloquent, but works). As there are only 6 fields the user can enter, use of panels or multiple <div>, did not make sense. Also, this process is in completely async communication with the codebehind (which is a great way to design your code to operate, vs blocking linear programing).

I decided to not attempt to change which button is the DefaultButton, and instead just change the value of the display of the button referenced by DefaultButton. That then eliminated two additional buttons which I did not need to display or not display.

I created a function called clickConductor(), which is the default button's assigned OnClientClick called function. This way, I am controlling how I deal with the next function to be executed, at the conclusion of a successful execution of a PageMethods call.

<%-- This is a function I created to send the default button to the proper selection --%>
        function clickConductor() {
            switch (currentFunction) {
                case 1:
                    validEmailTest();
                    break;
                case 2:
                    testSetup();
                    break;
                case 3:
                    validation();
                    break;
            }
        }

By only changing currentFunction in the successful function call for the specific PageMethods call, I can then make the proper changes to the button's value (displayed information), which does not occur if there is an error condition returned by the called codebehind function.

        function TEonSuccess(result) {
           verificationCode = result[1];
           document.getElementById('<%= btnClicker.ClientID %>').value = "Check Verification Code";
           document.getElementById("verificationArea").style.display = "inherit";
           document.getElementById('<%= txtVerificationCode.ClientID %>').value = "";
           document.getElementById('<%= txtVerificationCode.ClientID %>').focus();
           currentFunction = 3;
        }

I hope that this can help others who have been vexed by this issue with the DefaulButton and the attendant issue of the default "enter key action" issue without having to resort to complex <div> or panel structures.

Rifky Niyas
  • 1,737
  • 10
  • 25