Calling C# code behind method using javascript without ajax

Question

I have 2 buttons in my asp.net File

<asp:Button ID="BTN_Send_LA" runat="server" Text="Save" OnClientClick="ConfirmSendData()"></asp:Button>
//The button the client will click

<asp:Button ID="UploadButton" runat="server" Text="" OnClick="BTN_Send_LA_Click"/>
//Dummy Button for the JS .click()

And here is my Js part:

function ConfirmSendData() {
    var r = confirm("Êtes vous bien: " + document.getElementById("<%=DDL_LaveurLA.ClientID%>").options[document.getElementById("<%=DDL_LaveurLA.ClientID%>").selectedIndex].text + " sinon veuillez changer dans le champ spécifié 'Laveur'");

    if (r == true) {

        var clickButton = document.getElementById("<%= UploadButton.ClientID %>");
        clickButton.click();

        //$('UploadButton').trigger('click'); TEST 1
        //__doPostBack not working aswell

    }
}

So here what i expect to be done:

The client click the first button (Trigger the JS) => Works
R is true => Works
The JS part trigger the Onclick of UploadButton => Don't Work

I don't understand why this method doesn't work as it seems to be the general approach most other answers take on StackOverflow?

UPDATE:

Ok, I've tried every solutions proposed below and now i have weird problems:

When I click on the client button, 1 of the 3 following things happens randomly (route followed with the debugger)

1: The button click do a blank postback (IsPostBack == true) event OnClick="BTN_Send_LA_Click" not fired

2: The button click do a blank postback (IsPostBack == false) event OnClick="BTN_Send_LA_Click" not fired

3: The button fire the event OnClick="BTN_Send_LA_Click" of the dummy button properly.

I don't understand why. When i click directly on the dummy button, everything works fine

Everytime I do a CTRL+F5, the first time I click the client button will work 100% (event fired)

something else: in my event BTN_Send_LA_Click(), I change the background color of multiple controls (lightgreen)

1: If I click on the dummy button => the background color of the controls are changed

2: If I click on the client button and even if the BTN_Send_LA_Click() is fired, the background color doesn't change.

Why ? I'm totally lost on this one

Updated code:

        function ConfirmSendData()
     {
            /*
            var dd = document.getElementById("<%=DDL_LaveurLA.ClientID%>");
            var txt = dd.options[dd.selectedIndex].text;
            var r = confirm("Êtes vous bien: " + txt + " sinon veuillez changer dans le champ spécifié 'Laveur'"); */

            var r = confirm("Êtes vous bien: " + document.getElementById("<%=DDL_LaveurLA.ClientID%>").options[document.getElementById("<%=DDL_LaveurLA.ClientID%>").selectedIndex].text + " sinon veuillez changer dans le champ spécifié 'Laveur'");

            if (r == true) {
                //$("#<%=UploadButton.ClientID%>").click();

                var clickButton = document.getElementById("<%= UploadButton.ClientID %>");
                clickButton.click();

            }
            return false;  
    }

Have you tried $("#<%=UploadButton.ClientID%>").click(); ? — freefaller
– freefaller, Commented May 19, 2015 at 13:58
Welcome to StackOverflow. Please note that generally questions are kept at a fairly professional level so you wouldn't expect to see words like guyz in a question. — Ian
– Ian, Commented May 19, 2015 at 13:58
Which part doesn't work, getting the element or firing the click event? What does clickEvent contain after its assignment? — aw04
– aw04, Commented May 19, 2015 at 14:01

stovroz · Accepted Answer · 2015-05-19 14:19:23Z

4

You've got it all right except:

You need a closing } on your if statement.
ConfirmSendData() needs to return false to prevent the first button from submitting.

i.e.

function ConfirmSendData() {
    var r = confirm("Êtes vous bien...");
    if (r == true) {
        var clickButton = document.getElementById("<%= UploadButton.ClientID %>");
        clickButton.click();
    }
    return false;
}

answered May 19, 2015 at 14:19

stovroz

7,1052 gold badges52 silver badges61 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

freefaller Over a year ago

Good spot @stovroz. Although it also needs return to be added to the OnClientClick as well

charles godin Over a year ago

Hello, thanks for your help, I have updated the initial question since it works randomly

freefaller · Accepted Answer · 2015-05-19 14:02:14Z

2

You have the following commented out, which I presume means you've tried it and it didn't work...

//$('UploadButton').trigger('click'); TEST 1

jQuery needs the # character before the ID of the element to find it, so try this instead...

$("#<%=UploadButton.ClientID%>").click();

I would also update the first part of your function slightly to a more readable (and efficient) version by only finding the dropdown element once...

var dd = document.getElementById("<%=DDL_LaveurLA.ClientID%>");
var txt = dd.options[dd.selectedIndex].text;
var r = confirm("Êtes vous bien: " + txt + " sinon veuillez changer dans le champ spécifié 'Laveur'");

edited May 19, 2015 at 14:02

answered May 19, 2015 at 14:00

freefaller

20k7 gold badges62 silver badges96 bronze badges

4 Comments

aw04 Over a year ago

Isn't this just the jquery equivalent of the javascript code above?

freefaller Over a year ago

Probably @aw04, but I know I've had cross-browser trouble in the past with .click(); (can't remember exactly what now) so tend to favour the jQuery version. You're probably correct, so happy to withdraw the answer if proven

aw04 Over a year ago

I was just curious about the reasoning, it's still a helpful answer IMO.

charles godin Over a year ago

Hello, thanks for your help, I have updated the initial question since it works randomly (with your solution)

Alex Filatov · Accepted Answer · 2015-05-19 14:28:10Z

1

You should use $("#<%=UploadButton.ClientID%>") instead of $('UploadButton') because asp:Button elements generates not in element with just id UploadButton

function ConfirmSendData() {
    var r = confirm("Êtes vous bien: " + document.getElementById("<%=DDL_LaveurLA.ClientID%>").options[document.getElementById("<%=DDL_LaveurLA.ClientID%>").selectedIndex].text + " sinon veuillez changer dans le champ spécifié 'Laveur'");

    if (r == true) {

        var clickButton = document.getElementById("<%= UploadButton.ClientID %>");
        clickButton.click();

        // alternative variant for jquery
        // $("#<%=UploadButton.ClientID%>").click();
    }

}

also another thing that function ConfirmSendData needs to return false to prevent the submitting data by first button

edited May 19, 2015 at 14:28

answered May 19, 2015 at 14:00

Alex Filatov

2,3693 gold badges33 silver badges47 bronze badges

7 Comments

aw04 Over a year ago

While this is correct, it doesn't explain why the javascript part isn't working. You're example just does the same thing again with jquery.

Alex Filatov Over a year ago

@aw04 it doesn't work because element not found by jquery selector $('UploadButton'), because this is asp:Button with dynamically ID="UploadButton"

aw04 Over a year ago

I get that, and you're right of course, but I was talking about the javascript code above that essentially does the same thing.

Alex Filatov Over a year ago

@aw04 the first js code is a native js, and the second one is a jquery equivalent of it. They have different only sign # which needs for jquery for finding elements by id

aw04 Over a year ago

Yes but you didn't change the native javascript part. If it's not working, what makes you think the jquery alternative will?

|

Undo · Accepted Answer · 2015-05-19 14:41:14Z

1

Try this:

__doPostBack('<%= UploadButton.UniqueID %>', '');

edited May 19, 2015 at 14:41

Undo♦

25.7k38 gold badges113 silver badges132 bronze badges

answered May 19, 2015 at 14:16

loli

1,0688 silver badges14 bronze badges

Collectives™ on Stack Overflow

Calling C# code behind method using javascript without ajax

4 Answers 4

2 Comments

4 Comments

7 Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

4 Answers 4

2 Comments

4 Comments

7 Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related