Jquery selector for a single cell of a "table" made with bootstrap

Question

Jquery selector for a single cell of a "table" made with bootstrap

Navigation

#1 by (2 votes)
#2 by (1 votes)

1

Simple question, but I can not find a way to do it. I need to replace a value within one of the "cells" of each row in this table. Here is the code (long, simple):

                        <div class="col s12">
                            <div class="analists">
                                    <div class="analists-header">
                                            <div class="line">
                                                <div class="col s3">
                                                    Login
                                                </div>
                                                <div class="col s5">
                                                    Nome
                                                </div>
                                                <div class="col s2">
                                                    Chat em Andamento
                                                </div>
                                                <div class="col s2">
                                                    Max Chats
                                                </div>
                                            </div>
                                    </div>

                                <div class="analists-content">
                                            <div id="listAgent">
                                                <div class="line">
                                                    <div class="col s3">
                                                        601305
                                                    </div>
                                                    <div class="col s5">
                                                        601305
                                                    </div>
                                                    <div class="col s2">
                                                        4
                                                    </div>
                                                    <div class="col s2">
                                                        4
                                                    </div>
                                                </div>
                                            </div>  
                                            <div id="listAgent">
                                                <div class="line">
                                                    <div class="col s3">
                                                        601150
                                                    </div>
                                                    <div class="col s5">
                                                        601150
                                                    </div>
                                                    <div class="col s2">
                                                        2
                                                    </div>
                                                    <div class="col s2">
                                                        4
                                                    </div>
                                                </div>
                                            </div>  
                                            <div id="listAgent">
                                                <div class="line">
                                                    <div class="col s3">
                                                        601160
                                                    </div>
                                                    <div class="col s5">
                                                        601160
                                                    </div>
                                                    <div class="col s2">
                                                        1
                                                    </div>
                                                    <div class="col s2">
                                                        4
                                                    </div>
                                                </div>
                                            </div>  
                                            <div id="listAgent">
                                                <div class="line">
                                                    <div class="col s3">
                                                        601560
                                                    </div>
                                                    <div class="col s5">
                                                        601560
                                                    </div>
                                                    <div class="col s2">
                                                        2
                                                    </div>
                                                    <div class="col s2">
                                                        4
                                                    </div>
                                                </div>
                                            </div>  
                                            <div id="listAgent">
                                                <div class="line">
                                                    <div class="col s3">
                                                        601226
                                                    </div>
                                                    <div class="col s5">
                                                        601226
                                                    </div>
                                                    <div class="col s2">
                                                        3
                                                    </div>
                                                    <div class="col s2">
                                                        4
                                                    </div>
                                                </div>
                                            </div>  
                                            <div id="listAgent">
                                                <div class="line">
                                                    <div class="col s3">
                                                        601457
                                                    </div>
                                                    <div class="col s5">
                                                        601457
                                                    </div>
                                                    <div class="col s2">
                                                        3
                                                    </div>
                                                    <div class="col s2">
                                                        4
                                                    </div>
                                                </div>
                                            </div>  
                                </div>
                            </div>
                        </div>

Well then. I tried for a long time, and the closest I could get was this:

$('.s3').text($('.s3').text().includes('601305') ? 'teste' : '');

To see if you could replace the value of 601305 in the table in the first column with the word 'test', but doing so I end up replacing this in the entire column, all cells are the same. I need to put a different word for each code in each cell, so I need to refer only to that table cell, not the whole column. The problem is that the class of all rows / columns is the same, I can not refer to one alone.

How do I proceed?

javascript twitter-bootstrap

asked by anonymous 14.08.2018 / 22:55

2 answers

1

Supplemented the previous answer for two reasons

Ensure all column widths

What the grid is for class analysts

That the code is exactly equal to

$('.analists .s1,.analists .s2, .analists .s3, .analists .s4, .analists .s5, .analists .s6, .analists .s7, .analists .s8, .analists .s9, .analists .s10, .analists .s11, .analists .s12 ').each(function (index, div) {						
	if (div.innerText.trim() == "601305") {
		div.innerText="teste"
	}
})

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script><divclass="col s12">
		<div class="analists">
			<div class="analists-header">
				<div class="line">
					<div class="col s3">
						Login
					</div>
					<div class="col s5">
						Nome
					</div>
					<div class="col s2">
						Chat em Andamento
					</div>
					<div class="col s2">
						Max Chats
					</div>
				</div>
			</div>

			<div class="analists-content">
				<div id="listAgent">
					<div class="line">
						<div class="col s3">
							601305
						</div>
						<div class="col s5">
							601305
						</div>
						<div class="col s2">
							4
						</div>
						<div class="col s2">
							4
						</div>
					</div>
				</div>
				<div id="listAgent">
					<div class="line">
						<div class="col s3">
							601150
						</div>
						<div class="col s5">
							601150
						</div>
						<div class="col s2">
							2
						</div>
						<div class="col s2">
							4
						</div>
					</div>
				</div>
				<div id="listAgent">
					<div class="line">
						<div class="col s3">
							601160
						</div>
						<div class="col s5">
							601160
						</div>
						<div class="col s2">
							1
						</div>
						<div class="col s2">
							4
						</div>
					</div>
				</div>
				<div id="listAgent">
					<div class="line">
						<div class="col s3">
							601560
						</div>
						<div class="col s5">
							601560
						</div>
						<div class="col s2">
							2
						</div>
						<div class="col s2">
							4
						</div>
					</div>
				</div>
				<div id="listAgent">
					<div class="line">
						<div class="col s3">
							601226
						</div>
						<div class="col s5">
							601226
						</div>
						<div class="col s2">
							3
						</div>
						<div class="col s2">
							4
						</div>
					</div>
				</div>
				<div id="listAgent">
					<div class="line">
						<div class="col s3">
							601457
						</div>
						<div class="col s5">
							601457
						</div>
						<div class="col s2">
							3
						</div>
						<div class="col s2">
							4
						</div>
					</div>
				</div>
			</div>
		</div>
	</div>

14.08.2018 / 23:59

Find first value greater than a certain number in Excel Why this code gives segmentation fault?

score 2 · Accepted Answer

2

$(".s3:contains('601457')").html("TESTE");

14.08.2018 / 23:24