magento2 – Magento 2 – Passing variable to controller is not working

I want to pass a selected value to a controller. After researching, it seems that I can use Ajax call to pass the value.

I don’t know why this is not working, but it seems the url that I use to call doesn’t exist.

Below is my code:
Learning/ShiptoModal/Block/Index.php

<?php
namespace LearningShiptoModalBlock;
class Index extends MagentoFrameworkViewElementTemplate
{

}

Learning/ShiptoModal/Controller/shipto/shipto.php

<?php

namespace LearningShiptoModalControllershipto;

use MagentoFrameworkAppActionContext;

class shipto extends MagentoFrameworkAppActionAction
{

    /**
     * @param Context     $context
     * @param PageFactory $resultPageFactory
     */
    public function __construct(
        Context $context
        )
    {
        return parent::__construct($context);
    }


    public function execute()
    {
        $selected_state = $this->getRequest()->getParam('state');

        return $selected_state;
    } 
}

Learning/ShiptoModal/etc/module.xml

<?xml version="1.0"?>
<config xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:framework:Module/etc/module.xsd">
    <module name="Learning_ShiptoModal">
        <sequence>
            <module name="Magento_Theme"/>
        </sequence>
    </module>
</config>

Learning/ShiptoModal/etc/frontend/routes.xml

<?xml version="1.0" encoding="UTF-8"?>
<config xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:framework:App/etc/routes.xsd">
    <router id="standard">
        <route id="shiptomodal" frontName="shiptomodal">
            <module name="Learning_ShiptoModal"/>
        </route>
    </router>
</config>

Learning/ShiptoModal/view/frontend/layout/default.xml

<?xml version="1.0"?>
-->
<page xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:framework:View/Layout/etc/page_configuration.xsd">
    <body>
        <referenceContainer name="footer-container">
            <block class="MagentoFrameworkViewElementTemplate" name="shipto-modal" template="Learning_ShiptoModal::shipto-prompt.phtml">
                <arguments>
                    <argument name="default_states_view_model" xsi:type="object">LearningShiptoModalViewModelDefaultStatesViewModel</argument>
                </arguments>
            </block>
        </referenceContainer>
    </body>
</page>

Learning/ShiptoModal/view/frontend/layout/ShiptoModal_shipto_shipto.xml

<?xml version="1.0"?>
<page xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" layout="1column" xsi:noNamespaceSchemaLocation="urn:magento:framework:View/Layout/etc/page_configuration.xsd">
    <referenceContainer name="content">
        <block class="LearningShiptoModalBlockIndex" name="ShiptoModal_shipto_shipto" template="Learning_ShiptoModal::success.phtml" />
    </referenceContainer>
</page>

Learning/ShiptoModal/view/frontend/templates/shipto-prompt.phtml

<?php
$viewModel = $block->getDefaultStatesViewModel();
$ajaxurl = $block->getBaseUrl();
?>

<div id="learning-shipto-modal">
    Please enter your ship to location:
    <span><?= $viewModel->getStates() ?></span>
</div>

<script>
require((
    'jquery',
    'Magento_Ui/js/modal/modal',
    'jquery/jquery.cookie',
    'domReady!'
),
function($, modal) {
    //Use cookie to display modal just once 
    //Display modal if no cookie is present
    const DEFAULT_DAYS_TO_EXPIRE = 180;
    let checkBannerCookie = $.cookie('cookie-shipto');

    var options = {
        type: 'popup',
        responsive: true,
        innerScroll: true,
        modalClass: 'm-shipto-modal',
        buttons: ({
            text: $.mage.__('Continue'),
            class: 'a-btn a-btn--primary',
            click: function () {
                let date = new Date();
                // use days param if set in init, otherwise use default days (180)
                let numberOfDays = DEFAULT_DAYS_TO_EXPIRE;
                date.setTime(date.getTime() + (numberOfDays*60*60*24*1000));
                let expires = "; expires=" + date.toUTCString();
                document.cookie = 'cookie-shipto' + "=" + true  + expires + "; path=/";

                let selected_state = $("#state :selected").text();

                var url = "<?php echo $ajaxurl.'ShiptoModal/shipto/shipto/' ?>";
                
                $.ajax({
                    url: url,
                    type: "POST",
                    dataType: 'json',
                    data: {state:selected_state},
                    success: function(response){
                        console.log(response);
                    }
                });

                //close the modal
                this.closeModal();

                return false;
            }
        })
    };

    var popup = modal(options, $('#learning-shipto-modal'));

    $(document).ready(function() {
        if (!checkBannerCookie) {
            $(this).find('(value="58")').remove();
            setTimeout(function() {
                $('#learning-shipto-modal').modal('openModal');
            }, 2000);
        }
    });
});
</script>

On the browser console, I got VM21134:1 POST https://local.magento-shop.com/ShiptoModal/shipto/shipto/ 404 (Not Found)

I am still new to Magento, so any help will be appreciated. Thank you!