Связывание значения столбца в jqGrid с новой страницей с помощью GET
Я создал jqGrid, который содержит некоторые поля, такие как:
job_id, имя и т. д.
Я пытаюсь сделать так, чтобы при щелчке по значению в столбце job_id он перенаправил их на:
- Что такое синтаксис RTF для гиперссылки?
- Facebook share link - можете ли вы настроить текст сообщения?
- Как ссылаться на метод в javadoc?
- Как создать прямую ссылку на любую коробку fancybox
- jQuery отключить ссылку
job.php? job_id = (значение, на которое они нажали)
Я начал с попытки использовать следующее как мой colModel:
{ name:'job_id', index:'job_id', edittype:'select', formatter:'showlink', formatoptions:{baseLinkUrl:'job.php'}, width:50, align:'center' }
Но это приводит к перенаправлению на:
job.php? job_id = (row_id)
Я сделал некоторые поиски и нашел сообщение разработчиком версии с открытым исходным кодом этого программного обеспечения, которая предложила использовать следующий colModel и дополнительный JS:
{ name:'job_id', index:'job_id', edittype:'select', formatter:'showlink', formatoptions:{baseLinkUrl:'#'}, width:50, align:'center' } loadComplete: function() { var myGrid = $("#home_list"); var ids = myGrid.getDataIDs(); for (var i = 0, idCount = ids.length; i < idCount; i++) { $("#"+ids[i]+" a",myGrid[0]).click(function(e) { var hash=e.currentTarget.hash;// string like "#?id=0" if (hash.substring(0,5) === '#?id=') { var id = hash.substring(5,hash.length); var text = this.textContent; location.href="job.php?id="+text; } e.preventDefault(); }); } }
Но это несовместимо с IE. В дополнение к этому при отображении большого количества строк в jqGrid требуется очень долгое время загрузки, например 5 секунд + для 500 строк.
Я буду продолжать работать над этим, но это то, что сделал кто-то еще?
- Пример использования гиперссылки в WPF
- Может ли Google Chrome открывать локальные ссылки?
- Scrapy: Следуйте ссылке, чтобы получить дополнительные данные элемента?
- Изменить цвет текста в тексте TextView и щелкнуть?
- Редактирование гиперссылок и якорей в PDF с помощью ITextSharp
- Как я могу сделать ссылку на клики в NSAttributedString?
- Удалить упорное подчеркивание ссылки
- Как сделать кнопку похожим на ссылку?
Вы использовали пример кода из моего старого ответа, поэтому я решил ответить на ваш вопрос.
Я согласен с критиком в отношении выполнения кода loadComplete
. Так что +1 от меня для вашего вопроса. Конструкция $("#"+ids[i]+" a", myGrid[0])
внутри длинной петли может работать очень медленно. Можно легко исправить проблему, если вы будете использовать следующее
var getColumnIndexByName = function (columnName) { var cm = $(this).jqGrid("getGridParam", "colModel"), l = cm.length, i; for (i = 0; i < l; i++) { if (cm[i].name === columnName) { return i; // return the index } } return -1; }; var myGrid = $("#list"); myGrid.jqGrid({ ... loadComplete: function () { var i = getColumnIndexByName.call(this, 'Subcategory'); // nth-child need 1-based index so we use (i+1) below $("tbody>tr.jqgrow>td:nth-child(" + (i+1) + ")>a", this).click(function (e) { var hash=e.currentTarget.hash;// string like "#?id=0" if (hash.substring(0,5) === '#?id=') { var id = hash.substring(5, hash.length); var text = this.textContent || this.innerText; alert("clicked the row with id='"+id+"'. Link contain '"+text+"'"); location.href = "http://en.wikipedia.org/wiki/" + text; } e.preventDefault(); }); } });
Вы можете видеть, что улучшенная версия демо работает точно так же, как оригинальная демонстрация . Чтобы показать производительность метода на 1000 строк, я создал еще одно демо . Видно, что новый метод работает быстро.
Теперь вернемся к вашей основной проблеме. Наилучшая производительность, которую мы получим, если вы напишете свой собственный форматировщик и unformatter вместо использования предопределенной formatter showlink . Код может быть примерно следующий:
formatter: function (cellvalue, options, rowObject) { return "" + cellvalue + ""; }, unformat: function (cellvalue, options, cellobject) { return cellobject.job_id; }
Точный код зависит от того, какой datatype
вы используете, используете ли вы loadonce:true
или нет и какой jsonReader
вы используете. Это может быть, например, что rowObject
представляет собой массив в вашем случае, и вам нужно использовать индекс массива соответствующего поля данных (например, rowObject[4]
) вместо rowObject.job_id
.
ОБНОВЛЕНО : я считаю, что лучшим способом реализации будет использование onCellSelect или beforeSelectRow вместо привязки события click к каждому элементу столбца. Я рекомендую прочитать следующие ответы для деталей: этот , еще один и еще один старый ответ .