Javascript-форум (https://javascript.ru/forum/)
-   jQuery (https://javascript.ru/forum/jquery/)
-   -   Операции с текстом по умолчанию в textarea (https://javascript.ru/forum/jquery/23051-operacii-s-tekstom-po-umolchaniyu-v-textarea.html)

n1ko 10.11.2011 08:04

Операции с текстом по умолчанию в textarea
 
Доброе утро! Помогите, пожалуйста, решить следующий вопрос.
<script>
    $(document).ready(function(){
        
        $('.fixBlock.edit input:button').attr('disabled', 'disabled');
        $('.fixBlock.edit textarea').attr('disabled', 'disabled');
        $('span.editTitle').click(function(){
            $('.fixBlock.edit').fadeTo('200', 1).find('input:button').removeAttr('disabled').parent().find('textarea').removeAttr('disabled');
            $('.fixBlock.edit textarea').text($(this).text());
            $('.fixBlock.edit input[name=editId]').val($(this).parent().find('input:checkbox').attr('value'));
        });
        $('.fixBlock.edit :button[name=cancelEdit]').click(function(){
            $('.fixBlock.edit').fadeTo('400', 0.2);
            $('.fixBlock.edit textarea').empty().attr('disabled', 'disabled');
            $('.fixBlock.edit input[name=editId]').val('');
            $('.fixBlock.edit input:button').attr('disabled', 'disabled');
        });
        
    });
</script>


Заголовок
<div class="clTitle">
    <input type="checkbox" name="category" value="32" />
    <span class="editTitle">Заголовок</span>
    <a class="add"><div></div></a>
</div>

Окно
<div class="fixBlock edit">
    <div><textarea name="editName"></textarea></div>
    <input type="button" name="edit" value="Сохранить" />
    <input type="button" name="cancelEdit" value="Отменить" />
    <input type="hidden" name="editId" value="" />
</div>


Сам вопрос насчёт $('span.editTitle').click(function().
Всё работает исправно. Кликая на заголовок, окошко проявляется и подставляются значения в форму. Кликая на второй заголовок, всё успешно меняется на новые параметры. Вопрос вот в чём. Если я отредактирую текст в форме (ну добавлю точку), то кликая на другой заголовок, в форму новые параметры не подставляются. Так же с кнопкой "отмена". Когда я в поле не редактирую текст, то при клике на кнопку текст удаляется и форма блокируется, если я отредактирую значения, то форма блокируется, а текст не уходит.

Задача изначально была такой:
Кликая на один из заголовков "поднимаем" окно и заполняем его данными. При нажатии на другой заголовок заменять в форме данные на новые. Нажимая на "Отменить" удалять все данные и "опускать" окно.

Буду благодарен за помощь. Спасибо!

ksa 10.11.2011 08:54

Опять какие-то огрызки... :( Научитесь уже делать полные примеры.

n1ko 10.11.2011 13:36

Так я привёл весь код, задействованный в работе. Ну а если нужен полный полный пример, то вот:
<?php
defined('_JEXEC') or die('Restricted access');
$doc = & JFactory::getDocument();
$doc->addStyleSheet('components/com_catalog/files/css/main.css');
$doc->addScript('components/com_catalog/files/js/jquery-1.7.min.js');
?>
<script>
    $(document).ready(function(){
        tools();
        
        $('a.add').hover(
            function(){$(this).find('div').stop().animate({opacity: '1'}, 200);}, 
            function(){$(this).find('div').stop().animate({opacity: '0'}, 200);}
        );
        
        $(':checkbox[name=category]').click(function(){
            if($(this).is(':checked')) {
                $(this).parent().parent().find('ul li input:checkbox[name=subcategory]').attr('checked', 'checked').attr('disabled', 'disabled');
            } else {
                $(this).parent().parent().find('ul li input:checkbox[name=subcategory]').removeAttr('checked').removeAttr('disabled');
            }
            tools();
        });
        
        $(':checkbox[name=subcategory]').click(function(){
            tools();
        });
        
        function tools() {
            var numCategory = $(':checkbox[name=category]:checked').length;
            var numSubCategory = $(':checkbox[name=subcategory]:checked').length;
            if(numCategory > 0 || numSubCategory > 0) {
                $('.fixBlock.tools').fadeTo('200', 1).find('input:button').removeAttr('disabled');
            } else {
                $('.fixBlock.tools').fadeTo('400', 0.2).find('input:button').attr('disabled', 'disabled');
            }
        }
        
        $('.fixBlock.edit input:button').attr('disabled', 'disabled');
        $('.fixBlock.edit textarea').attr('disabled', 'disabled');
        $('span.editTitle').click(function(){
            $('.fixBlock.edit').fadeTo('200', 1).find('input:button').removeAttr('disabled').parent().find('textarea').removeAttr('disabled');
            $('.fixBlock.edit textarea').text($(this).text());
            $('.fixBlock.edit input[name=editId]').val($(this).parent().find('input:checkbox').attr('value'));
        });
        $('.fixBlock.edit :button[name=cancelEdit]').click(function(){
            $('.fixBlock.edit').fadeTo('400', 0.2);
            $('.fixBlock.edit textarea').empty().attr('disabled', 'disabled');
            $('.fixBlock.edit input[name=editId]').val('');
            $('.fixBlock.edit input:button').attr('disabled', 'disabled');
        });
        
    });
</script>

<form method="post" action="index.php">
    <div class="comWrapper comTable">
        <?php
        $cellInRow = '0';
        foreach($this->data as $group) {
        ?>
        <?php echo ($cellInRow == '0') ? '<div class="comTableRow">' : ''; ?>
        <div class="comTableCell">
            <div class="specList">
                <div class="clTitle">
                    <input type="checkbox" name="category" value="<?php echo $group->id; ?>" />
                    <span class="editTitle"><?php echo $group->category; ?></span>
                    <a class="add"><div></div></a>
                </div>
                <?php echo $this->model->subcategory($group->subcategory); ?>
            </div>
        </div>
        <?php
        $cellInRow++;
        if($cellInRow == '3') {echo '</div>'; $cellInRow = '0';}
        } 
        ?>
    </div>
    
    <input type="hidden" name="option" value="com_catalog" />
    <input type="hidden" name="task" value="" />
    <input type="hidden" name="view" value="structure" />
    <input type="hidden" name="layout" value="default" />
    
    <div class="fixBlock edit">
        <div><textarea name="editName"></textarea></div>
        <input type="button" name="edit" value="Сохранить" />
        <input type="button" name="cancelEdit" value="Отменить" />
        <input type="hidden" name="editId" value="" />
    </div>
    <div class="fixBlock tools">
        <input type="button" name="delete" value="Удалить" />
        <input type="button" name="publicToggle" value="Изменить состояние" />
    </div>
    
    
</form>

Только это слой с вида (компонент для Joomla)

ksa 10.11.2011 13:38

Опять эти ПХПисты... :D Ты думаешь мне твоё ПХП сдалось?

n1ko 10.11.2011 14:44

Было сказано "полный пример". Я привёл полный пример, что опять не так.
Спасибо - помог разобраться знакомый. Удачи Вам!

ksa 10.11.2011 14:49

Цитата:

Сообщение от n1ko
Я привёл полный пример, что опять не так

Это не раздел с ПХП. Поймите наконец, что есть и другие серверные языки... :) А объединяет нас - хтмл и JS...

n1ko 10.11.2011 14:57

/facepalm
никто про PHP не спрашивал.. вопрос про HTML и jQuery... php можно интерпретировать как сторонний текст....

ksa 10.11.2011 14:58

n1ko, твоя проблема - тебе и видней...


Часовой пояс GMT +3, время: 06:23.