Why am I not getting data from the form?

Question

AJAX

The point is this. The form is not simple; it is added to me asynchronously after pressing the button. The idea is that I enter data, send it to the server and then write it all to the database.
But I don't get the form fields. I thought that the form is not visible because it is added by Ajax. I tried to somehow hook it from the body, but nothing came of it.
Here is the form itself:

<div class="box box-info" id="slide-form">
    <div class="box-header">
        <i class="fa fa-envelope"></i>

        <h3 class="box-title">Quick Email</h3>
        <!-- tools box -->
        <div class="pull-right box-tools">
            <button type="button" class="btn btn-info btn-sm close" title="Remove">
                <i class="fa fa-times"></i></button>
        </div>
        <!-- /. tools -->
    </div>
    <div class="box-body">
        <form action="/admin/main/add-slide" method="post" id="slider-submit-form">
            <div class="form-group">
                <input type="text" class="form-control" name="title" placeholder="Заголовок слайда">
            </div>
            <div class="form-group">
                <input type="text" class="form-control" name="subtitle" placeholder="Подзаголовок слайда">
            </div>
            <div class="form-group">
                <input type="text" class="form-control" name="price" placeholder="цена">
            </div>
            <div class="box-footer clearfix">
                <button type="submit" class="pull-right btn btn-default slider_form_submit">Send
                    <i class="fa fa-arrow-circle-right"></i></button>
            </div>
        </form>

    </div>
</div>

In js I scraped this (but it doesn't work =( ) :

$('body#slide-form').on('submit',function () {
   var data = $('form').serialize();
   console.log(data);
});

or like this:

$('form#slider-submit-form').on('submit',function () {
   var data = $('form').serialize();
   console.log(data);
});

also like this:

$('.slider_form_submit').on('click',function () {
   var data = $('form').serialize();

   console.log(data);
});

What am I doing wrong? Or I'm doing it all wrong. I have already run out of options =) How can I get data from this form?

Answer 1

need like this:

$('body').on('submit','#slide-form',function () {
   var data = $('form').serialize();
   console.log(data);
});