JQuery заменить каждый вход с его значением. затем переключите / переключите обратно на наличие входов - PullRequest
Новая
       4

JQuery заменить каждый вход с его значением. затем переключите / переключите обратно на наличие входов

2 голосов
/ 03 декабря 2010

У меня есть таблица, созданная AJAX-запросом.Каждый из TD имеет текстовое поле ввода внутри него.Это позволяет пользователю редактировать контент.Я хочу иметь режим «только для чтения», в котором пользователь не может редактировать контент (по усмотрению пользователя).Для этого я хочу, чтобы пользователь мог нажимать кнопку (переключатели также подойдут), которая заменяет каждый из входов текстового поля тегом

, содержащим значение текстового поля в качестве его текста.В настоящее время мой код заменяет каждый из входных данных текстом «объектный объект».(Может быть, я неправильно преобразовал значения в текстовые строки?) Любые советы, которые дадут мне знать, что идет не так, будут сильно оценены.Спасибо !!

Это мой текущий скрипт: 

<script type="text/javascript">
    $("#permissionsbutton").live('click',function(){
        sss = $('.cells').each(function(){$(this).val()});
        $(".cells").replaceWith("<p class='readonlycells' type='text'>" + sss + "</p>");
    });
    // if this worked, I would write another few lines
    // to be able to switch back to having inputs
</script>

И это фрагмент того, как может выглядеть HTML: 

<div id="readwrite" class="settings">
    <h3>Permissions</h3>
    <button id="permissionsbutton">Switch to Read Only Mode</button>
</div>
<table><tr>
    <td><input class='cells' type=text value='Steve'></td>
    <td><input class='cells' type=text value='Mary'></td>
    <td><input class='cells' type=text value='Big Bird'></td>
</tr></table>

Ответы [ 3 ]

3 голосов
/ 03 декабря 2010

Функция jQuery each возвращает объект jQuery, для которого она была вызвана ($('cells') в вашем случае). Таким образом, текущий код заменяет каждый элемент, соответствующий селектору .cells, на объект jQuery, который сериализуется в «объектный объект».

То, что вы хотите, это что-то вроде 

$("#permissionsbutton").live('click', function() {
    $(".cells").each(function() {
        $(this).replaceWith($(this).val());
    }
});
1 голос
/ 03 декабря 2010 
$("#permissionsbutton").live('click',function(){ 
  $('.cells').each(function(){
    var cell=$(this);
    cell.replaceWith('<span class="cells_ro">'+cell.val()+'</span>');
  }); 
});

Или просто отключить ячейки: 

$("#permissionsbutton").live('click',function(){ 
  $('.cells').attr('disabled',true);
});
0 голосов
/ 03 декабря 2010

Как насчет: 

$("#permissionsbutton").click(function(){
$('.cells').attr('disabled','disabled');
});

Попробуйте здесь

...