title: Accessing MVC's model property from Javascript to fill jQuery datatable insted of using json
body: <p>I am trying to build an ASP.NET MVC application I want to return a model instead of json but I need help to use to model to fill my datatable. </p>
  
  <p>Here is my Javascript:</p>
  
  <pre><code>   @section Scripts{
          &lt;script type="text/javascript" charset="utf8" src="~/Scripts/DataTables/jquery.dataTables.js"&gt;&lt;/script&gt;
          &lt;script&gt;
              $(document).ready(function () {
                  $('#proveedorContactoTable').DataTable({
                      "ajax": {
                          "url": "/fichaProveedor/loadProveedorContactoTable",
                          "type": "GET",
                          "datatype": "json"
                      },
                      "columns": [
                          { "data": "nombre_contacto", "autoWidth": true }, /* index = 0 */
                          { "data": "apellido_contacto", "autoWidth": true }, /* index = 1 */
                          { "data": "carga_contacto", "autoWidth": true }, /* index = 2 */
                          { "data": "telefono_fijo_contacto", "autoWidth": true }, /* index = 3 */
                          { "data": "telefono_movil_contacto", "autoWidth": true }, /* index = 4 */
                          { "data": "correo_contacto", "autoWidth": true }, /* index = 5 */
                          { "data": "principal", "autoWidth": true }, /* index = 6 */
                          {
                              "data": "contacto_id", "width": "50px", "render": function (data) {
                                  return '&lt;a class="popup" href="/fichaProveedor/Detalles/' + data + '"&gt;Editar&lt;/a&gt;';  /* index = 7 */
                              }
                          },
                          {
                              "data": "contacto_id", "width": "50px", "render": function (data) {
  
                                  return '&lt;a class="btn btn-primary" href="/fichaProveedor/Eliminar/' + data + '"&gt;Eliminar&lt;/a&gt;'; /* index = 8 */
                              }
                          }
                      ],
                      'columnDefs': [{
                          'targets': [7, 8], /* column index */
                          'orderable': false, /* true or false */
                      }]
                  });
              });
  
          &lt;/script&gt;
      }
  </code></pre>
  
  <p>And here is my html table</p>
  
  <pre><code>&lt;div class="dvScroll"&gt;
      &lt;table id="myTable"&gt;
          &lt;thead&gt;
              &lt;tr&gt;
                  &lt;th&gt;Proveedor Id&lt;/th&gt;
                  &lt;th&gt;Nombre&lt;/th&gt;
                  &lt;th&gt;Dirección&lt;/th&gt;
                  &lt;th&gt;Código postal&lt;/th&gt;
                  &lt;th&gt;Cuidad&lt;/th&gt;
                  &lt;th&gt;País&lt;/th&gt;
                  &lt;th&gt;Pagina internet&lt;/th&gt;
                  &lt;th&gt;Edit&lt;/th&gt;
                  &lt;th&gt;Delete&lt;/th&gt;
              &lt;/tr&gt;
          &lt;/thead&gt;
      &lt;/table&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>I have the following model that contains a list of "contactos" I want to use all its elements to fill the jQuery table. Here is my model and some of the properties contained in the model.</p>
  
  <pre><code>@model erp_colombia.Models.proveedorModel
  @foreach (var contacto in Model.contactos)
  {
          @contacto.contacto_id
          @contacto.apellido_contacto
  }
  </code></pre>
  
  <p>Here is my controller so far</p>
  
  <pre><code>[HttpPost]
  public ActionResult Editar(inventarioModel gestiondeubicacione)
  {
      inventarioContext gestiondeubicaciones = new inventarioContext();
      bool status = false;
      if (ModelState.IsValid)
      {
          if (gestiondeubicacione.componente_id &gt; 0)
          {
              //Edit 
              var gestiondeubicacionesFound = gestiondeubicaciones.GetAllInventarios().Where(a =&gt; a.componente_id == gestiondeubicacione.ubicacion_id).FirstOrDefault();
              if (gestiondeubicacionesFound != null)
              {
                  gestiondeubicacionesFound.armario = gestiondeubicacione.armario;
                  gestiondeubicacionesFound.cajon = gestiondeubicacione.cajon;
              }
          }
          else
          {
              //gestiondeubicaciones.addInvenotryLocationToDB(gestiondeubicacione);
              TempData["msgType"] = messageType.success;
              TempData["msg"] = "Nueva ubicación agregada!";
              //Save new one
              //dc.Employees.Add(emp);
          }
          //gestiondeubicaciones.updateInvenotryLocationToDB(gestiondeubicacione);
          TempData["msgType"] = messageType.success;
          TempData["msg"] = "La ubicación ha sido actualizada!";
          //Update
          //dc.SaveChanges();
          status = true;
      }
      return new JsonResult { Data = new { status = status } };
  }
  </code></pre>
  
  <p>How can I use my model inside the Javascript instead of the json? Thank you very much for your help.</p>