Ir para conteúdo

Arquivado

Este tópico foi arquivado e está fechado para novas respostas.

hc3floyd

Modal html

Recommended Posts

desculpa ae pelo post duplicado , eu andei pesquisando e cheguei ao seguinte código

 

esse é o loop for que faço no html para renderizar a tabela com os dados vindos do controller php

		 @foreach (json_decode($produtos) as $key=>$p)
		<tr class="{{$p->quantidade<=1 ? 'danger' : '' }}">
		<td> {{ $p->id }} </td>
		<td> {{ $p->nome }}  </td>
		<td> {{ $p->descricao }} </td>
		<td> {{ $p->valor }} </td>
		<td> {{ $p->quantidade }} </td>
		
		<!-- 
			MENU 
			#BUSCAR
			#REMOVER
			#ALTERAR
		-->
		<td align="center">
			<a class="buscar" id="idProd" value="{{ $key }}" data-toggle="modal" data-id="{{ $produtos }}">
			<span class="glyphicon glyphicon-eye-open"></span>
			</a>
		</td>

		<td align="center">
			<a href="/produtos/remove/{{ $p->id }}">
			<span class="glyphicon glyphicon-trash"> </span>
			</a>
		</td>
		<td align="center">
			<a href="/produtos/update/{{ $p->id }}">
			<span class="glyphicon glyphicon-pencil"></span>
			</a>
		</td>
		</tr>

@endforeach
</table>

esse é o meu código jQuery e nele que estou perdido agora , kkkk

estou capturando o evento (click) na classe buscar depois eu pego o id que na verdade é um objeto json com todos os dados da tabela o que não sei como fazer é acessar o index certo para selecionar nesse json

<script type="text/javascript">
$(document).ready(function(){
	$('.buscar').on('click',function(){
		var id = $(this).data('id');
		var index = $('#idProd').attr('value');
		console.log('o id é: '+id);
		console.log('o index é: '+index);
		//$('#modalBuscar').html(id[$('.buscar').val()].nome);
		$('#prodNome').val(id[0].nome);
		$('#prodDesc').val(id[0].descricao);
		$('#prodVal').val(id[0].valor);
		$('#prodQnt').val(id[0].quantidade);
		$('#divBuscar').modal('show');
	});
});
</script>

esse é o meu Modal

<div id="divBuscar" class="modal fade" tabindex="-1" data-width="760" style="display: none;">
  <div class="modal-header">
    <button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
    <h4 class="modal-title">Produto selecionado</h4> 
 </div>
 <div class="modal-body" id="modalBuscar">
		<form>
			<input type="hidden" name="_token" value="{{{ csrf_token() }}}" />

			<div class="form-group">
				<label>Nome:</label>
				<input name="nome" id="prodNome" disabled class="form-control" id="nomePrd"/>
			</div>

			<div class="form-group">
				<label>Descrição:</label>
				<input name="descricao" id="prodDesc" disabled class="form-control" value="{{ $p->descricao }}"/>
			</div>

			<div class="form-group">
				<label id="total">Valor:</label>
				<input name="valor" id="prodVal" disabled class="form-control" value="{{ $p->valor }}"/> 
			</div>

			<div class="form-group">
				<label>Quantidade:</label>
				<input name="quantidade" id="prodQnt" type="number" disabled class="form-control" value="{{ $p->quantidade }}"/> 
			</div>
		</form>
  </div>

</div>

Compartilhar este post


Link para o post
Compartilhar em outros sites

iae galera consegui encontrar a resposta:

 

primeiro adicionei o atributo data-id

<td align="center">
     <a class="buscar" id="{{ $key }}" data-toggle="modal" data-id="{{ $produtos }}">
     <span class="glyphicon glyphicon-eye-open"></span>
     </a>
</td>

e o meu script fico assim :

<script type="text/javascript">
$(document).ready(function(){
	$('.buscar').on('click',function(){
		var id = $(this).attr('id');
		var objJson = $(this).data('id');
		
		console.log('o id é: '+id);
		console.log('o index é: '+objJson);
		//$('#modalBuscar').html(id[$('.buscar').val()].nome);
		$('#prodNome').val(objJson[id].nome);
		$('#prodDesc').val(objJson[id].descricao);
		$('#prodVal').val(objJson[id].valor);
		$('#prodQnt').val(objJson[id].quantidade);
		$('#divBuscar').modal('show');
	});
});
</script>

Compartilhar este post


Link para o post
Compartilhar em outros sites

×

Informação importante

Ao usar o fórum, você concorda com nossos Termos e condições.