ReSQL.ru
     
powered by simpleCommunicator - 2.0.59     © 2025 Programmizd 02
Мобильная версия    Контакт    Правила    FAQ    Помощь
Целевая тема:
Создать новую тему:
Автор:
Закрыть
Цитировать
Доб. в избранное | Игнор. тему | Прикреп. тему | Пометить прочит. / непрочит. | Фильтр
Форумы / HTML, JavaScript, VBScript, CSS [игнор отключен] [закрыт для гостей] / алтернатива вместо текстового поля + HTML
25 сообщений из 35, страница 1 из 2
  1  все
алтернатива вместо текстового поля + HTML
    #34726215
Фотография michael R
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
michael R
Участник
есть на странице много текстовых полей по 1000 штук

(разбивка постраничная меньше 1000 на страницу не могу только больше)

в эти текстовые поля вносится информация и она же проверяется сразу же через JavaScript

из-за того что много текстовых полей страница грузится долго (14 сек)
но если не использовать type=text а только TD то загрузка мгновенная

как найти алтернативу текстовому полю с той же функциональностью
или как ускорить загрузку

Спасибо
...
Рейтинг: 0 / 0
14.08.2007, 12:56
| Ответить | Цитировать | Написать  
алтернатива вместо текстового поля + HTML
    #34726575
Блок А.Н.
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Блок А.Н.
Участник
А какую функциоанльность вы используете?
Редактирование?
Может, сделать на какое-нибудь onclick вставку в ячейку поля input
Если поиграться со стилями, можно попробовать это сделать незаметно, особенное если браузер заранее определен.
...
Рейтинг: 0 / 0
14.08.2007, 14:05
| Ответить | Цитировать | Написать  
алтернатива вместо текстового поля + HTML
    #34726680
Фотография krvsa
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
krvsa
Участник
michael R , а что потом делаете с введеной информацией?

Мне пока нравится вариант "вычитывания" информации, потом её правка (хоть через промпт), проверка...
----------
Cache for Windows NT (Intel) 5.0.20 (Build 6305) Fri Sep 16 2005 11:54:10 EDT
...
Рейтинг: 0 / 0
14.08.2007, 14:28
| Ответить | Цитировать | Написать  
алтернатива вместо текстового поля + HTML
    #34726837
Фотография michael R
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
michael R
Участник
информация вносится как текст из sql + XML+ XSLT+ HTML
и потом возможно исправляется при этом происходит проверка
или число или текст опредлённого вида...
а потом записывается обратно


Блок А.Н.
мне интересно как производить на onclick вставку в ячейку поля input
можно ли какой-нибудь пример со стилями
...
Рейтинг: 0 / 0
14.08.2007, 14:56
| Ответить | Цитировать | Написать  
алтернатива вместо текстового поля + HTML
    #34726890
Фотография krvsa
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
krvsa
Участник
michael R , а такое будет долго грузиться?
Код: plaintext
1.
2.
3.
...
<a href='javascript:Input("текст")'>текст</a>
...
----------
Cache for Windows NT (Intel) 5.0.20 (Build 6305) Fri Sep 16 2005 11:54:10 EDT
...
Рейтинг: 0 / 0
14.08.2007, 15:11
| Ответить | Цитировать | Написать  
алтернатива вместо текстового поля + HTML
    #34726951
Фотография michael R
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
michael R
Участник
функция Input что делает
хотя в принципе можно и без линка только на onclick
...
Рейтинг: 0 / 0
14.08.2007, 15:24
| Ответить | Цитировать | Написать  
алтернатива вместо текстового поля + HTML
    #34727177
Фотография krvsa
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
krvsa
Участник
michael Rфункция Input что делает
Вот она-то и будет выполнять редактирование произвольного текста, проверку и запись в БД...
...
Рейтинг: 0 / 0
14.08.2007, 16:09
| Ответить | Цитировать | Написать  
алтернатива вместо текстового поля + HTML
    #34727233
Фотография michael R
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
michael R
Участник
а вносить текст как
через prompt или ещё одно окно не годится

нужно встраивать в TD текстовое поле как будто оно там и было
с размерами и другими атрибутами
а при потере фокуса чтобы результат сохранялся в TD и поле изчезало
сами TD должны выглядет как текстовые поля выделенный прямоугольник

вопрос как
...
Рейтинг: 0 / 0
14.08.2007, 16:22
| Ответить | Цитировать | Написать  
алтернатива вместо текстового поля + HTML
    #34727301
Фотография Antonariy
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Antonariy
Участник
michael Rвопрос какСам же совершенно правильно написал, что нужно делать. Что вызывает затруднение?
...
Рейтинг: 0 / 0
14.08.2007, 16:37
| Ответить | Цитировать | Написать  
алтернатива вместо текстового поля + HTML
    #34727305
Фотография krvsa
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
krvsa
Участник
michael Rа вносить текст как
через prompt или ещё одно окно не годится
Это уже на ваше усмотрение... Хотите промптом... Хотите окном...
...
Рейтинг: 0 / 0
14.08.2007, 16:38
| Ответить | Цитировать | Написать  
алтернатива вместо текстового поля + HTML
    #34727415
Фотография michael R
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
michael R
Участник
Antonariy Сам же совершенно правильно написал, что нужно делать. Что вызывает затруднение?


ну для начала стили чтобы были одинаковые для разных браузеров
как текстовые поля
...
Рейтинг: 0 / 0
14.08.2007, 17:03
| Ответить | Цитировать | Написать  
алтернатива вместо текстового поля + HTML
    #34727439
Фотография Antonariy
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Antonariy
Участник
Это - для конца. Для начала сделай невидимый див с position:absolute и инпутом внутри с width:100%, который по даблклику по ячейке пудет отображаться над ней, принимая ее размеры.
...
Рейтинг: 0 / 0
14.08.2007, 17:10
| Ответить | Цитировать | Написать  
алтернатива вместо текстового поля + HTML
    #34727480
Блок А.Н.
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Блок А.Н.
Участник
Факир был пьян, но фокус вроде бы удался:
нужно еще отработать моменты переполнения ячеек, обработку Enter,Tab.
Стилями не получилось задавить отступ внутри input, так что чтобы не дергало, нужно делать ячейки чуть больше, чем нужно.
Если игра стоит свеч, все это можно отработать.

Проверял в опере9 и ие6
Код: plaintext
1.
2.
3.
4.
5.
6.
7.
8.
9.
10.
11.
12.
13.
14.
15.
16.
17.
18.
19.
20.
21.
22.
23.
24.
25.
26.
27.
28.
29.
30.
31.
32.
33.
34.
35.
<html>
<head>
<style>
table#tt {border:outset 2px;background:white;border-collapse:collapse;}
table#tt td,th{border:1px inset;height:25px;}
table#tt input{background-color:red;width: 100 %;border:none;}
table#tt input,td {font-family:tahoma;font-size:14px;}
</style>
<script language=javascript>
function insertINPUT()
{if (event.srcElement.tagName!='TD') return;
 var td=event.srcElement;
 var txt=td.innerText; td.innerText='';
 var inp=document.createElement('input');
 td.appendChild(inp);
 inp.value=txt;
 inp.onblur=destroyInput;
 inp.focus();
}
function destroyInput()
{this.parentNode.innerHTML=this.value;
}
</script>
</head>

<body>
<table onclick=insertINPUT() id=tt style='width:50%'>
<tr><th style='width:20%'>head1<th style='width:20%'>head2<th style='width:60%'>head3
<tr><td> 1 <td> 2 <td> 3 
<tr><td> 11 <td> 22 <td> 33 
<tr><td>wert
</table>

</body>
</html>
...
Рейтинг: 0 / 0
14.08.2007, 17:24
| Ответить | Цитировать | Написать  
алтернатива вместо текстового поля + HTML
    #34727487
ambarka_max
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
ambarka_max
Участник
Не совсем понятно как предполагается обновлять данные в БД
...
Рейтинг: 0 / 0
14.08.2007, 17:25
| Ответить | Цитировать | Написать  
алтернатива вместо текстового поля + HTML
    #34727518
Блок А.Н.
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Блок А.Н.
Участник
Ну, автор это как-то собирался делать при 1000 INPUT. Что меняется при тысячах TD?
...
Рейтинг: 0 / 0
14.08.2007, 17:32
| Ответить | Цитировать | Написать  
алтернатива вместо текстового поля + HTML
    #34727564
Фотография michael R
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
michael R
Участник
внесение в базу через asp
генерится xml через цикл по всем нужным (изменённым) данным из таблицы
и отправляется через submit
это у меня сделано
через TD или INPUT это уже не важно

проблема именно загрузка страницы


Блок А.Н.
спасибо за код
попробую поиграться
...
Рейтинг: 0 / 0
14.08.2007, 17:47
| Ответить | Цитировать | Написать  
алтернатива вместо текстового поля + HTML
    #34727732
Фотография michael R
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
michael R
Участник
авторПроверял в опере9 и ие6

в Mozell-е не работает
и дергаются TD
...
Рейтинг: 0 / 0
14.08.2007, 19:01
| Ответить | Цитировать | Написать  
алтернатива вместо текстового поля + HTML
    #34727892
Блок А.Н.
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Блок А.Н.
Участник
Дергаются прямо в моем примере?
Или когда данные не влазят?
Есть вариант принудительно фиксировать в пикселях размер ячейки перед созданием INPUT

В IE и опере у меня дергались (когда место есть) примерно на один пиксель, да и то, только внутри ячейки, этим можно пренебречь.
Мозиллы нет, проверить не могу, где там ошибка, возможно appendChild не работает, IE7,IE6,Opera9 - работает, вроде ровно
...
Рейтинг: 0 / 0
14.08.2007, 21:48
| Ответить | Цитировать | Написать  
алтернатива вместо текстового поля + HTML
    #34727990
Фотография michael R
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
michael R
Участник
в Mozille проблема с events(я думаю что смогу это решить)
дёргание когда нет места input всегда застовляет раздвигаться TD
...
Рейтинг: 0 / 0
14.08.2007, 23:38
| Ответить | Цитировать | Написать  
алтернатива вместо текстового поля + HTML
    #34728122
Блок А.Н.
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Блок А.Н.
Участник
Скажите, как вам это нужно решить?
Если просто спрятать - то можно на TD в стилях сделать overflow:hiden
...
Рейтинг: 0 / 0
15.08.2007, 06:30
| Ответить | Цитировать | Написать  
алтернатива вместо текстового поля + HTML
    #34729011
Фотография michael R
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
michael R
Участник
сделал так
но есть ряд вещей которые хотелось бы исправить

1 не вешать обратотчики событий на каждый обьект а один общий
проблема не работает events в Mozille

2 установить текст в input-е по центру как в TD
если TD широкий

3 если выделять мышкой весь TD чтобы сразу брался input с выделеный текстом


Код: plaintext
1.
2.
3.
4.
5.
6.
7.
8.
9.
10.
11.
12.
13.
14.
15.
16.
17.
18.
19.
20.
21.
22.
23.
24.
25.
26.
27.
28.
29.
30.
31.
32.
33.
34.
35.
36.
37.
38.
39.
40.
41.
42.
43.
44.
45.
46.
47.
48.
49.
50.
51.
52.
53.
54.
55.
56.
57.
58.
59.
60.
61.
62.
63.
64.
65.
66.
67.
68.
69.
70.
71.
72.
73.
74.
75.
76.
77.
78.
79.
80.
81.
<html>
<head>
<style>

.xx{border:1px inset;}
 
</style>
<script language=javascript>
var lastid
var lasttext

function InType(obj)
{
 var x= getElementPosition(obj.id)
 lasttext=document.getElementById(obj.id).innerHTML
 lastid=obj.id
 document.getElementById("A1").width=document.getElementById(obj.id).offsetWidth- 1 
 document.getElementById("A1").height=document.getElementById(obj.id).offsetHeight- 1 
 document.getElementById("A2").style.width=document.getElementById(obj.id).offsetWidth
 document.getElementById("A2").style.height=document.getElementById(obj.id).offsetHeight
 document.getElementById("A1").style.top=x.top
 document.getElementById("A1").style.left=x.left
 document.getElementById("A2").value=document.getElementById(obj.id).innerHTML
 document.getElementById("A1").style.visibility="visible"
 document.getElementById("A1").style.display=""
 document.getElementById("A2").focus()
}

function getElementPosition(elemID) {
    var offsetTrail = document.getElementById(elemID);
    var offsetLeft =  0 ;
    var offsetTop =  0 ;
    while (offsetTrail) {
        offsetLeft += offsetTrail.offsetLeft;
        offsetTop += offsetTrail.offsetTop;
        offsetTrail = offsetTrail.offsetParent;
    }
    if (navigator.userAgent.indexOf("Mac") != - 1  && 
        typeof document.body.leftMargin != "undefined") {
        offsetLeft += document.body.leftMargin;
        offsetTop += document.body.topMargin;
    }
    return {left:offsetLeft, top:offsetTop};
}

function CloseInput()
 {
   document.getElementById(lastid).innerHTML=document.getElementById("A2").value  //lasttext 
   document.getElementById("A1").style.visibility="hidden"
   document.getElementById("A1").style.display="none"
 }
 

</script>
</head>

<body>
<table >
<tr>
	<td id="td1" class="xx" onclick="InType(this)" ondrag="InType(this)" ondrop="InType(this)">dsad1</td>
	<td id="td2" class="xx" onclick="InType(this)" ondrag="InType(this)" ondrop="InType(this)">asd2</td>
	<td id="td3" class="xx" onclick="InType(this)" ondrag="InType(this)" ondrop="InType(this)">asdsa3</td>
<tr>
</tr>
	<td id="td4" class="xx" onclick="InType(this)" ondrag="InType(this)" ondrop="InType(this)">dfd1</td>
	<td id="td5" class="xx" onclick="InType(this)" ondrag="InType(this)" ondrop="InType(this)">fd1</td>
	<td id="td6" class="xx" onclick="InType(this)" ondrag="InType(this)" ondrop="InType(this)">dsf1</td>
</tr>
<tr>
	<td id="td7" class="xx" onclick="InType(this)" ondrag="InType(this)" ondrop="InType(this)">sdsadsa1</td>
	<td id="td8" class="xx" onclick="InType(this)" ondrag="InType(this)" ondrop="InType(this)">asdsa2</td>
	<td id="td9" class="xx" onclick="InType(this)" ondrag="InType(this)" ondrop="InType(this)">asdsada3</td>
<tr>

</table>

<div id="A1" style="position:absolute;visibility:hidden;display:none;border:none;">
	<input id="A2" onblur="CloseInput()"  type="text" width="100%" height="100%" value="" />
</div>
<input type="button"/>
</body>
</html>
...
Рейтинг: 0 / 0
15.08.2007, 12:33
| Ответить | Цитировать | Написать  
алтернатива вместо текстового поля + HTML
    #34729458
Фотография Antonariy
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Antonariy
Участник
Наслаждайтесь...
...
Рейтинг: 0 / 0
15.08.2007, 14:07
| Ответить | Цитировать | Написать  
алтернатива вместо текстового поля + HTML
    #34729475
LINUXER
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
LINUXER
Участник
michael R class="xx" onclick="InType(this)" ondrag="InType(this)" ondrop="InType(this)"
*1000
michael Rсделал так
но есть ряд вещей которые хотелось бы исправить

1 не вешать обратотчики событий на каждый обьект а один общий
проблема не работает events в Mozille

2 установить текст в input-е по центру как в TD
если TD широкий

3 если выделять мышкой весь TD чтобы сразу брался input с выделеный текстом

Код: plaintext
1.
2.
3.
4.
5.
6.
7.
8.
9.
10.
11.
12.
13.
14.
15.
16.
17.
18.
19.
20.
21.
22.
23.
24.
25.
26.
27.
28.
29.
30.
31.
32.
33.
34.
35.
36.
37.
38.
39.
40.
41.
<html>
<head>
<style>
table#tt {border:outset 2px;background:white;border-collapse:collapse;}
table#tt td,th{border:1px inset;height:25px;}
table#tt input{background-color:red;width: 100 %;border:none;}
table#tt input,td {font-family:tahoma;font-size:14px;text-align:center}
</style>
<script language=javascript>
function insertINPUT(e)
{var td=(e.target||window.event.srcElement);

 if (td.tagName!='TD') return;
 var txt=td.innerHTML; 
 var inp=document.createElement('input');
 inp.value=txt;
 inp.onblur=destroyInput;

 var sel=window.getSelection ? getSelection() : document.selection.createRange().text;
 sel+="";

 td.innerHTML='';
 td.appendChild(inp);
 inp.focus();
 if(sel.length> 0 )inp.select()
}
function destroyInput()
{this.parentNode.innerHTML=this.value;
}
</script>
</head>

<body>
<table onmouseup=insertINPUT(event) id=tt style='width:50%'>
<tr><th style='width:20%'>head1<th style='width:20%'>head2<th style='width:60%'>head3
<tr><td> 1 <td> 2 <td> 3 
<tr><td> 11 <td> 22 <td> 33 
<tr><td>wert
</table>

</body>
</html>
Было бы красиво чтобы селекшн в точности переносился в поле. Не сообразил как можно:\
...
Рейтинг: 0 / 0
15.08.2007, 14:11
| Ответить | Цитировать | Написать  
алтернатива вместо текстового поля + HTML
    #34729713
Блок А.Н.
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Блок А.Н.
Участник
Хм, у Antonary ничего так...
Только двойной клик раздражает

to michael R
1.так вешается обработчик на таблицу+поле редактирования. Разве это много?
2. Что не атк в моем примере?
3. Вроде выделяет и копирует. Дело в том, что при потере фокуса инпут уничтожается и выделяется просто таблица. То есть как бйдто так.

Там чтобы не дергало с большим тестом, нужно установить через стили nowrap,
white-space: nowrap

А селекшн можно подуматьь. И позицию курсора. Или можно на onmouseover тоже делать подстановку инпута
...
Рейтинг: 0 / 0
15.08.2007, 15:13
| Ответить | Цитировать | Написать  
алтернатива вместо текстового поля + HTML
    #34729791
Фотография michael R
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
michael R
Участник
ребята у всех просто супер

только у Antonariy в Mozille не работают события
и всё таки хотелось центрировать текст в input как в TD

мне ещё надо будет делать проверки на разные текстовые поля свои (текст число ...)
но это я буду делать сам

разница во времени загрузки страницы колоссальная
особенно для большого кол-ва


LINUXER спасибо за обработчик событий для разных браузеров
не допёр добавить event в <table> он у меня был null
для селекшн есть selStart selLength поиграюсь с ними


Огромное всем спасибо
...
Рейтинг: 0 / 0
15.08.2007, 15:28
| Ответить | Цитировать | Написать  
25 сообщений из 35, страница 1 из 2
  1  все
Форумы / HTML, JavaScript, VBScript, CSS [игнор отключен] [закрыт для гостей] / алтернатива вместо текстового поля + HTML
Найденые пользователи ...
Разблокировать пользователей ...
Читали тему (0):
Читали форум (0):
Пользователи онлайн (0):
Польз. соглашение
NoSQL.ru       Новости, Чат       Фотоальбом: Участники, Встречи
Закрыть
start [/forum/topic.php?fid=22&msg=34727233&tid=1457760]:
 0ms
get settings:
 9ms
get forum list:
 13ms
check forum access:
 3ms
check topic access:
 3ms
track hit:
 161ms
get topic data:
 11ms
get forum data:
 3ms
get page messages:
 59ms
get tp. blocked users:
 1ms
others: 14ms
total:  277ms
созд. / загр.: 277ms
x
x
Закрыть


Просмотр
0 / 0
Close
Debug Console [Select Text]