0

Intenté varios métodos para hacer mas "amigable" cuando se intenta buscar un dato y el resultado es nulo. Pensé que sería "fácil" usar Jquery, pero estoy bastante trabado. Uso VS2017, MVC y asp.net core 2.0. Sinceramente no se que es mejor, si usar Jquery o desde el controlador manejar las consultas con resultado nulo.

La búsqueda la realizo en un form que luego a los resultados los muestro en un table

Controlador:

public IActionResult Index(int? nroorden)
    {
        var query = from o in _context.Opj select o;
        query = _context.Opj.Where(s => s.NroOrden == nroorden);
        return View(query.ToList());
    }

View:

<form asp-action="Index" method="get" id="formulario">
<div class="container">
    <div class="form-group">
        <h4>Busqueda de Nro Orden</h4>
        <br />
        <div class="from-group">
            <p>
                <label class="col-md-2 control-label">Orden de Pago:</label>
                <input name="nroorden" class="form-control input-sm" />
            </p>
        </div>
        <p>
            <input type="submit" class="btn btn-info btn-sm" value="Buscar" id="boton" />
        </p>
    </div>
</div>

La tabla es la típica tabla que crea la plantilla de VS por eso no la muestro. Donde el id de la tabla es tabla y el id del tbody es datos

Lo único que pude conseguir que funciona a medias es:

$(document).ready(function () {
    $("#boton").click(function () {
        if ($("#tabla #datos").text().length) {
            alert("No hay datos para mostrar")

        }
    });
});

EDIT agrego la tabla donde muestro los resultados

<table class="table table-hover" id="tabla">
    <thead>
        <tr>
            <th>
                @Html.DisplayNameFor(model => model.NroOrden)
            </th>
            <th>
                @Html.DisplayNameFor(model => model.Presentacion)
            </th>
            <th>
                @Html.DisplayNameFor(model => model.Dni)
            </th>
            <th>
                @Html.DisplayNameFor(model => model.Caratula)
            </th>
            <th>
                Fecha Liquidacion
            </th>

            <th></th>
        </tr>
    </thead>
    <tbody id="datos">
        @foreach (var item in Model)
        {
            <tr>
                <td>
                    @Html.DisplayFor(modelItem => item.NroOrden)
                </td>
                <td>
                    @Html.DisplayFor(modelItem => item.Presentacion)
                </td>
                <td>
                    @Html.DisplayFor(modelItem => item.Dni)
                </td>
                <td>
                    @Html.DisplayFor(modelItem => item.Caratula)
                </td>
                <td>
                    @Html.DisplayFor(modelItem => item.FechaLiq)
                </td>
                <td>
                    <a asp-action="Details" asp-route-id="@item.NroOrden">Detalle</a>
                </td>
            </tr>
        }
    </tbody>
</table>

El problema es que por mas que encuentre un resultado aparece el mensaje.

Cualquier ayuda será bienvenida.

3
  • Por favor muesta el fragmento HTML donde muestras los datos. el 21 feb. 2018 a las 17:18
  • si lo que queres mostrar es que no hay datos, podrias validar antes de crear la tabla y en esa condicion ponerle un div con el texto ese! el 21 feb. 2018 a las 17:43
  • @WFgo y a esa validación la hago con Jquery? (tengo que aclarar que soy novato). Gracias
    – German W
    el 21 feb. 2018 a las 18:07

2 respuestas 2

0

las dos formas de solucionar este problema es validar directamente la lista del modelo, o sino con jQuery validar el tbody

La primera solución: quita el código jquery y en la vista razor

@if(Model.Count > 0)
{
<table class="table table-hover" id="tabla">
    <thead>
        <tr>
            <th>
                @Html.DisplayNameFor(model => model.NroOrden)
            </th>
            <th>
                @Html.DisplayNameFor(model => model.Presentacion)
            </th>
            <th>
                @Html.DisplayNameFor(model => model.Dni)
            </th>
            <th>
                @Html.DisplayNameFor(model => model.Caratula)
            </th>
            <th>
                Fecha Liquidacion
            </th>

            <th></th>
        </tr>
    </thead>
    <tbody id="datos">
        @foreach (var item in Model)
        {
            <tr>
                <td>
                    @Html.DisplayFor(modelItem => item.NroOrden)
                </td>
                <td>
                    @Html.DisplayFor(modelItem => item.Presentacion)
                </td>
                <td>
                    @Html.DisplayFor(modelItem => item.Dni)
                </td>
                <td>
                    @Html.DisplayFor(modelItem => item.Caratula)
                </td>
                <td>
                    @Html.DisplayFor(modelItem => item.FechaLiq)
                </td>
                <td>
                    <a asp-action="Details" asp-route-id="@item.NroOrden">Detalle</a>
                </td>
            </tr>
        }
    </tbody>
</table>
}
else
{
    <p>No hay datos para mostrar</p>
}

La segunda solución: quedaría todo como esta pero el código jQuery deberías quitar el evento click del botón y en el document ready validar si existe o no contenido en la tabla

$(document).ready(function(){
    if($('tbody').children().length === 0)
    {
        alert('No hay datos para mostrar');
    }
});

Cual es la diferencia?

Que en el primero desaparece la tabla y se muestra un elemento p donde muestra el mensaje sin alertas, En el segundo caso se muestra la alerta y la tabla con la cabecera.

1
  • Por fin!!!, la solución fue mucho mas simple de lo que estaba haciendo. Funciona perfecto. Te lo agradezco. No sabes lo que hice trabajar mi cerebro para que funcionara.
    – German W
    el 21 feb. 2018 a las 18:56
0

La forma más efectiva de hacerlo es controlarlo desde servidor en el razor.

La forma más limpia es con Linq.

@if(Model.Any())
{
 <table class="table table-hover" id="tabla">
<thead>
    <tr>
        <th>
            @Html.DisplayNameFor(model => model.NroOrden)
        </th>
        <th>
            @Html.DisplayNameFor(model => model.Presentacion)
        </th>
        <th>
            @Html.DisplayNameFor(model => model.Dni)
        </th>
        <th>
            @Html.DisplayNameFor(model => model.Caratula)
        </th>
        <th>
            Fecha Liquidacion
        </th>

        <th></th>
    </tr>
</thead>
<tbody id="datos">
    @foreach (var item in Model)
    {
        <tr>
            <td>
                @Html.DisplayFor(modelItem => item.NroOrden)
            </td>
            <td>
                @Html.DisplayFor(modelItem => item.Presentacion)
            </td>
            <td>
                @Html.DisplayFor(modelItem => item.Dni)
            </td>
            <td>
                @Html.DisplayFor(modelItem => item.Caratula)
            </td>
            <td>
                @Html.DisplayFor(modelItem => item.FechaLiq)
            </td>
            <td>
                <a asp-action="Details" asp-route-
    id="@item.NroOrden">Detalle</a>
            </td>
        </tr>
    }
 </tbody>
</table>
}
else
{
   <p>No hay datos para mostrar</p>
}

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.