Magento 2: How to validate the radio box and show required message? [duplicate]

Question

I want to make the required radio box on submitting form. Validation works but it not showing the error message as "This is required field"

<div class="control">
    <input type="radio" class="required-entry" name="delivery" value="door"> Door Delivery<br>
    <input type="radio" class="required-entry" name="delivery" value="pick"> Pick Up
</div>

Edit:

Answer defined here gives the error message but it is showing error message below first radio button. I want the error to be display below the All radio boxes.

New Code:

<div class="field profile">
            <label class="label"><?php echo 'Delivery Option' ?>:</label>
                 <div class="options-list">
                    <div class="field choice">
                        <input type="radio" class="radio" id="delivery-3-5" data-validate="{'validate-one-required-by-name':true}" name="delivery" value="door" <?php if($partner['delivery']=='door') echo "checked='checked'"; ?>>
                        <label class="label" for="delivery-3-5">
                            Door Delivery
                        </label>
                    </div><div class="field choice">
                        <input type="radio" class="radio" id="delivery-3-6" data-validate="{'validate-one-required-by-name':true}" name="delivery" value="pick" <?php if($partner['delivery']=='pick') echo "checked='checked'"; ?>>
                        <label class="label" for="delivery-3-6">
                            Pick Up
                        </label>
                    </div>
          </div>
            </div>

Answer 1

Replace your html with below one,

<div class="control">
    <input type="radio" class="radio required-entry" name="delivery" data-validate="{'validate-one-required-by-name':true}" value="door"> Door Delivery<br>
    <input type="radio" class="radio required-entry" name="delivery" data-validate="{'validate-one-required-by-name':true}" value="pick"> Pick Up
</div>

Use data-validate="{'validate-one-required-by-name':true}" in your input tag.

Second Method

For show error below all radio button::

<div class="fabric-form">
    <form action="<?php echo $this->getUrl(''); ?>" method="post" class="radio-form" name="radio-form" id="radio-form" enctype="multipart/form-data" data-mage-init='{"validation":{}}'>

    <div class="field profile">
            <label class="label"><?php echo 'Delivery Option' ?>:</label>
            <div class="options-list">
                    <div class="field choice">
                        <input type="radio" class="radio" id="delivery-3-5" data-validate="{'validate-one-required-by-name':true}" name="delivery" value="door">
                        <label class="label" for="delivery-3-5">
                            Door Delivery
                        </label>
                    </div><div class="field choice">
                        <input type="radio" class="radio" id="delivery-3-6" data-validate="{'validate-one-required-by-name':true}" name="delivery" value="pick">
                        <label class="label" for="delivery-3-6">
                            Pick Up
                        </label>
                    </div>
          </div>
    </div>
    </form>
</div>

<script>
    require(["jquery","mage/mage"], function($) 
    {
        //error placement for radio button 
        var dataForm = $('#radio-form');
        dataForm.mage('validation', {
            errorPlacement: function(error, element) {
                if (element.hasClass('radio')) {
                    error.appendTo('.field.choice');
                }
            }
        });     

    });
</script>