Solved

Javascript confirmation if specific radio button set on submit

Posted on 2010-09-21
3
754 Views
Last Modified: 2012-06-27
I have a form. It has 4 rows and uses a single form statement. All of the radio buttons have the same name, dothis. The values are new1, edit1, delete1 for the first row AND new2, edit2 , delete2 for the second row and so on.

I would like an alert button to pop up, asking them to confirm their choice, only if they have clicked on one of the delete variables (delete1, delete2, etc) I DON'T want it to pop up if they set one of the non-delete radio buttons

If they confirm, I'd like to continue with the POST. It needs to actually POST becuase there are both the active and some hidden variables that are subsequently verified as being $_POST[] variables.

Is there a javaScript or JQuery way to do this? The main page is in PHP.  
javascript-alert.jpg
0
Comment
Question by:birwin
3 Comments
 
LVL 4

Expert Comment

by:rstjean
ID: 33731172
<script>
function valButton(obj) {
    var cnt = -1;
    //find which box is selected
    for (var i=0;obj.dothis.length-1; i++) {
      if (obj.dothis[i].checked) {
          cnt = i;
          break;
      }
    }
    //if selected
    if (cnt > -1) {
      var regexval = new RegExp('delete.*');
      var fieldval = obj.dothis[cnt].value;
      var tmp = re.exec(fieldval);
      if(tmp == null) {
      return true;
      }
      else{
           if(confirm('Are you sure you want to delete?')){
           return false;
           }
           else{
           return true;
           };
      }
    }
    // if not selected
    else
    {
    alert('Choose a value');
    return false;
    }
}
</script>
in your <form action="" onsubmit="valButton(this)">
0
 
LVL 14

Accepted Solution

by:
Designbyonyx earned 500 total points
ID: 33731265
jQuery version:
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>

    <script type="text/javascript">

	$(function() {

		$('#myform').click(function(e) {

			if(e.target.nodeName.toLowerCase() === 'input' && e.target.type === 'submit') {

				var $selectedRadio = $(e.target).parent().find('input[type=radio]:checked');

				if($selectedRadio.val().match(/delete/gi)) {

					return confirm("Are you sure you want to delete this?");

				}

			}

		});

	});

	</script>

Open in new window

0
 
LVL 6

Author Closing Comment

by:birwin
ID: 33731533
I love it. No additional markup required and it works perfectly. Thank you.
0

Featured Post

Is Your Active Directory as Secure as You Think?

More than 75% of all records are compromised because of the loss or theft of a privileged credential. Experts have been exploring Active Directory infrastructure to identify key threats and establish best practices for keeping data safe. Attend this month’s webinar to learn more.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

PROBLEM: The other day I was working on adding an ajax request to a webpage that already had a dialog box on the page.  The dialog box was using relative positioning to be positioned next to a form field I had on the page.  Everything was working…
Introduction Knockoutjs (Knockout) is a JavaScript framework (Model View ViewModel or MVVM framework).   The main ideology behind Knockout is to control from JavaScript how a page looks whilst creating an engaging user experience in the least …
The viewer will learn how to count occurrences of each item in an array.
The viewer will learn how to create and use a small PHP class to apply a watermark to an image. This video shows the viewer the setup for the PHP watermark as well as important coding language. Continue to Part 2 to learn the core code used in creat…

919 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question

Need Help in Real-Time?

Connect with top rated Experts

13 Experts available now in Live!

Get 1:1 Help Now