How to validate my radio button fields using magento?

Question

I have created the form but i could validate my radio button fields. When I click on the submit it is not showing any alert symbol.

When no radio button is selected it has to show as in the image for radio button. please anyone help me.

My form

  <form action="<?php echo $this->getFormAction(); ?>" id="bookingtest" method="post">
<div class="fieldset">
    <ul class="form-list">
        <li class="fields">
        <div class="field">
            <label for="testname" class="required"><em>*</em><?php echo $this->__('Test Name') ?> </label>
                <div class="input-box">
                    <input type="text" id="testname" name="testname" value="<?php echo $_GET['name']?>" class="input-text required-entry" title="<?php echo $this->__('Test Name') ?>" />
                </div>
            </div>  

            <div class="field"> 

            <label for="city" class="required"><em>*</em><?php echo $this->__('City') ?> </label>
                <div class="input-box">
                        <input type="text" id="city" name="city" value="<?php echo $_GET['city']?>" class="input-text required-entry" title="<?php echo $this->__('City') ?>" />
                </div>
        </div>
        </li>
        <li>

            <label for="location" class="required"><em>*</em><?php echo $this->__('Location') ?> </label>
                <div class="input-box">
                        <input type="text" id="location" name="location" value="<?php echo $_GET['location']?>" class="input-text required-entry" title="<?php echo $this->__('Location') ?>" />
                </div>

        </li>
        <li class="fields">
        <div class="field">
            <label for="cname" class="required"><em>*</em><?php echo $this->__('Name') ?> </label>
                <div class="input-box">
                        <input type="text" id="cname" name="cname" value="" class="input-text required-entry" title="<?php echo $this->__('Name') ?>" />
                </div>
            </div>
        <div class="field">
         <label for="email" class="required"><em>*</em><?php echo $this->__('Email Address') ?></label>
                <div class="input-box">
                    <input type="text" name="email" value="<?php echo $this->escapeHtml($this->getUsername()) ?>" id="email" class="input-text required-entry validate-email" title="<?php echo $this->__('Email Address') ?>" />
                </div>
        </div>
        </li>
        <li>

            <label for="mobile" class="required"><em>*</em><?php echo $this->__('Mobile Number') ?> </label>
                        <div class="input-box">
                            <input type="text" id="mobile" name="mobile" value="" class="input-text required-entry validate-mobileno" title="<?php echo $this->__('Mobile Number') ?>" />
                        </div>
         </li>
          <li>
          <label class="required"><em>*</em><?php echo $this->__('Sample Collection') ?> </label></li>
          <li>
                <div class="radio_button">
                <input type="radio" name="radio" class="input-text required-entry validate-select" value="I will visit Lab"> I will visit Lab
                </div>
                <div>
                <input type="radio" name="radio" class="input-text required-entry validate-select" value="Visit me at home/office +Rs50.00" > Visit me at home/office +Rs50.00
                </div>
         </li>
         <li>
                <label for="testschedule" class="required"><em>*</em><?php echo $this->__('Test Schedule') ?> </label>
                    <div class="input-box">
                        <input type="text" id="testschedule" name="testschedule" value="" class="input-text required-entry" title="<?php echo $this->__('Test Schedule') ?>" style="width: 150px;" />
                        <img style="" title="Select Date" id="date_select_trig" alt="" src="<?php echo $this->getSkinUrl("images/calendar.gif");?> "/>
                        <select name="date_time" id="date_time" class="input-text required-entry validate-select" style="width: 50px;" />
                                    <option value=""><?php echo $this->__('--')?></option>
                                    <option value="1"><?php echo $this->__('1')?></option>
                                    <option value="2"><?php echo $this->__('2')?></option>
                                    <option value="3"><?php echo $this->__('3')?></option>
                                    <option value="4"><?php echo $this->__('4')?></option>
                                    <option value="5"><?php echo $this->__('5')?></option>
                                    <option value="6"><?php echo $this->__('6')?></option>
                                    <option value="7"><?php echo $this->__('7')?></option>
                                    <option value="8"><?php echo $this->__('8')?></option>
                                    <option value="9"><?php echo $this->__('9')?></option>
                                    <option value="10"><?php echo $this->__('10')?></option>
                                    <option value="11"><?php echo $this->__('11')?></option>
                                    <option value="12"><?php echo $this->__('12')?></option>
                            </select>
                            <b>:</b>


                    </div>
        </li>

    </ul>
    </div>
    <div class="button">
<p class="required"><?php echo $this->__('* Required Fields') ?></p>
    <button id= "submit"  type="submit" class="button" title="<?php echo $this->__('Book Test') ?>" name="send" id="send2"><span><span><?php echo $this->__('Book Test') ?></span></span></button>
</div>


 </form>

  <script src="<?php echo Mage::getBaseUrl('js')."calendar/calendar.js" ?>" type="text/javascript"></script>

   <script src="<?php echo Mage::getBaseUrl('js')."calendar/calendar-setup.js" ?>" type="text/javascript"></script>

   <link rel="stylesheet" type="text/css" href="<?php echo Mage::getBaseUrl('js') ?>calendar/calendar-win2k-1.css"  />
<?php echo $this->getLayout()->createBlock('core/html_calendar')->setTemplate('page/js/calendar.phtml')->toHtml();?>

  <script type="text/javascript">

    if(Validation) {
     Validation.addAllThese([
['validate-mobileno','Enter correct mobile number (Eg:9986858483)',
   function(v){
    //var timePat ="^((\+){0,1}91(\s){0,1}(\-){0,1}(\s){0,1}){0,1}9[0-9](\s){0,1}(\-){0,1}(\s){0,1}[1-9]{1}[0-9]{7}$";

var timePat ="^{0,1}9[0-9](\s){0,1}(\-){0,1}(\s){0,1}[1-9]{1}[0-9]{7}$";
// var matchArray = v.match(timePat);
if(v.length > 0){
if(v.length !=10){
    return false;
   }else if(v[0]!=9 && v[0]!=8 && v[0]!=7){

    return false;
   }


return true;

}else {
return false;
}

}
   ]])
  };
   var dataForm = new VarienForm('bookingtest', true); 
 </script>
 <script type="text/javascript">
   // <![CDATA[
 Calendar.setup({
 inputField : 'testschedule',
   ifFormat : '%d-%b-%Y',
showsTime: false,
 button : 'date_select_trig',
 singleClick : true,
 });
   // ]]>
</script>

Qaisar Satti · Accepted Answer · 2015-11-20 10:26:45Z

<li>
          <label class="required"><em>*</em><?php echo $this->__('Sample Collection') ?> </label></li>
          <li>
                <div class="radio_button">
                <input type="radio" name="radio" class="input-radio validate-one-required-by-name" value="I will visit Lab"> I will visit Lab
                </div>
                <div>
                <input type="radio" name="radio" class="input-radio  validate-one-required-by-name" value="Visit me at home/office +Rs50.00" > Visit me at home/office +Rs50.00
                </div>
         </li>

for html

    <div class="input-box">
  <div style="float:left">
                            <input type="text" id="testschedule" name="testschedule" value="" class="input-text required-entry validation-failed" title="Test Schedule" style="width: 150px;"><div style="" id="advice-required-entry-testschedule" class="validation-advice">This is a required field.</div></div><div style="float:left">
                            <img style="" title="Select Date" id="date_select_trig" alt="" src="http://www.labwise.in/devel/skin/frontend/ultimo/default/images/xcalendar.gif.pagespeed.ic.nkzRZoIMTp.png">
  </div><div style="float:left;widht:50px">
                            <select name="date_time" id="date_time" class="input-select required-entry validate-select validation-failed" style="width: 50px;">
                                        <option value="">--</option>
                                        <option value="1">1</option>
                                        <option value="2">2</option>
                                        <option value="3">3</option>
                                        <option value="4">4</option>
                                        <option value="5">5</option>
                                        <option value="6">6</option>
                                        <option value="7">7</option>
                                        <option value="8">8</option>
                                        <option value="9">9</option>
                                        <option value="10">10</option>
                                        <option value="11">11</option>
                                        <option value="12">12</option>
                                </select><div style="" id="advice-required-entry-date_time" class="validation-advice">This is a required field.</div></div><div style="float:left">
                                <b>:</b>
  </div><div style="float:left">
                                <select name="date_time" id="date_time" class="input-select required-entry validate-select validation-failed" style="width: 50px;">
                                        <option value="">--</option>
                                        <option value="1">1</option>
                                        <option value="2">2</option>
                                        <option value="3">3</option>
                                        <option value="4">4</option>
                                        <option value="5">5</option>
                                        <option value="6">6</option>
                                        <option value="7">7</option>
                                        <option value="8">8</option>
                                        <option value="9">9</option>
                                        <option value="10">10</option>
                                        <option value="11">11</option>
                                        <option value="12">12</option>
                                </select>
  </div><div style="float:left">
                                <select name="date_time" id="date_time" class="input-select required-entry validate-select validation-failed" style="width: 50px;">
                                        <option value="">--</option>
                                        <option value="1">AM</option>
                                        <option value="2">PM</option>
                                </select>
  </div><div style="float:left">
                        </div></div>

it is showing same the gap is so much it is not getting as in the image also — Mouni, Commented Nov 20, 2015 at 9:12

Surya prakash Patel · Accepted Answer · 2015-11-20 09:38:40Z

If you are using magento form validation add class(magento-checkbox-validation) in your radio inputs(of same group):

class="magento-checkbox-validation" OR use "validate-one-required" on the last radio/checkbox in the group

And if you are writing your custom script then add this function in script :

  function validateRadioIsSelected()
{
 var options = $$('input.Classname');
    for( i in options ) {
        if( options[i].checked == true ) {
            return true;
        }
    }
    return false;
}

if above function return true, it means your radio is selected

Rakesh Jesadiya · Accepted Answer · 2015-11-20 08:50:13Z

1

You have to set class name in radio box input field

class="validate-one-required-by-name".

check for above value.

answered Nov 20, 2015 at 8:50

Rakesh Jesadiya

42.4k19 gold badges132 silver badges184 bronze badges

Where i need to put in my code.please suggest me.
– Mouni
Commented Nov 20, 2015 at 8:52
As in the image i need to get the alert when i click on the submit button
– Mouni
Commented Nov 20, 2015 at 8:53
For radio button validation,<input type="radio" class="validate-one-required-by-name" name="radiobutton" value="" />
– Rakesh Jesadiya
Commented Nov 20, 2015 at 8:54
that's was the doubt for both buttons should i need to add
– Mouni
Commented Nov 20, 2015 at 8:55
you can check by adding in both button.if its not working then you can add that class into label tag class above li of radio.
– Rakesh Jesadiya
Commented Nov 20, 2015 at 8:58

| Show 3 more comments

Stack Exchange Network

How to validate my radio button fields using magento?

3 Answers 3

Your Answer

Not the answer you're looking for? Browse other questions tagged
magento-1.8
php
or ask your own question.

Hot Network Questions

How to validate my radio button fields using magento?

3 Answers 3

Your Answer

Sign up or log in

Post as a guest

Not the answer you're looking for? Browse other questions tagged magento-1.8php or ask your own question.

Related

Hot Network Questions

Not the answer you're looking for? Browse other questions tagged
magento-1.8
php
or ask your own question.