How to change url on ajax form submission?

Question

JavaScript

Code for submitting the form to add an order

$js = <<<JS
    $('form').on('beforeSubmit', function(){
        var data = $(this).serialize();
        $.ajax({
            url: '/order/default/add-order',
            type: 'POST',
            data: data,
            success: function(response){
                $('#basket').html(response);
            },
            error: function(){
                alert('Error!');
            }
        });
        return false;
    });
JS;
$this->registerJs($js);

sent by this button press

<?= Html::a('<i class="glyphicon glyphicon-shopping-cart"></i>', ['/order/default/add-order'], [
                            'class' => 'btn btn-default pull-right',
                            'data-toggle' => 'tooltip',
                            'data-placement' => 'bottom',
                            'title' => 'Добавить заказ в корзину',
                            'data' => [
                                'confirm' => 'Вы уверены?',
                                'data-method' => 'post',
                            ],
                        ]) ?>

I also need to delete orders and I created a delete button

<?= Html::a('<i class="glyphicon glyphicon-trash text-danger"></i>', ['/order/default/delete-order', 'id' => $order->id], [
                    'data-toggle' => 'tooltip',
                    'data-placement' => 'bottom',
                    'title' => 'Удалить заказ из корзины',
                    'data' => [
                        'confirm' => 'Вы уверены?',
                        'data-method' => 'get',
                    ],
                ]) ?>

But when you click the order is still added, the request goes to
url: '/order/default/add-order',

How can I change it when deleting to
/order/default/delete-order ?

Answer 1

Good afternoon.

<?= Html::a('<i class="glyphicon glyphicon-trash text-danger"></i>', ['/order/default/delete-order', 'id' => $order->id], [
                    'data-toggle' => 'tooltip',
                    'data-placement' => 'bottom',
                    'title' => 'Удалить заказ из корзины',
                    'data' => [
                        'confirm' => 'Вы уверены?',
                        'data-method' => 'get',
                        'delete-url' => Url::to('/order/default/delete-order');
                    ],
                ]) ?>

When sending ajax, read the value "data-delete-url" and add it to the request parameters.

$('form').on('beforeSubmit', function(){
        var data = $(this).serialize();
       
        var url = $(selector).attr('data-delete-url');        

        $.ajax({
            url: url,
            type: 'POST',
            data: data,
            success: function(response){
                $('#basket').html(response);
            },
            error: function(){
                alert('Error!');
            }
        });
        return false;
    });

There will be errors - correct according to your requirements.
Showed the idea.