Debe ser algo simple, pero recien llevo dos semanas con laravel y hay muchas cosas que desconozco y esta es una de ellas.
En el tab1 tengo una celda que es capital que ingreso un valor y quisiera que cuando hago click en el segundo tabs. me muestre otra celda con el valor que puse en capital + 1000.
<!-- Tab panes -->
<div class="tab-content">
<div role="tabpanel" class="tab-pane active" id="tab1">
{!! Form::label('capital', 'Cantidad') !!}
{!! Form::text('capital', null, ['class' => 'form-control', 'placeholder' => 'Ingrese Cantidad $$$' , 'required']) !!}
</div>
</div>
<div role="tabpanel" class="tab-pane" id="tab2">
<!-- Que Muestre lo que escribi en tab1=capital + $1000 -->
</div>
</div>
</div>
<!-- Tab fin -->
Este es mi código completo
@extends('layouts.app')
@section ('title','Nuevo Prestamo | ' )
@section ('content')
<head><script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.4/jquery.min.js"></script></head>
@if(count($errors) > 0)<div class="alert alert-danger" role="alert"><ul>
@foreach($errors->all() as $error)
<li>{{ $error }}</li>
@endforeach
</ul>
</div>
@endif
{!! Form::model('loan', ['route' => ['loans.store'],'method' =>'POST']) !!}
<div class="container">
<div class="row">
<div class="col-md-8 col-md-offset-2">
<div class="panel panel-default">
<div class="panel-heading">Nuevo Prestamo</div>
<div class="panel-body">
<div role="tabpanel">
<!-- Nav tabs -->
<ul class="nav nav-tabs" role="tablist">
<li role="presentation" class="active"><a href="#tab1" aria-controls="tab1" role="tab" data-toggle="tab">Prestamo</a></li>
<li role="presentation"><a href="#tab2" aria-controls="tab2" role="tab" data-toggle="tab">Avales 1</a></li>
<li role="presentation"><a href="#tab3" aria-controls="tab3" role="tab" data-toggle="tab">Avales 2</a></li>
<li role="presentation"><a href="#tab4" aria-controls="tab4" role="tab" data-toggle="tab">Calcular</a></li>
</ul><br>
<div class="tab-content">
<div role="tabpanel" class="tab-pane active" id="tab1">
<!-- Tab panel 1 -->
<div class="form-group">
{!! Form::label( 'nombre', $nombre),Form::label('apellido', "-"), Form::label('apellido', $apellido) !!}
<input type="hidden" value="{{$client_id}}" name="client_id">
</div>
<div class="form-group">
{!! Form::label('capital_max', $capital_max) !!}
</div>
<div class="form-group">
{!! Form::label('capital', 'Cantidad') !!}
{!! Form::text('capital', null, ['class' => 'form-control', 'placeholder' => 'Ingrese Cantidad $$$' , 'required']) !!}
</div>
<div class="form-group">
{!! Form::label('forma_pago', 'Forma de Pago') !!}
{!! Form::select('forma_pago', ['semanal' => 'Semanal', 'quincenal' => 'Quincenal', 'mensual' => 'Mensual'],null,['class'=> 'form-control']) !!}
</div>
<div class="form-group">
{!! Form::label('meses', 'Meses') !!}
{!! Form::select('meses', ['0' => '0','1','2','3','4','5','6','7','8','9','10','11','12'],null,['class'=> 'form-control']) !!}
</div>
<div class="form-group">
{!! Form::label('pago_primer_fecha', 'Fecha Primer Pago') !!}
{!! $hola = Form::date('pago_primer_fecha', \Carbon\Carbon::now(), ['class' => 'form-control', 'required']) !!}
</div>
</div>
<!-- Tab panel 2 -->
<div role="tabpanel" class="tab-pane" id="tab2">
<div class="form-group">
{!! Form::label('aval_1_nombre', 'AVAL 1: Nombres y Apellidos') !!}
{!! Form::text('aval_1_nombre',null, ['class' => 'form-control', 'placeholder' => 'Nombre completo, Apellido completo']) !!}
</div>
<div class="form-group">
{!! Form::label('aval_1_tel', 'AVAL 1: Telefono') !!}
{!! Form::text('aval_1_tel',null, ['class' => 'form-control', 'placeholder' => 'Telefono']) !!}
</div>
<div class="form-group">
{!! Form::label('aval_1_paren', 'AVAL 1: Parentesco') !!}
{!! Form::text('aval_1_paren',null, ['class' => 'form-control', 'placeholder' => 'Parentesco']) !!}
</div>
<div class="form-group">
{!! Form::label('aval_1_ocup', 'AVAL 1: Ocupación') !!}
{!! Form::text('aval_1_ocup',null, ['class' => 'form-control', 'placeholder' => 'Ocupación']) !!}
</div>
<div class="form-group">
{!! Form::label('aval_1_edad', 'AVAL 1: Edad') !!}
{!! Form::text('aval_1_edad',null, ['class' => 'form-control', 'placeholder' => 'Edad']) !!}
</div>
</div>
<!-- Tab panel 3 -->
<div role="tabpanel" class="tab-pane" id="tab3">
<div class="form-group">
{!! Form::label('aval_2_nombre', 'AVAL 2: Nombres y Apellidos') !!}
{!! Form::text('aval_2_nombre',null, ['class' => 'form-control', 'placeholder' => 'Nombre completo, Apellido completo' ]) !!}
</div>
<div class="form-group">
{!! Form::label('aval_2_tel', 'AVAL 2: Telefono') !!}
{!! Form::text('aval_2_tel',null, ['class' => 'form-control', 'placeholder' => 'Telefono' ]) !!}
</div>
<div class="form-group">
{!! Form::label('aval_2_paren', 'AVAL 2: Parentesco') !!}
{!! Form::text('aval_2_paren',null, ['class' => 'form-control', 'placeholder' => 'Parentesco']) !!}
</div>
<div class="form-group">
{!! Form::label('aval_2_ocup', 'AVAL 2: Ocupación') !!}
{!! Form::text('aval_2_ocup',null, ['class' => 'form-control', 'placeholder' => 'Ocupación']) !!}
</div>
<div class="form-group">
{!! Form::label('aval_2_edad', 'AVAL 1: Edad') !!}
{!! Form::text('aval_2_edad',null, ['class' => 'form-control', 'placeholder' => 'Edad' ]) !!}
</div>
<div class="form-group">
{!! Form::submit('Registrar',['class' => 'btn btn-primary'] ) !!}
</div>
</div>
<!-- Tab panel 4 -->
<div role="tabpanel" class="tab-pane" id="tab4">
{!! Form::text('capital2', null, ['class' => 'form-control' , 'required']) !!}
</div>
</div>
</div>
<script>
// detectamos el cambio de valor en el campo capital
$('#capital').on('input', function(){
// comprobamos que sea un entero y en caso contrario, pasamos un cero
var capitalValue = !isNaN(parseInt($(this).val())) ? parseInt($(this).val()) : 0 ;
// sumamos 1000 al valor obtenido de capital y lo ponemos en capital2
$('#capital2').val(capitalValue + 1000);
});
</script>
@endsection
y este es mi layouts.app
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>@yield('title','default') | Prestamista</title>
<link rel="stylesheet" href="{{ asset('pluggins/bootstrap/css/bootstrap.css')}}">
<!-- Fonts -->
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.5.0/css/font-awesome.min.css" integrity="sha384-XdYbMnZ/QjLh6iI4ogqCTaIjrFk87ip+ekIjefZch0Y+PvJ8CDYtEs1ipDmPorQ+" crossorigin="anonymous">
<link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Lato:100,300,400,700">
<!-- Styles -->
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.6/css/bootstrap.min.css" integrity="sha384-1q8mTJOASx8j1Au+a5WDVnPi2lkFfwwEAa8hDDdjZlpLegxhjVME1fgjWPGmkzs7" crossorigin="anonymous">
{{-- <link href="{{ elixir('css/app.css') }}" rel="stylesheet"> --}}
<style>
body {
font-family: 'Lato';
}
.fa-btn {
margin-right: 6px;
}
</style>
</head>
<body id="app-layout">
<nav class="navbar navbar-default navbar-static-top">
<div class="container">
<div class="navbar-header">
<!-- Collapsed Hamburger -->
<button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#app-navbar-collapse">
<span class="sr-only">Toggle Navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<!-- Branding Image -->
<a class="navbar-brand" href="{{ url('/') }}">
Prestamista
</a>
</div>
<div class="collapse navbar-collapse" id="app-navbar-collapse">
<!-- Left Side Of Navbar -->
<ul class="nav navbar-nav">
<li><a href="{{ url('/home') }}">Inicio</a></li>
</ul>
@if(Auth::user())
<ul class="nav navbar-nav">
<li><a href="{{ url('/clients') }}">Clientes</a></li>
</ul>
<ul class="nav navbar-nav">
<li><a href="{{ url('/loans') }}">Prestamos</a></li>
</ul>
@if((Auth::user()->tipo)==='admin')
<ul class="nav navbar-nav">
<li><a href="{{ url('/users') }}">[Usuarios]</a></li>
</ul>
@endif
@else
@endif
<!-- Right Side Of Navbar -->
<ul class="nav navbar-nav navbar-right">
<!-- Authentication Links -->
@if (Auth::guest())
<li><a href="{{ url('/login') }}">Login</a></li>
@else
<li class="dropdown">
<a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-expanded="false">
{{ Auth::user()->name }} <span class="caret"></span>
</a>
<ul class="dropdown-menu" role="menu">
<li><a href="{{ url('/logout') }}"><i class="fa fa-btn fa-sign-out"></i>Salir</a></li>
</ul>
</li>
@endif
</ul>
</div>
</div>
</nav>
@yield('content')
<!-- JavaScripts -->
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/2.2.3/jquery.min.js" integrity="sha384-I6F5OKECLVtK/BL+8iSLDEHowSAfUo76ZL9+kGAgTRdiByINKJaqTPH/QVNS1VDb" crossorigin="anonymous"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.6/js/bootstrap.min.js" integrity="sha384-0mSbJDEHialfmuBBQP6A4Qrprq5OVfW37PRR3j5ELqxss1yVqOtnepnHVP9aJ7xS" crossorigin="anonymous"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.4/jquery.min.js"></script>
{{-- <script src="{{ elixir('js/app.js') }}"></script> --}}