Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 26.04.2013, 00:56
Интересующийся
Отправить личное сообщение для Жекаизжека Посмотреть профиль Найти все сообщения от Жекаизжека
 
Регистрация: 26.04.2013
Сообщений: 18

checkbox и textarea
Ребят ситуация такая, есть N - число checkbox-ов и одно поле textarea. Суть в том, чтобы при выборе checkbox значение(value) добавлялось в textarea через "," , а если галочка снята,то удалялось. Можете помочь решить такую задачку
Ответить с цитированием
  #2 (permalink)  
Старый 26.04.2013, 02:39
Интересующийся
Отправить личное сообщение для Жекаизжека Посмотреть профиль Найти все сообщения от Жекаизжека
 
Регистрация: 26.04.2013
Сообщений: 18

вот сварганил, только не могу сделать условие, если галки нет, то удалялась строчка

<html> 
<body> 
<textarea id = "postarea"  rows = "5" cols = "120" name = "txt"></textarea> 
<input type="checkbox" onchange="javascript:tag_add(postarea, '{$brand->image}', ';')"/><img src='../files/brands/{$brand->image}' >
</body> 

<script> 
function tag_add(obj, str1, str2) {  
    if(document.selection) {                                               // Для IE 
        var s = document.selection.createRange(); 
        if (s.text) { 
            s.text = str1 + s.text + str2 
        } 
    } else {                                                               // Opera, FireFox, Chrome 
        var start = obj.selectionStart; 
        var end = obj.selectionEnd; 
        s = obj.value.substr(start,end-start); 
        obj.value = obj.value.substr(0, start) + str1 + s + str2 + obj.value.substr(end) 
    } 
} 
</script> 
</html>
Ответить с цитированием
  #3 (permalink)  
Старый 26.04.2013, 11:20
Аватар для rgl
rgl rgl вне форума
Профессор
Отправить личное сообщение для rgl Посмотреть профиль Найти все сообщения от rgl
 
Регистрация: 28.02.2011
Сообщений: 337

Так, что ли?
<html> 
<body> 
<textarea id = "postarea"  rows = "5" cols = "120" name = "txt"></textarea>
<br><br>
<input type="checkbox" onchange="tag_add(postarea, 'one', this.checked)"/>one<br>
<input type="checkbox" onchange="tag_add(postarea, 'two', this.checked)"/>two<br>
<input type="checkbox" onchange="tag_add(postarea, 'three', this.checked)"/>three<br>

<script> 
function tag_add(obj, str, add) { 
  if( add ) {
    if( obj.value ) {
      if( obj.value.indexOf( str) < 0 )
        obj.value += ";" + str;
    } else {
      obj.value = str;
    }
  } else {
    var re = new RegExp( "(;)?"+str+"(;)?" );
    obj.value = obj.value.replace( re, function( x, l, r ){ return l && r ? ";" : ""; } );
  }
} 
</script> 
</body>
</html>
Ответить с цитированием
  #4 (permalink)  
Старый 26.04.2013, 12:14
Интересующийся
Отправить личное сообщение для Жекаизжека Посмотреть профиль Найти все сообщения от Жекаизжека
 
Регистрация: 26.04.2013
Сообщений: 18

да, оно самое, а могли бы еще один момент подсказать, если в textarea уже есть текст со значение 'one', 'two', тогда бы checkbox был бы с галкой, а если нет значения то нет галки

что то вроде этого

<html>
<body>
<textarea id = "postarea"  rows = "5" cols = "120" name = "txt">one;two</textarea>

<br><br>
<input type="checkbox" onchange="tag_add(postarea, 'one', this.checked)"/>one<br>
<input type="checkbox" onchange="tag_add(postarea, 'two', this.checked)"/>two<br>
<input type="checkbox" onchange="tag_add(postarea, 'three', this.checked)"/>three<br>
 
<script>
function tag_add(obj, str, add) {
  if( add ) {
    if( obj.value ) {
      if( obj.value.indexOf( str) < 0 )
        obj.value += ";" + str;
    } else {
      obj.value = str;
    }
  } else {
    var re = new RegExp( "(;)?"+str+"(;)?" );
    obj.value = obj.value.replace( re, function( x, l, r ){ return l && r ? ";" : ""; } );
  }
}

</script>
</body>
</html>
Ответить с цитированием
  #5 (permalink)  
Старый 26.04.2013, 14:30
Аватар для ksa
ksa ksa вне форума
CacheVar
Отправить личное сообщение для ksa Посмотреть профиль Найти все сообщения от ksa
 
Регистрация: 19.08.2010
Сообщений: 14,118

Как вариант...

<!DOCTYPE html>
<html>
<head>
<script src="http://code.jquery.com/jquery-latest.js"></script>
<!--
<link rel="stylesheet" type="text/css" href="tmp.css" />
-->
<style type="text/css">
label {
	display: block;
}
</style>
<script type="text/javascript">
$(document).ready(function (){
	$('#options input:checkbox').change(function (){
		setValue();
	});
	loadData();
});
function setValue(){
	var dlm='';
	var val='';
	$('#options input:checkbox').each(function (){
		if (!this.checked) return;
		val=val+dlm+this.value;
		dlm=';';
	});
	$('#txt').val(val);
};
function loadData(){
	var a=$('#txt').val();
	a=a.split(';');
	for (i=0; i<a.length; i++) {
		$('input[value="'+a[i]+'"]').attr('checked',true);
	};
}; 
</script>
</head>
<body>
<div>
	<textarea id='txt'  rows = "5" cols = "120" name = "txt">one;two</textarea>
</div>
<div id='options'>
	<label>
		<input type="checkbox" value='one' onchange="test();"/>one
	</label>
	<label>
		<input type="checkbox" value='two' onchange="test();"/>two
	</label>
	<label>
		<input type="checkbox" value='three' onchange="test();"/>three
	</label>
</div>
</body>
</html>
Ответить с цитированием
  #6 (permalink)  
Старый 26.04.2013, 16:09
Интересующийся
Отправить личное сообщение для Жекаизжека Посмотреть профиль Найти все сообщения от Жекаизжека
 
Регистрация: 26.04.2013
Сообщений: 18

то что надо, спасибо большое
Ответить с цитированием
  #7 (permalink)  
Старый 26.04.2013, 18:38
Аватар для rgl
rgl rgl вне форума
Профессор
Отправить личное сообщение для rgl Посмотреть профиль Найти все сообщения от rgl
 
Регистрация: 28.02.2011
Сообщений: 337

А в чем смысл таких действий на клиенте? Начальный текст известен на сервере, значит там и добавить куда надо checked
Ответить с цитированием
  #8 (permalink)  
Старый 27.04.2013, 20:58
Интересующийся
Отправить личное сообщение для Жекаизжека Посмотреть профиль Найти все сообщения от Жекаизжека
 
Регистрация: 26.04.2013
Сообщений: 18

есть более 60 чекбоксов с разными параметрами для клиента, которые храняться в базе данных, чтобы не горадить кучу ячеек для каждого чекбокса, решил запихнуть их в одну ячейку, поле textarea скрыто от пользователя
Ответить с цитированием
  #9 (permalink)  
Старый 28.04.2013, 02:42
Интересующийся
Отправить личное сообщение для Жекаизжека Посмотреть профиль Найти все сообщения от Жекаизжека
 
Регистрация: 26.04.2013
Сообщений: 18

rgl, можешь помочь еще в одном моменте, как разбить данные(разделенные ; ) из ячейки и сгенерировать переключатели (radiobutton) с value значениями, чтобы создалось такое же количество переключателей.
Делал через split как то не выщло (
Ответить с цитированием
  #10 (permalink)  
Старый 29.04.2013, 08:27
Аватар для ksa
ksa ksa вне форума
CacheVar
Отправить личное сообщение для ksa Посмотреть профиль Найти все сообщения от ksa
 
Регистрация: 19.08.2010
Сообщений: 14,118

Сообщение от Жекаизжека
как разбить данные(разделенные ; )
..
Делал через split как то не выщло (
Бивас, тест! (с)

var a='1;2;3;4;5';
a=a.split(';');
alert(a);

Таки работает...
Ответить с цитированием
Ответ


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

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


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Синхронизация textarea и checkbox georg Элементы интерфейса 17 06.02.2013 19:19
checkbox = checkbox Слейп jQuery 2 30.01.2013 15:24
Не могу получить состояние checkbox-а POMAH-UST Элементы интерфейса 2 08.10.2012 07:43
jqgrid tree and checkbox gaz2003 jQuery 0 17.12.2011 15:59
Функция disable для нескольких checkbox allforweb Элементы интерфейса 4 19.12.2010 17:51