CODEWITHSUNDEEP
jqueryradio-button
changk
changk

Reputation: 3

Execute different event depending on radio button checked in jquery

I made a radio button in the form.
When I press the submit button, I want to run the script when button1 is selected,
and I want to send to another page (for example, the previous page) without running the script when button2 is selected.

Can script not be executed depending on radio button selection?

html

<form class="submit-form" action="" method="post" >
    // other input tag

    <p><strong>Radio Button</strong></p>
    <div class="custom-control custom-radio">
        <input type="radio" name="option" id="option-1" class="custom-control-input" value="T" checked>
        <label class="custom-control-label" for="option-1">Radio Button 1</label>
    </div>
    <div class="custom-control custom-radio">
        <input type="radio" name="option" id="option-2" class="custom-control-input" value="F">
        <label class="custom-control-label" for="option-2">Radio Button 2</label>
    </div>

    <button type="submit">Submit</button>
</form>

script

<script>
    $(function () {
    var TEMP = window.TEMP;
    TEMP.init('test');
        $('.submit-form').on('submit', function (e) {
            // my logic
        });
    });
</script>

Upvotes: 0

Views: 54

Answers (1)

Ortund
Ortund

Reputation: 8245

Seems like a simple if statement would do it for you:

<script>
    $(function () {
    var TEMP = window.TEMP;
    TEMP.init('test');
        $('.submit-form').on('submit', function (e) {
            // Evaluate whether or not the radio button is checked and do the things
            let radio1 = $("#option-1");
            if (radio1.is(":checked"))
            {
                // Execute the method you want.
                doFoo();
            }
            else
            {
                // Redirect
                location.href = "new/url/goes/here";
            }
        });
    });
</script>

Upvotes: 1

Related Questions