1

Estoy necesitando crear una tabla dinámica de usuarios, donde en una de las columnas tenga un editar y un eliminar, donde en cada celda exista un botón o un ancla que me lleve a un componente que reciba por parámetro un IdUsuario o un Usuario (objeto).

Para esto, en las celdas de las columnas mencionadas, primero intenté con anclas donde en la atributo href al colocar href="newuser/@u.id"; "newuser" es un nuevo componente al cual le intento concatenar el id del usuario que quiero modificar pero retorna un error que indica que no se pueden enviar datos complejos.

Si en lugar del ancla directamente uso el componente newuser y en dicho componente agrego una variable con la anotación [Parameter], al querer ingresar a la interfaz donde está la tabla me salta el error Unhandled error y no me carga el listado. Sin embargo como dato curioso al intentar debugear lo que noto es que al ir cargando la tabla con los datos correspondientes del usuario, al llegar a la celda que contiene al componente newuser, ingresa a newuser con el id correspondiente.

Lo que yo necesito es que se acceda a newuser desde la tabla con el id con un botón o ancla, que se genere por cada fila de la tabla, o alguna mecanica que me habilite a poder ingresar al formulario de newuser con un idusuario o un usuario, que sea seleccionado de una tabla dinámica.

Clase padre

<table class="tabletable-striped mt-3 text-center sombrear w-100">
    <tr class="bg-dark text-light">
        <th>
            Usuario
        </th>
        <th>
            Email
        </th>
        <th>
            Última vez visto
        </th>
        <th>
            Eliminar
        </th>
        <th>
            Modificar
        </th>
    </tr>
    @foreach (var u in usuarios)
    {
    <tr>
        <td>
            @u.IdUsuario
        </td>
        <td>
            @u.Email
        </td>
        <td>
            @u.UltimoAcceso
        </td>
        <td>
            eliminar (en desarrollo)
        </td>
        <td>
            <NewUser IdUsuario="@u.IdUsuario" />
            <span class="oi oi-paperclip" aria-hidden="true"></span> Modificar
        </td>
    </tr>
}

</table>

@code {
    private List<Usuarios> usuarios;
    protected override void OnInitialized()
    {
        try
        {
            usuarios = ia.GetUsuarios();
        }
        catch (Exception)
        {
            throw;
        }
    }

}

Por fines prácticos copio el código de la Clase hija que importa, si necesitan todo el formulario se los paso.

@code {
    [Parameter]
    public string IdUsuario { get; set; } = "";

    protected override void OnInitialized()
    {
        if (!String.IsNullOrEmpty(IdUsuario))
        {
            isAlta = false;
            CargarCampos();
        }
        else
        {
            isAlta = true;
            Usuario = new UsuarioDto();
        }
    }

}

1 respuesta 1

1

Si bien entendía que estaba mal ingresar el componente en una celda si lo que necesitaba era solo un botón no el formulario entero; Me di cuenta que el problema fue que estaba intentando ingresar el componente NavLink en lugar del ancla html.

<td>
    <a href="newuser/@u.id" ></a>.
</td>

Quizá exista alguna manera con el componente NavLink que desconozco, a fines prácticos decidí usar el ancla html.

Por otro lado en la clase hija agregué otra ruta

@page "/newuser"
@page "/newuser/{id}"

@* todo el formulario *@

@code {
    [Parameter]
    public string id { get; set; } = "";

    protected override void OnInitialized()
    {
        Usuario = new UsuarioDto();
        if (!String.IsNullOrEmpty(id))
        {
            isAlta = false;
            CargarCampos();
        }
        else
        {
            isAlta = true;
        }
    }
}

Con esto ya daría por solucionado el tema, y si existe alguna forma más elegante de resolverlo y la quieren comentar bienvenida sea.

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.