Как получить идентификаторы флажков, которые отображаются на странице динамически - PullRequest
1 голос
/ 13 марта 2012

У меня есть страница JSP, в которой есть HTML-таблица.Содержимое таблицы будет заполнено динамически после прочтения XML-файла.В зависимости от некоторых данных, присутствующих в XML-файле, количество строк в таблице может варьироваться от 2 до 10. Теперь в каждой строке, отображаемой в HTML-таблице, есть флажок . Идентификатор флажка также динамически называется .Теперь я должен написать некоторый код JavaScript, который зависит от всех идентификаторов флажков, которые отображаются.Как передать все идентификаторы флажков, отображаемых в таблице, в код JavaScript динамически ?

PS : Я думаю об этом подходе, пожалуйста, исправьте меняесли я не прав. Объявить пустой массив для хранения идентификаторов флажков.Когда я создаю каждую строку таблицы динамически, используя цикл for, я добавляю идентификаторы флажков в массив.Теперь я думаю использовать этот массив в JavaScript.

Возможно ли получить доступ к этому массиву в JavaScript?Если это так, как я могу передать этот массив в блок JavaScript?Существуют ли какие-либо ограничения на то, где разместить этот код javascript в jsp (например, после / перед блоком кода, где идентификаторы флажков добавляются в массив).Я относительно новичок в такого рода вещах.Просьба помочь в реализации этого подхода

Ответы [ 5 ]

2 голосов
/ 13 марта 2012

Да, аналогично ответу mplungjan, вы можете искать типы элементов, а затем копать дальше, чтобы получить элементы-флажки в пределах

Так что в вашем случае ищите свою таблицу по идентификатору (если вы дали ей идентификатор) илипо тэгу («таблица» [0], если это первая и единственная таблица), найдите элементы-флажки внутри таблицы и добавьте каждый из них в свой массив

var table   = document.getElementById('dataTable');
//OR if we assert there's only 1 table
//var table = document.getElementsByTagName('table')[0]; 
var tableInputTags = table.getElementsByTagName("input");
var checkboxArray= [];

for (var i=0; i<tableInputTags.length; i++) 
{
    if(tableInputTags[i].type=="checkbox") 
    {
        checkboxArray.push(tableInputTags[i].id);
    }
}
//continue doing something with the 
//array of dynamically created checkboxes...
1 голос
/ 13 марта 2012

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

  1. добавляет идентификатор флажка в массив javascript для каждой итерации в цикле for на стороне сервера. Таким образом, вам нужно объявить пустой массив js в начале вашей страницы, затем вы добавляете блок script для каждого флажка, в котором вы помещаете идентификатор в массив с помощью <yourarray>.push("<yourid>"). Это решение не является действительно производительным (так как каждый блок <script> останавливает процесс рендеринга на некоторое время, и вы «сеете» код в нескольких местах), но технически работает - в противном случае

  2. при DOM ready (или при загрузке) событии вы смотрите на коллекцию input:checkbox DOM, получаете идентификатор и помещаете его в массив, вот так:

    var ids = [],
        cbx = document.querySelectorAll('input[type="checkbox"]');
    
    for (i = 0, l = cbx.length; i < l; i++) {
           ids.push(cbx[i].id);
    }
    
    console.log(ids);
    

Fiddle: http://jsfiddle.net/G44hH/1/ - Конечно, если вы можете, лучше использовать это решение (а не первое)

0 голосов
/ 13 марта 2012

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

Селектор jquery вернет массив этих флажков, затем вы можете использовать этот массив в соответствии с вашиминеобходимость.Как то так.

<input type=checkbox class ="box"/>

var arr = [];

arr = $(".box");
0 голосов
/ 13 марта 2012

Предположим, у вас есть таблица с id #table, в которой есть несколько TR, у вас есть флажок в TD.Вы можете сделать это с помощью jquery ниже:

$('#table tr').each(function() {
 alert($(this).find('input:checkbox').attr('id'));
});

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

Я могу выслать вам правильный код, если вы сможете четко указать, что вы хотите сделать.

0 голосов
/ 13 марта 2012

Предполагая, что все флажки доступны после загрузки страницы, вы можете сделать это (обычный javascript):

var checks=[];
window.onload=function() {
  var inputs = document.getElemementsByTagName("input");
  for (var i=0, n=inputs.name;i<n;i++) {
    if (inputs[i].type=="checkbox") checks.push(inputs[i].id);
  }
}
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...