Call document.ready from a partial view

0

I am working with ASP.NET MVC, JQuery I want to call a document.ready from an ajax that is in a partial view, I show code:

PARTIAL VIEW

<script type="text/javascript" language="javascript">
    $('form').submit(function (e) {
        e.preventDefault();
        //$('#message').empty();
        var $form = $(this);
        if ($form.valid()) {
            $.ajax({
                url: this.action,
                type: this.method,
                data: $(this).serialize(),
                cache: false,
                success: function (result) {
                    if (result.guardado) {
                        //Codigo para reinicializar el datatable



                    }
                },
                error: function (result) {
                }
            });
        }
    });
</script>

INDEX

$(document).ready(function () {
    $('#proveedores').DataTable({
        "processing": true,
        "serverSide": true,
        "ajax": {
            "url": "Cliente/Index",
            "dataType": "jsonp"
        }
    });
});

I want to call that document.ready from the if it is in the other partial view. How could I do it?

    
asked by Pedro Ávila 21.03.2017 в 04:42
source

1 answer

3

You can use $(document).ready as many times as you want. All are executed when the DOM is ready to be manipulated. In your case there is no problem with doing

<script type="text/javascript" language="javascript">
  $(document).ready(function () {

     $('form').submit(function (e) {
        ...
     });

  });
</script>

If your problem is that the partial view is inserted before #form or #proveedores is in the DOM, then you could edit the question (adding the structure of the html) to see if it is appropriate to use delegation of events to a top element of the DOM.

EDIT : the initialization of the datatable may perfectly be within the response of the Ajax request.

In the following example I assume that the DataTable instance is initialized and you want to redeclare it, destroying the current instance (for example, because new columns are coming, you know)

<script type="text/javascript" language="javascript">
  $(document).ready(function () {

     $('form').submit(function (e) {
        ...
        $.ajax({
            ....
            success: function (result) {
                if (result.guardado) {

                    // obtengo el DataTable actual y lo destruyo
                    var current_table = $('#proveedores').DataTable();
                    current_table.destroy();

                    $('#proveedores').DataTable({
                        "processing": true,
                        "serverSide": true,
                        "ajax": {
                            "url": "Cliente/Index",
                            "dataType": "jsonp"
                        }
                    });
                }
            }
            ...
        });
        ...
     });

  });
</script>

Finally: one does not call a $(document).ready from another $(document).ready . They are listeners for an event, not functions that you can invoke.

    
answered by 21.03.2017 в 12:25