За последние 24 часа нас посетили 63083 программиста и 1740 роботов. Сейчас ищут 900 программистов ...

Нужна помощь с динамическими объектами

Тема в разделе "JavaScript и AJAX", создана пользователем ps10n1ck, 23 янв 2011.

  1. ps10n1ck

    ps10n1ck Активный пользователь

    С нами с:
    29 дек 2010
    Сообщения:
    8
    Симпатии:
    0
    Код (Text):
    1.  
    2. var dohod_all_code_array = "<?php echo implode(",",$dohod_code_array) ?>";
    3. var dohod_code_array = dohod_all_code_array.split(",");
    4.  
    5. var dohod_all_id_array = "<?php echo implode(",",$dohod_id_array) ?>";
    6. var dohod_id_array = dohod_all_id_array.split(",");
    7.  
    8. var countOfFields = 1; // Текущее число полей
    9.  
    10. function deleteField(a) {
    11.     var contDiv = a.parentNode;
    12.         contDiv.parentNode.removeChild(contDiv);
    13.         countOfFields--;
    14. return false;
    15. }
    16.  
    17. function addField() {
    18. countOfFields++;
    19.  
    20. var divElement = document.createElement("div");
    21. var selectElement = document.createElement("<select name='dohod_id' class='inputselect'>");
    22. var inputElement = document.createElement("<input type='text' name='summ' class='inputsumm' onKeyDown='return comaReplace(this)'>");
    23. var aElement = document.createElement("<a onclick='return deleteField(this)' href='#'>");
    24.  
    25. var optionElement = document.createElement("option");
    26. optionElement.value = "null";
    27. optionElement.innerHTML = "Оберіть код доходу";
    28. selectElement.appendChild(optionElement);
    29.  
    30. for(i=0; i<dohod_code_array.length; i++){
    31. optionElement = document.createElement("option");
    32. optionElement.value = dohod_id_array[i];
    33. optionElement.innerHTML = dohod_code_array[i];
    34. selectElement.appendChild(optionElement);}
    35.  
    36. aElement.innerText = "[-]";
    37.  
    38. divElement.id = "dohod_id"+countOfFields;
    39. divElement.appendChild(selectElement);
    40. divElement.appendChild(inputElement);
    41. divElement.appendChild(aElement);
    42.  
    43. document.getElementById("select").appendChild(divElement);
    44.  
    45.  // Возвращаем false, чтобы не было перехода по сслыке
    46.  return false;
    47. }
    В ИЕ8 работает нормально, создает новые селекты и форму для ввода... а вот в лисе, хроме, опере не хочет работать, просто не добавляет новые объекты..

    Подскажите есть ли кросбраузерное решение?
     
  2. Kreker

    Kreker Старожил

    С нами с:
    8 апр 2007
    Сообщения:
    5.433
    Симпатии:
    0
    https://developer.mozilla.org/en/DOM/do ... ateElement

    если хотите быстро и кроссбраузерно - используйте jquery.

    А вообще, насколько я помню, три года назад сам парился с динамическим созданием селектов - у меня они пустые на страницу добавлялись (именно в FF & opera). Как решил, не помню. Может быть и отказался от этой идеи.
     
  3. ps10n1ck

    ps10n1ck Активный пользователь

    С нами с:
    29 дек 2010
    Сообщения:
    8
    Симпатии:
    0
    все, вопрос снят. Вся проблема заключалась в том, что во всех браузерах, кроме ИЕ (как оказалось придуркам закон(стандарт) не писан (wc3)) необходимо создавать новые элементы указывая только их название, а прочее указывать уже через атрибуты:
    данный код получился уже кроссбраузерный:
    Код (Text):
    1. var dohod_all_code_array = "<?php echo implode(",",$dohod_code_array) ?>";
    2. var dohod_code_array = dohod_all_code_array.split(",");
    3.  
    4. var dohod_all_id_array = "<?php echo implode(",",$dohod_id_array) ?>";
    5. var dohod_id_array = dohod_all_id_array.split(",");
    6.  
    7. var countOfFields = 1;
    8.  
    9. function deleteField(a) {
    10.     var contDiv = a.parentNode;
    11.         contDiv.parentNode.removeChild(contDiv);
    12.         countOfFields--;
    13. return false;
    14. }
    15.  
    16. function addField() {
    17. countOfFields++;
    18.  
    19. var divElement = document.createElement("div");
    20. var selectElement = document.createElement("select");
    21. var inputElement = document.createElement("input");
    22. var aElement = document.createElement("a");
    23.  
    24. selectElement.name = "dohod_id";
    25. selectElement.className = "inputselect";
    26.  
    27. var optionElement = document.createElement("option");
    28. optionElement.value = "null";
    29. optionElement.innerHTML = "Оберіть код доходу";
    30. selectElement.appendChild(optionElement);
    31.  
    32. for(i=0; i<dohod_code_array.length; i++){
    33. optionElement = document.createElement("option");
    34. optionElement.value = dohod_id_array[i];
    35. optionElement.innerHTML = dohod_code_array[i];
    36. selectElement.appendChild(optionElement);}
    37.  
    38. inputElement.type = "text";
    39. inputElement.name = "summ";
    40. inputElement.className = "inputsumm";
    41. inputElement.onkeydown = function (){comaReplace(this)};
    42.  
    43. aElement.innerHTML = '[-]';
    44. aElement.href = "#";
    45. aElement.className = "pages";
    46. aElement.onclick = function (){deleteField(this)};
    47.  
    48. divElement.id = "dohod_id"+countOfFields;
    49. divElement.appendChild(selectElement);
    50. divElement.appendChild(inputElement);
    51. divElement.appendChild(aElement);
    52.  
    53. document.getElementById("select").appendChild(divElement);
    54.  
    55.  return false;
    56. }