0

Hi guys hope anyone could help me with this., Currently I'm doing some studies on javasipting and this thing just gave me a load of headache. below is my code: The html

<div class="row">
<div class="col-sm-10 col-sm-offset-1">
    <h6 class="info-text text-danger"> {{ $errors->first('register_scanning') }} </h6>
    <div class="col-sm-3">
        <div class="choice" data-toggle="radio_scanning" id="radio_scanning_0">
            {{ Form::radio('register_scanning', '0800-1200') }}
            <div class="icon">
                <i class="fa fa-pencil"></i>
            </div>
            <h7>Live Scanning 0800-1200</h7>
        </div>
    </div>
    <div class="col-sm-3">
        <div class="choice" data-toggle="radio_scanning" id="radio_scanning_1">
            {{ Form::radio('register_scanning', '1300-1700') }}
            <div class="icon">
                <i class="fa fa-terminal"></i>
            </div>
            <h7>Live Scanning 1300-1700</h7>
        </div>

    </div>
</div>

ok so this on here is the html with of course some laravel blade code thingy. here is the javascript:

$('[data-toggle="radio_scanning"]').click(function(event){
    wizard = $(this).closest('.wizard-card');
    wizard.find('[data-toggle="radio_scanning"]').removeClass('active');
    $(this).addClass('active');
    $(wizard).find('[name="register_scanning"]').removeAttr('checked');
    $(this).find('[name="register_scanning"]').attr('checked','true');
});

$('[data-toggle="radio_cadaver"]').click(function(event){
    wizard = $(this).closest('.wizard-card');
    wizard.find('[data-toggle="radio_cadaver"]').removeClass('active');
    $(this).addClass('active');
    $(wizard).find('[name="register_cadaver"]').removeAttr('checked');
    $(this).find('[name="register_cadaver"]').attr('checked','true');
});

$('#radio_scanning_0').click(function () {
    $("#radio_cadaver_0").hide('fast');
    $("#radio_cadaver_1").hide('fast');

    $("#radio_cadaver_2").show('fast');
    $("#radio_cadaver_3").show('fast');
});
$('#radio_scanning_1').click(function () {
    $("#radio_cadaver_0").show('fast');
    $("#radio_cadaver_1").show('fast');

    $("#radio_cadaver_2").hide('fast');
    $("#radio_cadaver_3").hide('fast');
 });

This one was placed inside a document.ready now for the explanation: The script is to select the radio button and give it a value of check because I've created my radio buttons to look like this radio button

So i was able to click on the radio button and highlight them but when I submit the form it will return an error saying that I need to select an option fron the radio buttons., meaning that the radio buttons are not checked., this only happens when I'm on firefox. the things is that it is working well in chrome and opera just firefox and IE. did i do it in a wrong way? javascript I mean., Am i doing it wrong or did I miss something?

Thank you for the time and effort of those of you who will take notice of my question.

cha1988
  • 29
  • 8

3 Answers3

0

Duplicate of: How to check a radio button with jQuery ?

Community
  • 1
  • 1
Philip
  • 2,888
  • 2
  • 24
  • 36
  • Thank you sir but still same result. still not getting the value for those radio buttons. – cha1988 Mar 01 '15 at 15:32
  • Thank you everyone for you help., and it is so dumb of me for not finding that question. Thank you so much sir Philip – cha1988 Mar 01 '15 at 15:41
0

Adding autocomplete="off" to the form tag should fix the issue. Or so i have heard. I have never tried though.

Dominofoe
  • 603
  • 7
  • 18
-1

Just change a simple value on the following line:

 $(this).find('[name="register_scanning"]').**prop**('checked','true');  *// Good!*

Instead of:

 $(this).find('[name="register_scanning"]').**attr**('checked','true');  *//Wrong*

And that's all!

I Hope it will be useful.

maxshuty
  • 9,708
  • 13
  • 64
  • 77
Valero
  • 1