mcabral
mcabral

Reputation: 3558

Confirm DropDownList selected value

I want to show the user a confirm dialog when he tries to change the selected item of a DropDownList. If the selection is confirmed i want to execute some server side code.

Say, DDL has values 1 and 2.

I'm having a lot of trouble with this one, since DDL has few events to use.

So far i got

this.MyDropDown.Attributes["onChange"] = @"return confirm('Are you sure?');";

and a event handler for the SelectedIndexChanged event of the DDL for the server side code.

But i'm having trouble with the fact that i can't neither stop (or revert) the item being changed nor the SelectedIndexChanged event being fired.

Any suggestions?

Upvotes: 1

Views: 6369

Answers (2)

Raghubir Singh
Raghubir Singh

Reputation: 227

This is complete solution, as i have already used it. Just refer the following instructions:

// Paste it in Aspx file
function handleChange(opt) {
    if (!confirm('Are you sure?')) {
        opt.selectedIndex = opt.oldIndex;
    }
    else {
        __doPostBack('MyDropDown','')
    }
}

Paste this in Page Load event outside IsPostBack:

this.MyDropDown.Attributes["onChange"] = "handleChange(this)";
this.MyDropDown.Attributes["onFocus"] = "this.oldIndex = this.selectedIndex";

Note: Set AutoPostBack Proerty False of Dropdownlist.

Upvotes: 1

Vadim
Vadim

Reputation: 17957

The reason it's not triggering the server side event is because you're wiping out the built-in webforms event handler that would trigger the post back. As for reverting the value, you'll need to save it and then reload it.

add this javascript function

function handleChange(opt) {
    if (!confirm('are you sure')) {
        opt.selectedIndex = opt.oldIndex;
    }
    else {
        __doPostBack('MyDropDown','')
    }
}

and set the client side events like so

this.MyDropDown.Attributes["onChange"] = "handleChange(this)";
this.MyDropDown.Attributes["onFocus"] = "this.oldIndex = this.selectedIndex";

Upvotes: 4

Related Questions