ASP.NET

Pop-up modal box when radio button clicked RSS

5 replies

Last post Nov 05, 2012 12:26 PM by crazyjoe

‹ Previous Thread|Next Thread ›

- Reply
crazyjoe

Member

49 Points

55 Posts

Pop-up modal box when radio button clicked

Nov 02, 2012 02:05 PM|LINK

Hi,

I’ve a form with 2 groups of radio buttons e.g. one group has 3 radio buttons 1, 2 and 3 and another with group with 3 radio buttons – A, B and C.

When a user selects a certain combination e.g. 1 and B, I want to display a modal pop-up with close button.

Can somebody give me a clue as how to do this? I'm new to asp.net so please explain step by step.

My web page is coded in c# asp.net.

Thanks

Joe Green
- Reply
texx

Contributor

2412 Points

415 Posts
Re: Pop-up modal box when radio button clicked

Nov 02, 2012 03:44 PM|LINK
Two main ways to do this.
1. Server side coding...
  1. Get the ajaxcontroltoolkit from codeplex(http://ajaxcontroltoolkit.codeplex.com/), use the documentation to create a modalpopupextender (http://www.asp.net/ajaxLibrary/AjaxControlToolkitSampleSite/ModalPopup/ModalPopup.aspx).
  2. Add event handling on the radio buttons, and in your code behind, check to see if the combination is selected, and if so, show your modalpopupextender.
2. Client side coding...
  1. Use jquery ui to create a jquery modal dialog box (http://jqueryui.com/dialog/)
  2. Use jquery to handle the selected event of the radio button input and if the correct combination is selected, show the modal dialog. (see jsbin sample http://jsbin.com/acupax/1/edit)
Robin
- Reply
ramiramilu

All-Star

95493 Points

14106 Posts

Re: Pop-up modal box when radio button clicked

Nov 02, 2012 04:54 PM|LINK

handle onchange events of both RadioButtonlists in jquery.....in the onchange events check if both radiobuttonlists have values....if so then use jquery modalpopup (you can find many online) to show the content of your interest....

Thanks,

Website
JumpStart
- Reply
crazyjoe

Member

49 Points

55 Posts

Re: Pop-up modal box when radio button clicked

Nov 02, 2012 05:09 PM|LINK

I prefer doing it on client side to save a round trip. I don't have a clue as how to use jQuery. Can anyone can help with jQuery function call. I'm using radiobuttonlist. Radiobuttonlist don't have onchange event.
- Reply
crazyjoe

Member

49 Points

55 Posts

Re: Pop-up modal box when radio button clicked

Nov 05, 2012 11:35 AM|LINK

Any help with jquery and Radiobuttonlist. Seems like not many programming in .net are familiar with jquery.
- Reply
crazyjoe

Member

49 Points

55 Posts
Re: Pop-up modal box when radio button clicked

Nov 05, 2012 12:26 PM|LINK
This seems to work. Hope this helps anybody else that is looking for similar functionality.
```
<script>
		    $(function () {
			$( "#radio1" ).change(function() {
			$( "#dialog-modal" ).dialog({width: 500, height:400, modal:true });
			$( "#dialog-modal" ).dialog( "open");
	});

</script>
```
- Edited by crazyjoe on Nov 05, 2012 12:26 PM
- Edited by Young Yang - MSFT on Dec 11, 2012 12:15 PM