Javascript-форум (https://javascript.ru/forum/)
-   Javascript под браузер (https://javascript.ru/forum/css-html/)
-   -   Помогите с кнопками разобратся (https://javascript.ru/forum/css-html/68272-pomogite-s-knopkami-razobratsya.html)

wegas 06.04.2017 10:57

Помогите с кнопками разобратся
 
есть код все работает, хотелось бы сделать, чтобы кнопки при нажатии меняли цвет в зависимости от режима parts[1] т.е если parts[1] = 0 то зеленая кнопка, если 1 то желтая и т.п, все режимы находятся в базе данных и она ajax изменяется. Мозгов не хватает это сделать))) прошу помощи гуру))):). Мозгов хватило только на то, чтобы подгружались цвета из базы данных, т.е. при перезагрузке все работает а надо чтобы интерактивно все было... кнопок в базе 366 они все выводятся, своеобразный календарь


<?php
            echo "<div class=pn>В этом году количество дней =".$days."<br>";
            echo "Сегодня: ".date('l jS \of F Y h:i:s A');
            
            $den=date('z');
            
            
            echo"<br>"."Сегодня номер дня: ".$den."<br></div>";
            echo "<br>", "<div class=p>Декабрь:</div>" ;
                    
          include '../config.php';
         $zapros="select * from `table`"; 
         $result = mysql_query($zapros, $db);
            while ($line = mysql_fetch_array($result, MYSQL_NUM))  {
        	  $x=$line[0]; $y=$line[1];
        	  $clickmy[$x]=(string)$x;$rej[$x]=(string)$y;
              
        	 // echo"<button class=b id='".$clickmy[$x]."'>".($x+1).": ".$y."</button>";
           
                 if (($x<151)or($x>242)) { 
                    
              if($y==0) echo"<button class=b id='".$clickmy[$x]."'>".($x).": ".$y."</button>";
             if($y==1) echo"<button class=a id='".$clickmy[$x]."'>".($x).": ".$y."</button>" ;
             if($y==2) echo"<button class=c id='".$clickmy[$x]."'>".($x).": ".$y."</button>" ; 
             if($y==3) echo"<button class=d id='".$clickmy[$x]."'>".($x).": ".$y."</button>" ; 
              
              if($x%7==0) echo"<br>";
        	  if($x==31) echo "<br>","<div class=p>Январь:</div>" ;
              if($x==60) echo"<br>","<div class=p>Февраль:</div>";
              if($x==90) echo"<br>","<div class=p>Март:</div>";
              if($x==120) echo"<br>","<div class=p>Апрель:</div>";
              if($x==243) echo"<br>","<div class=p>Май:</div>";
              //if($x==181) echo"<br>","<div class=p>Июнь:</div>";
              //if($x==212) echo"<br>","<div class=p>Июль:</div>";
             // if($x==243) echo"<br>","<div class=p>Август:</div>";
              if($x==273) echo"<br>","<div class=p>Сентябрь:</div>" ;
              if($x==304) echo"<br>","<div class=p>Октябрь:</div>";
              if($x==334) echo"<br>","<div class=p>Ноябрь:</div>";
            }  
           
        	}
        //	echo "<br>".$clickmy[$den]."  ".$clicmy[$z];
       
        ?>
         
         
        <script>
         myden=document.getElementById('<?php echo $clickmy[$den];?>');
         myden.style.backgroundColor='red';
         myden.style.width='60px';
         myden.style.height='30px';
         
         
        function myHandler(e) {
            var src, parts;
        	
         // получим событие и элемент - источник события
            e = e || window.event;
            src = e.target || e.srcElement; 
            
         // обновляем результат клика по кнопке
            parts = src.innerHTML.split(": ");
            parts[1] = parseInt(parts[1], 10) + 1;
           
        			if (parts[1]>3) parts[1]=0;
                    
        	 src.innerHTML = parts[0] + ": " + parts[1]; 
             
        	
        	//bbb[src.id]=parts[1]; //Запомним вводимые значения кнопкам с id
            
             
        $.ajax({
                type: "POST",
                url: "zapis.php",
                data: {nomer:src.id, znach:parts[1]}
            }).done(function(result)
                {
                    $("#msg").html( "День " +src.id+ " Режим " +parts[1] +"  "+result );
                });
                
                              
        
        //document.write("<form action='zapis.php' method='POST'>");
       // document.write("<input type='hidden' name='nomer'" + " value="+src.id+">");
       // document.write("<input type='hidden' name='znach'" + " value="+parts[1]+">");
      //  document.write("<br><input id='reg' type='submit'></form>");	
      //  document.getElementById('reg').click(); 	
        }
        
        
        
        var b=new Array(); 
       	
        for(var i=0;i<=150;i++){ 
            
        	b[i] = document.getElementById(i);
        	if (document.addEventListener) {
        	   
        		b[i].onclick = myHandler;
                
                
              }
              
              if (i==150){
                for(var i=243;i<=366;i++){ 
                    b[i] = document.getElementById(i);
        	           if (document.addEventListener) {
        	   
        		      b[i].onclick = myHandler;
                      

              }}} 
                      
        }
        
      
       
      
       
       
        
        </script>

laimas 06.04.2017 18:53

1) (string)$x и (string)$y зачем? Это лишнее.
2) меняли цвет в зависимости от режима parts[1] - что есть режим и как они связаны с классами указанными?

wegas 06.04.2017 20:15

в базе данных есть таблица, в ней 2 строки, 1 строка выводит кнопки другая режимы, всего 4 режима 0,1,2,3. Каждый раз когда кликаешь по кнопке изменяется режим, т.е в базе изменяется 0-4 в зависимости от id. Вот мне нужно чтобы в зависимости от режима изменялся цвет 0 - зеленый, 1 красный.... на кнопке выводится типо день 1, режим [0,1,2,3] кнопка имеет вид [1:0]. Кнопок 366 - как дней в году...

рони 06.04.2017 21:09

оставлю тут сообщение, чтоб потом узнать, что хотел ТС, если кто - то ему поможет.

laimas 06.04.2017 21:43

Цитата:

Сообщение от wegas
в базе данных есть таблица, в ней 2 строки, 1 строка выводит кнопки другая режимы

Не строки, а поля таблицы судя по представлению, причем тип данных числа.

А насчет цвета, ну так свяжите их со стилями описывающими их.

wegas 06.04.2017 22:38

Пожалуйста подскажите именно кодом как их связать. Я уже все перепробовал, возможно где то глупые ошибки делаю... дада поля таблицы, просто описался))

laimas 06.04.2017 23:07

Странный календарь если судить по периодам, но будем считать, что это нечто которое одним полем таблицы описывает дни в году, а вторым режим, который может иметь одно из значений от 0 до 3. Если так и при выводе этого календаря ячейки должны быть окрашены цветом соответственно режиму, то это например class="mode-" . $mode. То есть в CSS описать:

.mode-0 {
    background: #f00
}

.mode-1 {
    background: #0f0
}

и т.д.


Соответственно на клиенте изменять имя класса кнопки соответствующее выбранному режиму.

wegas 07.04.2017 11:58

Да именно так, это задумка такая. Строчка 23, 24, 25 окрашивает кнопки в цвета но это происходит только когда страницу перезагружу, а если нажимаю кнопки то они не окрашиваются, я думал можно обмануть написать функцию при которой кнопка если нажать 1 раз окрашивается в 1 цвет, 2 раз в другой, но так возникает проблема того, а если она уже имеет 2 режим и тогда окрасится не в тот цвет который хотелось бы.. тогда нужно писать функцию определения цвета, но я не знаю как ее написать.

wegas 07.04.2017 12:03

Попробую как вы сказали, надо $y отправлять в css, я пробовал режим отправлять parts[1] нечего не получалось

рони 07.04.2017 12:07

wegas,
чтобы написать функцию, нужен алгоритм, пока увы, у вас нет описания того, что вы хотите получить и из чего?
Цитата:

Сообщение от wegas
это задумка такая.

это не описание, а пожелание для чародея-телепата.


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