禁用按钮的JavaScript设置属性

Question

PRE EDIT: It turned out that it was not about the disability of the button, but making some other actions after save. I debugged the page and found out that after making changes on a saved form, then page loses the javascript functionality in the (document).ready part. I've added the solution as an answer.

---

I have an entry page which has two buttons save and approve. The mechanism is something like, you can fill the form and save, then approve. You can also reach a saved page by refreshing the page or from the list of your saved pages.

The approve button is disabled if the form is not saved. I enable it from code behind after saving. Approve button also has a confirm button extender which takes its confirm text from javascript. I load it in (document).ready and its code is:

$(document).ready(function () {
        $("#ASPxSplitter1_ContentPlaceHolder1_uctActivityEntry1_tbActivity_tbHistory_btnApproveActivity_btnApprove").click(function () {

            $("#ASPxSplitter1_ContentPlaceHolder1_uctActivityEntry1_tbActivity_tbHistory_btnApproveActivity_lblMessage").text(GetConfirmTextForApprove());
        });
    });

,where GetConfirmTextForApproval() makes some calculations and returns the confirm text.

Now, my problem is, as the button is disabled when you open the form, the code above is not rendered at the first page load. This leads to the problem that, when I start to fill a form and save it, then approve it, I don't get any confirm text, because it does not run the function. But after refreshing the page or after I go to a saved form's page from another page, I get the proper confirm text.

So, how can I solve this problem? How can I get the proper confirm text even though the button is disabled at the first page load?

Note: I have to add that after saving, the url of the page is changed. The query string is added. That might also cause the problem.

Answer 1

You can use

// Disable #x
$( "#x" ).prop( "disabled", true );

// Enable #x
$( "#x" ).prop( "disabled", false );

But not when document ready, you need enable button when you want. Then you need create a event listener

$("#button").click(function(){
  //Your code

  if(GetConfirmTextForApproval()){
  //You active the button and the text that you want show.
   }
});

Answer 2

Solved my own problem:

As it was said in the pre edit of the question, the problem was caused because of making changes after the save. I've changed my function as:

$(document).ready(function () {
    SetConfirmMessageForApproval();
    Sys.WebForms.PageRequestManager.getInstance().add_endRequest(EndRequestHandler);
});

function EndRequestHandler(sender, args) {
    SetConfirmMessageForApproval();
    }

function SetConfirmMessageForApproval() {
        $("#ASPxSplitter1_ContentPlaceHolder1_uctActivityEntry1_tbActivity_tbHistory_btnApproveActivity_btnApprove").click(function () {
            $("#ASPxSplitter1_ContentPlaceHolder1_uctActivityEntry1_tbActivity_tbHistory_btnApproveActivity_lblMessage").text(GetConfirmTextForApprove());
        });
    }

This helps, if anyone else needs it.