Javascript-форум (https://javascript.ru/forum/)
-   jQuery (https://javascript.ru/forum/jquery/)
-   -   Цикл в цикле (https://javascript.ru/forum/jquery/63640-cikl-v-cikle.html)

strsin 19.06.2016 23:09

Цикл в цикле
 
Здравствуйте коллеги.

С Javascript не работал, но вот понадобилось допилить страничку для вывода статистики.
Есть таблица, имя - цифра. Данные заполняются из БД. Поэтому количество строк и их порядок могут быть разными.

Первая задача - окрашивать цифру при увеличении определённого порога - это я сделал.
Вторая, то что у меня не получается - для разных фамилий этот порог разный, нужно сначала определять имя, смотреть какой у него порог и тогда окрашивать или нет цифру.

Таблица:

<tr>
	<asp:Repeater id="Infra_full" runat="server">
	<ItemTemplate>
		<tr>
			<td id = "nm"><%#DataBinder.Eval(Container.DataItem, "NM")%></td>
			<td id = "fhrpr"><%#DataBinder.Eval(Container.DataItem, "FHRR")%> %</td>

		</tr>
	</ItemTemplate>
	</asp:Repeater>
</tr>


Код скрипта изначально пробовал по принципу, который работает в PowerShell, но на Javascript это не прокатило. Почему, не могу понять:

<script type="text/javascript">
$('td#nm').each(function(){
    var n = $(this).text()
    if (n == "Viktor Pupkin") $('td#fhrpr'){
		var x = parseFloat($(this).text());
		if (x >= 5) $(this).css({color: 'Blue'})
    }
})
</script>


Пробовал по другому принципу, отметить искомые строчки, потом их окрасить, всё равно не работает:

<script type="text/javascript">
$('td#nm').each(function(){
    var n = $(this).text()
    if (n == "Viktor Pupkin") $('td#fhrpr').addClass("Group1")
    })

    $('td.Group1,td#fhrpr').each(function(){
    var x = parseFloat($(this).text());
    if (x >= 5) $(this).css({color: 'Blue'})
    })
</script>


Если вот тут поставить пробел, то вообще ничего не окрашивается, если запятую, то окрашивает всё столбцы, и выбранные, и не выбранные:

$('td.Group1,td#fhrpr')

рони 19.06.2016 23:19

strsin,
id уникально используйте классы

рони 19.06.2016 23:34

strsin,
вариант для неправильного id
<!DOCTYPE html>

<html>
<head>
  <title>Untitled</title>
  <meta charset="utf-8">
  <style type="text/css">
     td{
       border: solid 3px rgb(128, 0, 128);
       background-color: rgb(255, 255, 0);
     }

 </style>
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.0/jquery.min.js"></script>
  <script>
$(function() {
    $("tr").each(function() {
        "Viktor Pupkin" == $("#nm", this).text() && $("#fhrpr", this).text(function(b, a) {
            5 <= +a && $(this).css({
                color: "Blue"
            })
        })
    })
});
  </script>
</head>

<body>
<table width="400" summary="" >
	<thead>
		<tr>
			<th>name</th>
			<th>num</th>

		</tr>
	</thead>
	<tbody>
		<tr>
			<td id = "nm">Viktor Pupkin</td>
			<td id = "fhrpr">1</td>
		</tr>
		<tr>
			<td id = "nm">Viktor Pupkin</td>
			<td id = "fhrpr">5</td>

		</tr>
	</tbody>
</table>
</body>
</html>

strsin 19.06.2016 23:45

рони
Не совсем понял, что значит для неправильного id?

Данный код не окрашивает ничего.

рони 19.06.2016 23:48

Цитата:

Сообщение от strsin
Не совсем понял, что значит для неправильного id?

Цитата:

Сообщение от рони
id уникально используйте классы

id не должно повторятся на странице.
Цитата:

Сообщение от strsin
Данный код не окрашивает ничего.

это ваш цветовой выбор

рони 19.06.2016 23:50

strsin,
вместо id должен быть class
<!DOCTYPE html>

<html>
<head>
  <title>Untitled</title>
  <meta charset="utf-8">
  <style type="text/css">
     td{
       border: solid 3px rgb(128, 0, 128);
       background-color: rgb(255, 255, 0);
     }

 </style>
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.0/jquery.min.js"></script>
  <script>
$(function() {
    $("tr").each(function() {
        "Viktor Pupkin" == $("#nm", this).text() && $("#fhrpr", this).text(function(b, a) {
            5 <= +a && $(this).css({
                "background-color": "Blue",
                color : "rgb(255, 255, 255)"
            })
        })
    })
});
  </script>
</head>

<body>
<table width="400" summary="" >
	<thead>
		<tr>
			<th>name</th>
			<th>num</th>

		</tr>
	</thead>
	<tbody> <tr>
			<td id = "nm">Viktor Pupkin</td>
			<td id = "fhrpr">5</td>

		</tr>
		<tr>
			<td id = "nm">Viktor Pupkin</td>
			<td id = "fhrpr">1</td>
		</tr>
		<tr>
			<td id = "nm">Viktor Pupkin</td>
			<td id = "fhrpr">5</td>

		</tr>
	</tbody>
</table>
</body>
</html>

strsin 20.06.2016 00:04

Цитата:

Сообщение от рони (Сообщение 419962)
strsin,
вместо id должен быть class

Ой, точно первый тоже окрашивает, проглядел.

Но я так и не понял. Вы говорите использовать class, но в вашем скрипте сами используете id

рони 20.06.2016 00:49

Цитата:

Сообщение от strsin
Но я так и не понял. Вы говорите использовать class, но в вашем скрипте сами используете id

:cray: а вдруг вам с классом будет ещё непонятнее , когда примените класс, не забудьте поменять решётку на точку.

strsin 20.06.2016 01:59

С классами понятно. Скрипт работает.
Единственное, чтобы в таблице был знак % я добавил в скрипт parseFloat.

$('td#fhrpr').each(function(){
    var x = parseFloat($(this).text());
    if (x >= 5) $(this).css({color: 'Blue'})
    })


А вот тут я не пойму куда его засунуть, скрипт перестаёт работать куда бы не засунул:
$(function() {
    $("tr").each(function() {
        "Viktor Pup" == $("#nm", this).text() && $("#fhrpr", this).text(function(b, a) {
            5 <= +a && $(this).css({
                color: "Green"
            })
        })
    })
});

рони 20.06.2016 07:07

strsin,
$(function() {
    $("tr").each(function() {
        "Viktor Pup" == $("#nm", this).text() && $("#fhrpr", this).text(function(b, a) {
            5 <= parseFloat(a) && $(this).css({
                color: "Green"
            })
        })
    })
});


Часовой пояс GMT +3, время: 20:45.