jqGrid выделит новую добавленную строку - PullRequest
Новая
       9

jqGrid выделит новую добавленную строку

8 голосов
/ 01 июня 2010

Возможно ли выделить новую добавленную строку в jqGrid. Эффект подсветки выглядит примерно так Эффект подсветки

Таким образом, при добавлении новой строки строка будет подсвечена, чтобы пользователю было понятно, какая запись является новой.

Большое спасибо!

Ответы [ 3 ]

15 голосов
/ 01 июня 2010

Да, я использовал следующее, чтобы кратко выделить недавно добавленную строку. Это дает хороший эффект, чтобы пользователь знал, что есть новые данные, и звучит так же, как вы ищете: 

jQuery("#" + rowId, "#myGrid").effect("highlight", {}, 2000);
2 голосов
/ 01 июня 2010

Если я вас правильно понял, вы хотите выделить строку, добавленную в отношении редактирования формы («+» на панели навигации). Редактирование форм поддерживает событие afterComplete, которое можно использовать для добавления некоторых функций после редактирования. Например, если вы хотите использовать эффект выделения при добавлении всех строк, вы можете использовать общие настройки для jQuery.jgrid.edit: 

jQuery.extend(jQuery.jgrid.edit, {
    reloadAfterSubmit: false,
    afterComplete : function (response, postdata, formid) {
        if (postdata.oper === "add") { // highlight on "add" only
            var row = jQuery ("#"+$.jgrid.jqID(postdata.id), jQuery(this.gbox));
            row.effect("highlight", {color:"red"}, 3000);
        }
    }
});

Если вы будете использовать row.effect("highlight", {}, 3000); (без красного цвета), вы увидите эффект выделения, но немного не очень ясно, потому что добавленная строка будет выбрана по умолчанию.

Вы можете изменить код, чтобы использовать подсветку только для одной выбранной сетки.

1 голос
/ 01 июня 2010

Какая информация у вас уже есть о строке.

У вас есть идентификатор строки? Или значение поля, которое помечено как ключ?

Создает строку, как определено следующим образом. Обратите внимание, что идентификатор строки совпадает со значением ключа. 

<TR id=11 class="ui-widget-content jqgrow ui-row-ltr ui-state-highlight" role=row aria-selected=true><TD title=11 role=gridcell aria-describedby=list2_id>11</TD><TD title=2007-10-06 role=gridcell aria-describedby=list2_invdate>2007-10-06</TD><TD title="Client 1" role=gridcell aria-describedby=list2_name>Client 1</TD><TD style="TEXT-ALIGN: right" title=600.00 role=gridcell aria-describedby=list2_amount>600.00</TD><TD style="TEXT-ALIGN: right" title=120.00 role=gridcell aria-describedby=list2_tax>120.00</TD><TD style="TEXT-ALIGN: right" title=720.00 role=gridcell aria-describedby=list2_total>720.00</TD><TD title="" role=gridcell aria-describedby=list2_note>&nbsp;</TD></TR>

Так что тогда вы могли бы просто сделать. 

$("#tblselector).find("#+KeyValue").addClass("ui-state-highlight")

Это действительно зависит от того, как добавляется строка. Вы можете использовать событие afterInsertRow, но оно будет срабатывать для каждой строки при ее добавлении в сетку. Кроме того, на мероприятии есть эта заметка.

Примечание: это событие не срабатывает, если для параметра gridview установлено значение true

Я не предлагаю менять опцию gridview на false, если вы возвращаете много строк и / или столбцов, поскольку это сильно повлияет на производительность.

Я бы попросил уточнить, как добавляется строка, но у меня недостаточно очков для комментариев.

...