Usamos cookies para medir audiência e melhorar sua experiência. Você pode aceitar ou recusar a qualquer momento. Veja sobre o iMasters.
Salve Imaster..
Bom eu to aprendendo javascript(jquery).. so bem fraquinho mesmo..
Seguinte, tenho um script que me possibilita editar campos da Tabela (faze um update..). Ate ai tudo bem.
Funciona legal adcionei o Ajax pra faze a requisição e tals..
Porem me surgiu a ideia de que em uma coluna da tabela eu preciso de um input SELECT ,onde pegaria dados de um json..
ai que a porca torceu o rabo pro meu lado =X
possoal mais fera no jquery conserteza tira isso de letra. Vim pedir essa pequena ajuda..
segue o script e bem simples .
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<script type="text/javascript" src="http://code.jquery.com/jquery-1.7.2.min.js"></script>
<title></title>
</head>
<body>
<table border="0" style="width: 99%" class="sample" id="tabledit">
<caption>
<span>Itens Por Pagina:</span><input type="text" size="15" value="10" name="p">
</caption>
<thead>
<tr>
<th></th>
<th style="display: none">ID</th>
<th>Imagem</th>
<th>Descricao</th>
<th>Galeria</th>
<th class="edit"> </th></tr>
</thead>
<tbody>
<tr>
<td class="edit"><input type="checkbox" value="4" name="4"></td>
<td style="display:none">4</td>
<td>imagem002.jpg</td>
<td>esse e a 2 imagem</td>
<td>5</td>
<tr>
<td class="edit"><input type="checkbox" value="5" name="5"></td>
<td style="display: none;">5</td>
<td>asdasdasda</td>
<td>fgdfgdfgdfgdfg</td>
<td>1</td>
<tr>
<td class="edit"><input type="checkbox" value="6" name="6"></td>
<td style="display:none">6</td>
<td>dfgdfgdfgdfg</td>
<td>dfgdfgdfgdfgdfgdfgdfg</td>
<td>2</td>
<tr>
<td class="edit"><input type="checkbox" value="7" name="7"></td>
<td style="display:none">7</td>
<td>sdfsdfsdfsdfs</td>
<td>sdfsdfsdfsdf</td>
<td>2</td>
</tbody>
</table>
</body>
<script type="text/javascript">
$(function(){
TABLE.formwork('#tabledit');
});
var TABLE = {};
TABLE.formwork = function(table){
var $tables = $(table);
$tables.each(function () {
var _table = $(this);
_table.find('thead tr').append($('<th class="edit"> </th>'));
_table.find('tbody tr').append($('<td class="edit"><input class="button" type="button" value="Edit"/></td>'))
});
$tables.find('.edit :button').live('click', function(e) {
TABLE.editable(this);
e.preventDefault();
});
}
TABLE.editable = function(button) {
var $button = $(button);
var $row = $button.parents('tbody tr');
var $cells = $row.children('td').not('.edit');
var $array = [];
if($row.data('flag')) { // in edit mode, move back to table
// cell methods
$cells.each(function () {
var _cell = $(this);
var ar = _cell.html(_cell.find('input').val());
$array.push(ar.text());
});
$row.data('flag',false);
$button.val('Edit');
//salvando dados
$.ajax({
url:"exemplo.html",
data:{data:$array},
type:'POST',
dataType:'json'
}).done(success());
}
else {
// in table mode, move to edit mode
// cell methods
$cells.each(function() {
var _cell = $(this);
_cell.data('text', _cell.html()).html('');
var $input = $('<input type="text" />')
.val(_cell.data('text'))
.width(_cell.width() - 15);
_cell.append($input);
})
$row.data('flag', true);
$button.val('Save');
}
}
function success(){
alert("Sucesso no editar!");
}
</script>
</html>desde já agradeço!
Carregando comentários...