Выделение фоном строк всех списков с галочкой

[sofree]

Сделайте страницу со списком заявок и ссылок (для тех у кого работает автомат) с подсветкой фона строки при установки галочки.
И ещё было бы не плохо, чтобы не надо было щёлкать на галочку, а достаточно было просто кликнуть по этой строке.

Чтобы понять на "пальцах" - сделать так же как в phpmyadmin сделано при правке содержимого таблицы.

А то сколько раз уже было, - прочёл текст ссылки, - кликнул, - смотришь, - промахнулся. А так, при выделении фоном, - сразу становится всё понятно.

[Atec]

Поддерживаю, было бы значительно удобнее!

[timeout]

Всё правильно.

[sofree]

Как говориться, сам не разберёшься - никто не сделает.
И так, пожалейте мои глаза, - я подготовил нужный код. Прошу его рассмотреть (всё взял из phpMyAdmin - но рыться там... - много времени тратить).

Нужно добавить в js файл код (например в sorttable.js)

PHP код:

/**
 * This array is used to remember mark status of rows in browse mode
 */
var marked_row = new Array;

/**
 * enables highlight and marking of rows in data tables
 *
 */
function PMA_markRowsInit() {
    // for every table row ...
    var rows = document.getElementsByTagName('tr');
    for ( var i = 0; i < rows.length; i++ ) {
        // ... with the class 'odd' or 'even' ...
        if ( 'odd' != rows[i].className.substr(0,3) && 'even' != rows[i].className.substr(0,4) ) {
            continue;
        }
        // ... add event listeners ...
        // ... to highlight the row on mouseover ...
        if ( navigator.appName == 'Microsoft Internet Explorer' ) {
            // but only for IE, other browsers are handled by :hover in css
            rows[i].onmouseover = function() {
                this.className += ' hover';
            }
            rows[i].onmouseout = function() {
                this.className = this.className.replace( ' hover', '' );
            }
        }
        // Do not set click events if not wanted
        if (rows[i].className.search(/noclick/) != -1) {
            continue;
        }
        // ... and to mark the row on click ...
        rows[i].onmousedown = function() {
            var unique_id;
            var checkbox;

            checkbox = this.getElementsByTagName( 'input' )[0];
            if ( checkbox && checkbox.type == 'checkbox' ) {
                unique_id = checkbox.name + checkbox.value;
            } else if ( this.id.length > 0 ) {
                unique_id = this.id;
            } else {
                return;
            }

            if ( typeof(marked_row[unique_id]) == 'undefined' || !marked_row[unique_id] ) {
                marked_row[unique_id] = true;
            } else {
                marked_row[unique_id] = false;
            }

            if ( marked_row[unique_id] ) {
                this.className += ' marked';
            } else {
                this.className = this.className.replace(' marked', '');
            }

            if ( checkbox && checkbox.disabled == false ) {
                checkbox.checked = marked_row[unique_id];
            }
        }

        // ... and disable label ...
        var labeltag = rows[i].getElementsByTagName('label')[0];
        if ( labeltag ) {
            labeltag.onclick = function() {
                return false;
            }
        }
        // .. and checkbox clicks
        var checkbox = rows[i].getElementsByTagName('input')[0];
        if ( checkbox ) {
            checkbox.onclick = function() {
                // opera does not recognize return false;
                this.checked = ! this.checked;
            }
        }
    }
}

window.onload=PMA_markRowsInit; 


Добавить в .css файл (например в styles.css)

/* marked table rows */
table tr.marked th,
table tr.marked {
background: #E5E5E5;
color: #000000;
}

Затем в коде вывода таблицы с ссылками добавить стиль (например для site_links.php) в том месте где идут строки с "галочкой".

<tr class="odd">...

Пожалуйста - поставьте этот код, - или какой-то другой, - главное чтобы цель была достигнута.
ПОЖАЛЕЙТЕ НАШИ ГЛАЗКИ! С подсветкой строки и выбором строки по щелчку - КПД вырастет процентов на 30!

[sofree]

Всё попробовал на http://proxomitron.ru.
Всё что нужно, - делается. Ставить галки - одно удовольствие и фон подсвечивается и с установкой галочки - нет проблем - можно прям по тексту ссылки нажимать - галка ставится сама!

Единственный баг нашёл - это когда щёлкаешь по ссылке, которая открывается в новом окне - JS ставил галку. Не нашёл как это побороть. Спецы в JS помогите разобраться. Конфиг проксимотрона привожу. И саповцов прошу обратить внимание, - а то скриптец доделаем, - а ставить его не захотят... Так и останется один вариант с проксомитроном.

Всех кто много ссылок просматривает/принимает/отклоняет - прошу попробовать, думаю, "фича" вам точно понравится.

PHP код:

Name = "sape2"
Active = TRUE
Multi = TRUE
URL = "sape.ru/site_links.php"
Limit = 256
Match = "<tr>"
Replace = "<tr class="odd">"

Name = "sape1"
Active = TRUE
URL = "sape.ru/site_links.php"
Limit = 256
Match = "</body></html>"
Replace = "\n"
          "<style>\n"
          "table tr.marked th,\n"
          "table tr.marked {\n"
          "background: #E5E5E5;\n"
          "color: #000000;\n"
          "}\n"
          "</style>\n"
          "\n"
          "<script language="JavaScript">\n"
          "/**\n"
          " * This array is used to remember mark status of rows in browse mode\n"
          " */\n"
          "var marked_row = new Array;\n"
          "\n"
          "/**\n"
          " * enables highlight and marking of rows in data tables\n"
          " *\n"
          " */\n"
          "function PMA_markRowsInit() {\n"
          "    // for every table row ...\n"
          "    var rows = document.getElementsByTagName('tr');\n"
          "    for ( var i = 0; i < rows.length; i++ ) {\n"
          "        // ... with the class 'odd' or 'even' ...\n"
          "        if ( 'odd' != rows[i].className.substr(0,3) && 'even' != rows[i].className.substr(0,4) ) {\n"
          "            continue;\n"
          "        }\n"
          "        // ... add event listeners ...\n"
          "        // ... to highlight the row on mouseover ...\n"
          "        if ( navigator.appName == 'Microsoft Internet Explorer' ) {\n"
          "            // but only for IE, other browsers are handled by :hover in css\n"
          "            rows[i].onmouseover = function() {\n"
          "                this.className += ' hover';\n"
          "            }\n"
          "            rows[i].onmouseout = function() {\n"
          "                this.className = this.className.replace( ' hover', '' );\n"
          "            }\n"
          "        }\n"
          "        // Do not set click events if not wanted\n"
          "        if (rows[i].className.search(/noclick/) != -1) {\n"
          "            continue;\n"
          "        }\n"
          "        // ... and to mark the row on click ...\n"
          "        rows[i].onmousedown = function() {\n"
          "            var unique_id;\n"
          "            var checkbox;\n"
          "\n"
          "            checkbox = this.getElementsByTagName( 'input' )[0];\n"
          "            if ( checkbox && checkbox.type == 'checkbox' ) {\n"
          "                unique_id = checkbox.name + checkbox.value;\n"
          "            } else if ( this.id.length > 0 ) {\n"
          "                unique_id = this.id;\n"
          "            } else {\n"
          "                return;\n"
          "            }\n"
          "\n"
          "            if ( typeof(marked_row[unique_id]) == 'undefined' || !marked_row[unique_id] ) {\n"
          "                marked_row[unique_id] = true;\n"
          "            } else {\n"
          "                marked_row[unique_id] = false;\n"
          "            }\n"
          "\n"
          "            if ( marked_row[unique_id] ) {\n"
          "                this.className += ' marked';\n"
          "            } else {\n"
          "                this.className = this.className.replace(' marked', '');\n"
          "            }\n"
          "\n"
          "            if ( checkbox && checkbox.disabled == false ) {\n"
          "                checkbox.checked = marked_row[unique_id];\n"
          "            }\n"
          "        }\n"
          "\n"
          "        // ... and disable label ...\n"
          "        var labeltag = rows[i].getElementsByTagName('label')[0];\n"
          "        if ( labeltag ) {\n"
          "            labeltag.onclick = function() {\n"
          "                return false;\n"
          "            }\n"
          "        }\n"
          "        // .. and checkbox clicks\n"
          "        var checkbox = rows[i].getElementsByTagName('input')[0];\n"
          "        if ( checkbox ) {\n"
          "            checkbox.onclick = function() {\n"
          "                // opera does not recognize return false;\n"
          "                this.checked = ! this.checked;\n"
          "            }\n"
          "        }\n"
          "    }\n"
          "}\n"
          "\n"
          "window.onload=PMA_markRowsInit;\n"
          "</script>\n"
          "\n"
          "</body>\n"
          "</html>\n"
          "\n"