Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 23.09.2010, 14:07
Новичок на форуме
Отправить личное сообщение для мшеул Посмотреть профиль Найти все сообщения от мшеул
 
Регистрация: 23.09.2010
Сообщений: 7

проблема со свойством name при использовании appendChild()
Здравствуйте. Проблема следующая.
//возвращает элемент select с заданными параметрами
function getSlc(slcParam){
	//alert('sel1');
	//var selParam = {sId:'id',sName:'name',sItems:[]};
	var slc = document.createElement('SELECT');		
		slc.id   = slcParam.sId;		
		slc.name = slcParam.sName;
		slc.setAttribute('NAME',slcParam.sName);				//в IE работает а так slc.name = 'name' нет...
	if(slcParam.sFunct != undefined){
		var slcMethod     = slcParam.sFunct.sMethod;
		var usrHandler    = slcParam.sFunct.sHandler;
		var usrHandlerArg = slcParam.sFunct.sHandlerArg;
		//alert(usrHandler+'('+usrHandlerArg+')');
		slc.onchange = usrHandler+'('+usrHandlerArg+')'; 		//грамотно вот так (function() {func(arg);}); #@$%#$%!!!!	TODO но не работает! почему!!!?
		//slc.setAttribute(slcMethod,usrHandler);
	}
	var len = slcParam.sItems.length;
	var defaultItems  = 0; var defaultItemsFlag   = false;
	var selectedItems = 0; var selectedItemsFlag  = false;
	//цикл по основному списку-источнику полей
	for(var i=0; i<len; i+=1){
		if ( i == defaultItems)	{ defaultItemsFlag = true; }else{ defaultItemsFlag = false; }				//опция, которая выделена
		if ( i == selectedItems) { selectedItemsFlag = true; }else{ selectedItemsFlag  = false; }		 	//опция, которая будет выделена при сбросе формы
		var opt = new Option(slcParam.sItems[i],i,defaultItemsFlag,selectedItemsFlag);						//var newOpt = new Option("text", "value", isDefaultSelected, isSelected);
		slc.options[i] = opt;
	}
	//alert('slc name: '+slc.name);
	return slc;
}

//возвращает строку опций для поля фильтра
function  getFFOptionsRow(table,i,field2R){
	var tablePreffiks = 'FF';
	var newRow = table.insertRow(-1);										//добавляем строку в созданной таблице
		newRow.className = 'tableData';
		newRow.id        = tablePreffiks+'tableData_'+field2R.key[i];
		//имя поля
		var newCell = newRow.insertCell(-1);								//в созданной строке добавляем столбец
			newCell.align     = 'right';									//указываем позиционирование по центру
			newCell.innerHTML = '&nbsp'+field2R.val[i]+'&nbsp';
		//тип фильтра
		var newCell = newRow.insertCell(-1);								//в созданной строке добавляем столбец
			newCell.align     = 'center';									//указываем позиционирование по центру
				var slcParam = {
									sId    : 'field_'+field2R.key[i]+'_filter_type_slc',
									sName  : 'field_'+field2R.key[i]+'_filter_type',
									sItems : globalArrayOfFilterTypes
								};
				var slc  = getSlc(slcParam);
				alert('slc name: '+slc.name);
				var buf = document.createElement('SELECT');					//опять работа ушами... ну не хочет appendChild добавлять элемент нормально - событие почему-то записано нормально с функцией, а не срабатывает (при повторном добавлениии новых строк в уже существующую таблицу)				
				buf.appendChild(slc);
				alert('buf: '+buf.innerHTML);
			newCell.innerHTML = buf.innerHTML;
			//newCell.appendChild(slc);			
}

При добавлении элемента select (slc) свойство name, устанавливаемое в getSlc(slcParam) куда-то пропадает. Статьи про различия свойств и аттрибутов прочитал и различия вроде понял. Но почему через slc.setAttribute('name',slcParam.sName); работает, а через свойство name - нет. Да, все это безобразие проверяется под IE8.

Последний раз редактировалось мшеул, 23.09.2010 в 14:11.
Ответить с цитированием
  #2 (permalink)  
Старый 23.09.2010, 14:29
Отправить личное сообщение для Octane Посмотреть профиль Найти все сообщения от Octane  
Регистрация: 09.07.2008
Сообщений: 3,873

slc.onchange = function () {

    usrHandler(usrHandlerArg);

};
Ответить с цитированием
  #3 (permalink)  
Старый 23.09.2010, 14:31
Новичок на форуме
Отправить личное сообщение для мшеул Посмотреть профиль Найти все сообщения от мшеул
 
Регистрация: 23.09.2010
Сообщений: 7

Да, как показала проверка, в 'Лисе' все работает как надо... Мда. Надеюсь, что кто-нибудь кроме автора сюда се же заглянет
Ответить с цитированием
  #4 (permalink)  
Старый 23.09.2010, 14:35
Новичок на форуме
Отправить личное сообщение для мшеул Посмотреть профиль Найти все сообщения от мшеул
 
Регистрация: 23.09.2010
Сообщений: 7

Сообщение от Octane Посмотреть сообщение
slc.onchange = function () {

    usrHandler(usrHandlerArg);

};
Склеивание скобок было необходимо, чтобы функция не вызывалась при добавлении обработчика onchange а сохранилась как строка (кажется так). По предложенному варианту - спасибо, так, конечно, грамотнее, но проблема не в этом. (Хотя это не работало, если созданный элемент slc просто добавлять через appendChild() - отсюда пришлось использовать buf).

Последний раз редактировалось мшеул, 23.09.2010 в 14:39.
Ответить с цитированием
  #5 (permalink)  
Старый 23.09.2010, 14:49
Новичок на форуме
Отправить личное сообщение для мшеул Посмотреть профиль Найти все сообщения от мшеул
 
Регистрация: 23.09.2010
Сообщений: 7

var slc  = getSlc(slcParam);
				alert('slc name: '+slc.name);
				var buf = document.createElement('DIV');					//опять работа ушами... ну не хочет appendChild добавлять элемент нормально - событие почему-то записано нормально с функцией, а не срабатывает (при повторном добавлениии новых строк в уже существующую таблицу)				
				buf.appendChild(slc);
				alert('buf: '+buf.innerHTML);

Проблема в том, что в первом алерте свойство было, а во втором - уже нет. Форумчане, которые понимают в предмете - просьба помочь.
Ответить с цитированием
  #6 (permalink)  
Старый 27.09.2010, 10:11
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 26,855

function getSlc не проверок на наличие параметра при его добавлении кроме как if(slcParam.sFunct != undefined)
ещё мелочь )))
newCell.innerHTML = '&nbsp'+field2R.val[i]+'&nbsp';
надо
newCell.innerHTML = '&nbsp;'+field2R.val[i]+'&nbsp;';
и вариант может чем поможет )))
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
  <title></title>
</head>

<body>
<table id="tb" border="1">
  <tr>
    <td>1</td>
    <td>2</td>
  </tr>
  <tr>
    <td>3</td>
    <td>4</td>
  </tr>
</table>
<script language="JavaScript" type="text/javascript">
function getSlc(c) {
    var b = document.createElement("SELECT");
    if(c.id)b.id = c.id;
    if(c.name)b.name = c.name;
    if(c.options){for (var d = c.options.length, a = 0; a < d; a++) {
        b.options.length = a + 1;
        b.options[a].text = c.options[a][0];
        b.options[a].value = c.options[a][1];
        if (c.options[a][2]) b.options[a].isDefaultSelected = true;
        if (c.options[a][3]) b.options[a].selected = true
    }};
    if (c.onchange&&typeof c.onchange == "function") b.onchange = c.onchange;
    return b
};
//var slcParam ={id:'h3',name:'h3',options:[["Строка 1", 1],["Строка  2", 2],["Строка  3", 3,1,1]],onchange:function (){alert(this.value);}}
//document.body.appendChild(getSlc(slcParam))

function  getFFOptionsRow(table,i,field2R){
	var tablePreffiks = 'FF';
	var newRow = table.insertRow(-1);										//добавляем строку в созданной таблице
		newRow.className = 'tableData';
		newRow.id        = tablePreffiks+'tableData_'+field2R.key[i];
		//имя поля
		var newCell = newRow.insertCell(-1);								//в созданной строке добавляем столбец
			newCell.align     = 'right';									//указываем позиционирование по центру
			newCell.innerHTML = '&nbsp;'+field2R.val[i]+'&nbsp;';
		//тип фильтра
		var newCell = newRow.insertCell(-1);								//в созданной строке добавляем столбец
			newCell.align     = 'center';									//указываем позиционирование по центру
				var slcParam = {
									id    : 'field_'+field2R.key[i]+'_filter_type_slc',
									name  : 'field_'+field2R.key[i]+'_filter_type',
                                    onchange : function (){alert(this.name);},
                                    options:[["Строка 1", 1],["Строка  2", 2],["Строка  3", 3,1,1]]
								};
				var slc  = getSlc(slcParam);
				newCell.appendChild(slc);
}
var t= document.getElementById('tb');
var field2R={key:[1,2,3],val:[4,5,6]};
getFFOptionsRow(t,1,field2R)
</script>
</body>
</html>
Ответить с цитированием
  #7 (permalink)  
Старый 28.09.2010, 06:49
Новичок на форуме
Отправить личное сообщение для мшеул Посмотреть профиль Найти все сообщения от мшеул
 
Регистрация: 23.09.2010
Сообщений: 7

Сообщение от рони
и вариант может чем поможет )))
Спасибо за ответ и замечания. Уж и не надеялся, что к.-нибудь ответит. Попробую переписать код. По результатам отпишусь.
Ответить с цитированием
  #8 (permalink)  
Старый 28.09.2010, 08:50
Новичок на форуме
Отправить личное сообщение для мшеул Посмотреть профиль Найти все сообщения от мшеул
 
Регистрация: 23.09.2010
Сообщений: 7

проблема по-тихоньку решается
Как показали эксперименты проблема была в другом месте (как всегда в таких случаях).
//добавляет строку опций для полей фильтра, отчета, вычислений, объединенных вычислений
function appendFOptionsRow(destinationElementId,field2R){
	switch(destinationElementId){
		case 'result_field4filter_slc':
				var getOptionsTableHeader = getFFOptionsTableHeader;
				var getOptionsRow  = getFFOptionsRow;
				var refreshOptions = checked_values;
				var refreshOptionsArg = 'get_filter_button_id';
				var inDiv = 'result_field4filter_type_div';
			break;
		case 'result_field4report_slc':
				var getOptionsTableHeader = getRFOptionsTableHeader;
				var getOptionsRow  = getRFOptionsRow;
				var refreshOptions = refresh_option4r_field;
				var refreshOptionsArg = '';
				var inDiv = 'result_field4report_sort_div';
			break;
		case 'result_field4calc_slc':
				var getOptionsTableHeader = getCFOptionsTableHeader;
				var getOptionsRow  = getCFOptionsRow;
				var refreshOptions = '' ;
				var refreshOptionsArg = '';
				var inDiv = 'result_field4calc_type_div';
			break;
		case 'result_field4union_slc':
				var getOptionsTableHeader = getUFOptionsTableHeader;
				var getOptionsRow  = getUFOptionsRow;
				var refreshOptions = refreshUnionOption;			    //для соответствующих функций "включим" список разделителей
				var refreshOptionsArg = '';
				var inDiv = 'result_field4v_union_type_div';
			break;
		default:
			return;
	}
		var len = field2R.key.length;
		var buf = document.createElement("DIV");
		//ШАПКА или указатель на таблицу
		var r4table = getOptionsTableHeader(field2R);
			var mode  = r4table[0];
			var table = r4table[1];
		if ( len != 0 )	{
			for(var i=0; i<len; i+=1){
				//вставляем в i строку таблицы table значения  из массива field2R
				//alert ('строка: '+i+' key: '+field2R.key[i]+' val: '+field2R.val[i])
				getOptionsRow(table,i,field2R);
			}
		}else{
			return;
		}
		if ( mode == 'create' )	{
			buf.appendChild(table);
			document.getElementById(inDiv).innerHTML = buf.innerHTML;
		}
		if(refreshOptions != ''){
			refreshOptions(refreshOptionsArg);								//обновим видимость опций полей в зависимости от типа КО
		}
}

Просьба не пинать за представленный код, а предложить пути по улучшению(если есть желание и смотреть на него без слез не можете ).
Проблема была в том что, при добавлении в таблицу первой строки функцией getOptionsRow(table,i,field2R); таблица создавалась только одновременно с ней, висела в памяти, но на форму не добавлялась. Первая же строка с селектами добавлялась в table-объект в памяти (table=createElement('table')), но не объект на документе document.getElementById('ид таблицы'). Только после добавления первой строки таблица добавлялась на страницу. Строка появлялась, но функции и свойство name не включались в объект select (id почему-то появлялось). Последующие же строки уже добавлялись в table=document.getElementById('ид таблицы'). Понимаю, объяснять я мастер , но как умею... Спасибо все, кто откликнулся. Надеюсь кому-то этот топик поможет избежать таких же ошибок. После выложу исправленную версию.
Ответить с цитированием
  #9 (permalink)  
Старый 28.09.2010, 13:25
Новичок на форуме
Отправить личное сообщение для мшеул Посмотреть профиль Найти все сообщения от мшеул
 
Регистрация: 23.09.2010
Сообщений: 7

Смех сквозь слезы... Все вышеуказанное почти заработало. Но... под Лисой. Под Осликом slcParam.name='имя селекта' не хочет работать. Но почему-то работает так slcParam['NAME']='имя селекта'. Селект возвращается функцией getSlc()... Будем разбираться...
Ответить с цитированием
Ответ



Опции темы Искать в теме
Искать в теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Проблема при подстановке значений royksopp Общие вопросы Javascript 1 11.07.2010 17:20
Проблема при использовании 2 эффектов одновременно progressive jQuery 1 02.06.2010 00:39
Проблема при инициализации событий sms9 Events/DOM/Window 2 21.01.2010 21:14
Выделение текста при использовании слайдера x00xer Firefox/Mozilla 8 29.09.2009 06:45
Проблема в document.write при использовании setInterval() GOll Общие вопросы Javascript 21 06.10.2008 16:38