0

el problema es que tengo una tabla dinamica html, y quiero poner en negrita el texto de una celda en especifico al momento de dar click en la fila. intente usando jQuery, pero aun me es un poco complicado

¿Alguien sabe como se podría hacer eso?, disculpen si es algo sencillo, pero la verdad es que soy nuevo en esto de la programación web.

Este es mi jQuery En este jQuery lo que hago es que al momento de dar clic al icono que se encuentra en la fila se expanda otra fila, (aquí es donde quiero agregar para cmbiar a negritas el texto de una celda)

$(document).ready(function () {
        $('.icon').click('click', function () {

            var $pRow = $(this).parents('tr');
            var $nextRow = $pRow.next('tr');
            $nextRow.toggle();

            $(this).toggleClass('icon-s icon-e');

        });
    })

Este es el cuerpo de la tabla

 <tbody>
                    <tr>
                        <td>
                            @if (Sub.Count > 0)
                            {
                                <span class="icon icon-e" style="float:left; cursor:pointer;" id="iconv" onclick="b()"></span>
                            }
                            else
                            {
                                <span style="display:inline-block;width:14px">&nbsp;</span>
                            }
                            @i.Nombre
                        </td>
                        <td>@i.CuentaPT</td>
                        <td>@i.Importe </td>  
                        <td>@i.importe2</td>

                    </tr>
                    <tr style="display:none;">
                        @if (Sub.Count > 0)
                        {
                            <td colspan="4" class="innerTable">
                                @NestedData.GetHtml(NuevoModelo, i.CuentaPT,1,ano,ano2)
                            </td>
                        }
                        else
                        {
                            <td colspan="4" ></td>
                        }
                    </tr>
                </tbody>

Me gustaria poner en negritas los valores de Importe

4
  • Pon el pantallazo de lo que hay para poder ayudarte
    – user104641
    Commented el 24 oct. 2018 a las 18:15
  • no es ajax lo que estas usando, es jQuery y con respecto a qué quieres poner en negritas no me queda claro, tienes que dejar claro la selección por ejemplo "al hacer clic en una fila, se deben poner en negrita todas las celdas de la fila anterior"
    – LPZadkiel
    Commented el 24 oct. 2018 a las 18:33
  • Gracias por querer ayudarme y corregirme, disculpa por no saber expresarme correctamente, si, lo que pasa es que quiero que al hacer click en la fila, se pinte el texto en negritas (El de la misma fila, pero solo en la celda donde se muestra el importe)
    – AJB
    Commented el 24 oct. 2018 a las 18:42
  • si no entendí mal, lo que necesitas usar es .prev()
    – Fran Islas
    Commented el 24 oct. 2018 a las 18:50

1 respuesta 1

1

En primer lugar, tenés confundido el concepto de con y . AJAX consiste en llamadas asíncronas al backend usando un lenguaje de scripting en el frontend (como JavaScript). En este caso, no estás usando AJAX, sino que es una función de JavaScript. Te dejo un resumen sobre AJAX que contesté en otra pregunta.

Podés hacer lo que necesitás agregando un atributo a la fila (o al ícono) que recibe el evento click para que llame directamente a la fila que necesitás llamar. Te dejo un ejemplo del código.

$(document).ready(function(){
  $('.icon, button').click(function(){
    let target = $(this).data('target');
    $('.' + target).toggleClass('negritas');
  });
});
.icon {
  color: blue;
}

.negritas {
  font-weight: bolder;
}

table td {
   padding: 5px;
   border: solid 1px #ccc;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<table>
  <tr>
    <td class="icon" data-target="target1">Cambiar target1</td><td class="icon" data-target="target2">Cambiar target2</td><td>No hace nada</td>
  </tr>
  <tr class="target1">
    <td>Valor 1</td><td>Valor 2</td><td>Valor 3</td>
  </tr>
  <tr class="target2">
    <td>Valor 1</td><td>Valor 2</td><td>Valor 3</td>
  </tr>
  <tr class="target3">
    <td>Valor 1</td><td>Valor 2</td><td>Valor 3</td>
  </tr>
</table>
<button type="button" data-target="target3">Cambiar target3</button>

3
  • Muchas gracias, me ha servido bastante para la tabla que estaba usando. ahora tengo otra tabla que igual es dinamica, pero esta tiene una fila y al darle clic despliega otra fila y así sucesivamente. ahora quiero poner toda la fila en negritas donde se dio click, ¿podrias ayudarme en eso?
    – AJB
    Commented el 25 oct. 2018 a las 16:57
  • Usando selectores-css podés apuntar a cualquier elemento en la página (por ejemplo, el llamado al selector de clase .target1). Lo mismo para el caso de los elementos parent() de jquery (parentNode en javascript puro) para llamar a los nodos que contienen al elemento que captura el evento. Dado que en este caso es el elemento <td/> quien captura el evento, agregar la línea $(this).parent().addClass('negritas'); agregará la clase al <tr/> que contiene el <td/>.
    – Niche
    Commented el 25 oct. 2018 a las 17:10
  • Muchas gracias por tomar tu tiempo para ayudarme, has resuelto mi problema, saludos:)
    – AJB
    Commented el 25 oct. 2018 a las 17:41

Tu Respuesta

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

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