The Laravel 8 crud that uses the modal does not add data to the database - crud
I work on one project for college and I have one problem...Does anyone know why I don't want to enter data into the database after adding by modal method. It is also not updated. And it doesn’t throw out a single mistake. Namely, I would like to have a crud operation on the same page, ie not to switch to another url when clicking on edit, add ... Just to add that the delete button is the only one of these three ...
index.blade.php
<?php
use App\Models\User;
use App\Models\Client;
use App\Models\Event;
?>
<!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>Bootstrap CRUD Data Table for Database with Modal Form</title>
<link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Roboto|Varela+Round">
<link rel="stylesheet" href="https://fonts.googleapis.com/icon?family=Material+Icons">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
<body>
<div class="container">
<div class="table-wrapper">
<div class="table-title">
<div class="row">
<div class="col-sm-6">
<h2>Uredi <b>klijente</b></h2>
</div>
<div class="col-sm-6">
<i class="material-icons"></i> <span>Dodaj novog klijenta</span>
</div>
</div>
</div>
<table class="table table-striped table-hover">
<thead>
<tr>
<th>Ime</th>
<th>Prezime</th>
<th>Datum rođenja</th>
<th>Email roditelja</th>
<th>Tel.roditelja</th>
<th>U terapiji?</th>
<th>Dijagnoza</th>
<th>Komentar</th>
<th>Logoped</th>
<th>Akcije</th>
</tr>
</thead>
<tbody>
#foreach($clients as $client)
<tr>
<td>{{$client->name}}</td>
<td>{{$client->lastname}}</td>
<td>{{$client->date_of_birth}}</td>
<td>{{$client->email}}</td>
<td>{{$client->telephone}}</td>
<td>{{$client->in_therapy}}</td>
<td>{{$client->diagnosis}}</td>
<td>{{$client->comments}}</td>
<td>{{$client->therapists_id}}</td>
<td>
<i class="material-icons" data-toggle="tooltip" title="Edit"></i>
<i class="material-icons" data-toggle="tooltip" title="Delete"></i>
</td>
</tr>
#endforeach
</tbody>
</table>
</div>
<!-- add Modal HTML -->
<div id="addEmployeeModal" class="modal fade">
<div class="modal-dialog">
<div class="modal-content">
<form>
<div class="modal-header">
<h4 class="modal-title">Dodaj klijenta</h4>
<button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
</div>
{!! Form::open(['action' =>['ClientsController#store',''],'method'=>'POST','style'=>'width:50%',]) !!}
{{csrf_field()}}
<div class="modal-body">
<div class="form-group">
{{Form::label('name','Ime')}}
{{Form::text('name','',['class'=>'form-control'])}}
</div>
<div class="form-group">
{{Form::label('lastname','Prezime')}}
{{Form::text('lastname','',['class'=>'form-control'])}}
</div>
<div class="form-group">
{{Form::label('date_of_birth','Datum rođenja')}}
{{Form::date('date_of_birth','',['class'=>'form-control'])}}
</div>
<div class="form-group">
{{Form::label('email','Email roditelja')}}
{{Form::text('email','',['class'=>'form-control'])}}
</div>
<div class="form-group">
{{Form::label('telephone','Tel. roditelja')}}
{{Form::text('telephone','',['class'=>'form-control'])}}
</div>
<div class="form-group">
{{Form::label('in_therapy','U terapiji?')}}<br/>
{{Form::checkbox('in_therapy','Da',['class'=>'form-control'])}}Da<br/>
{{Form::checkbox('in_therapy','Ne',['class'=>'form-control'])}}Ne<br/>
</div>
<div class="form-group">
{{Form::label('diagnosis','Dijagnoza')}}
{{Form::textarea('diagnosis','',['class'=>'form-control','rows' => 3, 'cols' => 170,])}}
</div>
<div class="form-group">
{{Form::label('comments','Komentari')}}
{{Form::textarea('comments','',['class'=>'form-control','rows' => 3, 'cols' => 170,])}}
</div>
<div class="form-group">
{{Form::label('user_id', 'Logoped')}}<br/>
{{Form::select('user_id', $sp_therapist, null, ['class' => 'form-control','placeholder' => 'Izaberite logopeda'])}}
</div>
</div>
<div class="modal-footer">
<input type="button" class="btn btn-default" data-dismiss="modal" value="Odustani">
<input type="submit" class="btn btn-success" value="Dodaj">
</div>
{!!Form::close()!!}
</div>
</div>
</div>
<!-- Edit Modal HTML -->
<div id="editEmployeeModal" class="modal fade">
<div class="modal-dialog">
<div class="modal-content">
<form>
<div class="modal-header">
<h4 class="modal-title">Edit Employee</h4>
<button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
</div>
{!! Form::open(['action' =>['ClientsController#update',''],'method'=>'POST','style'=>'width:50%',]) !!}
{{csrf_field()}}
<div class="modal-body">
<div class="form-group">
{{Form::label('name', 'Ime')}}
{{Form::text('name', $client->name, ['class' => 'form-control'])}}
</div>
<div class="form-group">
{{Form::label('lastname', 'Prezime')}}
{{Form::text('lastname', $client->lastname, ['class' => 'form-control', 'placeholder' ])}}
</div>
<div class="form-group">
{{Form::label('date_of_birth', 'Datum rođenja')}}
{{Form::date('date_of_birth', $client->date_of_birth, ['class' => 'form-control', 'placeholder' => 'Unesite datum rođenja djeteta'])}}
</div>
<div class="form-group">
{{Form::label('email', 'Email')}}
{{Form::text('email', $client->email, ['class' => 'form-control', 'placeholder' => 'Unesite email roditelja'])}}
</div>
<div class="form-group">
{{Form::label('telephone', 'Kontakt broj:')}}
{{Form::text('telephone', $client->telephone, ['class' => 'form-control', 'placeholder' => 'Unesite kontakt broj'])}}
</div>
<div class="form-group">
#if($client->in_therapy != 1)
<div class="form-group">
{{Form::label('in_therapy', 'U terapiji')}}<br>
#if($client->in_therapy == "Da")
{{Form::checkbox('in_therapy', 'Da',$client->in_therapy)}} Da <br>
{{Form::checkbox('in_therapy', 'Ne','')}} Ne<br>
#elseif($client->in_therapy == "Ne")
{{Form::checkbox('in_therapy', 'Da',)}} Da<br>
{{Form::checkbox('in_therapy', 'Ne',$client->in_therapy)}} Ne <br>
#endif
</div>
</div>
#else
<div class="form-group">
{{Form::label('in_therapy', 'U terapiji?')}}<br>
#if($client->in_therapy == "Da")
{{Form::text('in_therapy',$client->in_therapy,['class'=>'form-control','readonly '])}} <br>
#elseif($client->in_therapy == "Ne")
{{Form::text('in_therapy',$client->in_therapy,['class'=>'form-control','readonly '])}} <br>
</div>
#endif
<div class="form-group">
{{Form::label('in_therapy', 'U terapiji?')}}<br>
#if($client->in_therapy == "Da")
{{Form::text('in_therapy',$client->in_therapy,['class'=>'form-control','readonly '])}} <br>
#elseif($client->in_therapy == "Ne")
{{Form::text('in_therapy',$client->in_therapy,['class'=>'form-control','readonly '])}} <br>
</div>
#endif
#endif
<div class="form-group">
{{Form::label('diagnosis', 'Dijagnoza?')}}<br/>
{{Form::textarea('diagnosis', $client->diagnosis, ['class' => 'form-control', 'rows' => 5, 'cols' => 170])}}
</div>
<div class="form-group">
{{Form::label('comments', 'Komentari')}}<br/>
{{Form::textarea('comments', $client->comments, ['class' => 'form-control', 'rows' => 5, 'cols' => 170, 'placeholder' => 'Unesite popratne komentare'])}}
</div>
<div class="form-group">
{{Form::label('therapists_id', 'Logoped')}}
{{Form::select('therapists_id', $sp_therapist, $client->therapists_id,['class' => 'form-control', 'placeholder' => 'Izaberite logopeda'])}}
</div>
</div>
<div class="modal-footer">
<input type="button" class="btn btn-default" data-dismiss="modal" value="Cancel">
<input type="submit" class="btn btn-info" value="Save">
</div>
{!!Form::close()!!}
</div>
</div>
</div>
<!-- Delete Modal HTML -->
<div id="deleteEmployeeModal" class="modal fade">
<div class="modal-dialog">
<div class="modal-content">
{!!Form::open(['action' =>['ClientsController#destroy', $client->id], 'method' => 'POST'])!!}
<div class="modal-header">
<h4 class="modal-title">Izbriši klijenta</h4>
<button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
</div>
<div class="modal-body">
<p>Da li ste sigurni da želite izbrisati ovog klijenta?</p>
<p class="text-warning"><small style="color: #000">Ova akcija se ne može poništiti</small></p>
</div>
<div class="modal-footer">
#method('DELETE')
<input type="button" class="btn btn-default" data-dismiss="modal" value="Odustani">
<input type="submit" class="btn btn-danger" value="Izbriši">
</div>
{!!Form::close()!!}
</div>
</div>
</div>
</body>
</html>
#endsection
this is controller for store and edit.
public function store(Request $request)
{
$this->validate($request,[
'name' => 'required',
'lastname' => 'required',
'date_of_birth' => 'required',
'telephone' => 'required'
]);
$client = new Client;
$client->name = $request->input('name');
$client->lastname = $request->input('lastname');
$client->date_of_birth = $request->input('date_of_birth');
$client->email = $request->input('email');
$client->telephone = $request->input('telephone');
$client->in_therapy = $request->input('in_therapy');
$client->diagnosis = $request->input('diagnosis');
$client->comments = $request->input('comments');
$client->therapists_id = $request->input('user_id');
$client->save();
return redirect('/clients')->with('success', 'Klijent je unesen');
}
public function edit($id)
{
$sp_therapist = DB::table('users')->pluck('name', 'id');
$client = Client::find($id);
return view('clients.edit')->with('client',$client)->with('sp_therapist', $sp_therapist);
}
and this is web.php
use Illuminate\Support\Facades\Route;
use App\Http\Controllers\FullCalenderController;
use App\Http\Controllers\Auth\RegisterController;
Auth::routes();
Route::group(['middleware' => 'auth'], function () {
Route::get('/','PagesController#index');
Route::get('/dashboard', 'DashboardController#index')->name('dashboard');
Route::get('/register', 'Auth\RegisterController#create')->name('register');
Route::resource('clients','ClientsController');
//CALENDAR
Route::get('schedule', [FullCalenderController::class, 'index']);
Route::post('schedule/action', [FullCalenderController::class, 'action']);
});
thanks
Check that the Modals you're using have the $fillable property with the values you want to insert, something like this:
class User extends Model {
protected $fillable = ['name', 'lastname', 'email']
}
otherwise Eloquent doesn't allow you to inject the inputs.
first if u use laravel 8 use this on ur web.php
use App\Http\Controllers\ClientsController;
Route::resource('clients',[ClientsController::class]);
and in ur index file set form action to route('clients.store') , use route name
in ur store controller try to dd($request) to see the respond, if u still have any problem, let us know
Related
Preventing developer message to user frontend
I am developing a website with different pages, and among those pages,
I have a contact form that send message to the backend, the email id is unique, I need to display an error message to the front end that if a user enter the email that exist to then it has to display a message the email is taken. How can I go to achieve this. Here is my code
Controller
<?php
namespace App\Http\Controllers\Frontend;
use App\Http\Controllers\Controller;
use Illuminate\Http\Request;
use App\Models\Contact;
use Illuminate\Support\Carbon;
class FrontendPages extends Controller
{
public function About(){
return view('frontend.pages.about');
}//end method
public function Service(){
return view('frontend.pages.services');
}//end method
public function Blog(){
return view('frontend.pages.blog');
}//end method
public function Contact(){
return view('frontend.pages.contact');
}//end method
public function StoreMessage(Request $request){
Contact::insert([
'name' => $request->name,
'email' => $request->email,
'subject' => $request->subject,
'message' => $request->message,
'created_at' =>Carbon::now(),
]);
if ($request->email == 'email') {
return response()->json(['email exist']);
}
$notification = array(
'message' => 'Thank for being in touch we will get back to you soon',
'alert-type' => 'success'
);
return redirect()->back()->with($notification);
}
}
my form
#extends('frontend.main_master')
#section('main')
#php
$footersetup = App\Models\Footer::find(1)->first();
#endphp
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
<!-- ======= Breadcrumbs ======= -->
<section id="breadcrumbs" class="breadcrumbs">
<div class="container mt-3">
<div class="d-flex justify-content-between align-items-center">
<h2>Contact</h2>
<ol>
<li>Home</li>
<li>Contact</li>
</ol>
</div>
</div>
</section>
<!-- End Breadcrumbs -->
<!-- ======= Contact Section ======= -->
<section id="contact" class="contact">
<div class="container">
<div class="row mt-5">
<div class="col-lg-4">
<div class="info">
<h4>Location:</h4>
<div class="address">
<i class="bi bi-geo-alt"></i>
{!! $footersetup->address !!}<br /><br />
</div>
<div class="email">
<i class="bi bi-envelope"></i>
<h4>Email:</h4>
<p>
{{$footersetup->email}}<br />{{$footersetup->email1}}
</p>
</div>
<div class="phone">
<i class="bi bi-phone"></i>
<h4>Call:</h4>
<p>{{$footersetup->phone}}</p>
</div>
</div>
</div>
<div class="col-lg-8 mt-5 mt-lg-0">
<form
action="{{route('store.message')}}"
method="post"
role="form"
>
#csrf
<div class="row">
<div class="col-md-6 form-group">
<input
type="text"
name="name"
class="form-control"
id="name"
placeholder="Your Name"
required
/>
</div>
<div class="col-md-6 form-group mt-3 mt-md-0">
<input
type="email"
class="form-control"
name="email"
id="email"
placeholder="Your Email"
required
/>
</div>
</div>
<div class="form-group mt-3">
<input
type="text"
class="form-control"
name="subject"
id="subject"
placeholder="Subject"
required
/>
</div>
<div class="form-group mt-3">
<textarea
class="form-control"
name="message"
rows="5"
placeholder="Message"
required
></textarea>
</div>
<div class="my-3">
</div>
<div class="text-center">
<button type="submit" class="btn btn-success">Send Message</button>
</div>
</form>
</div>
</div>
</div>
</section>
<!-- End Contact Section -->
#endsection
ASP.net Core Basic Modal Does Not Show Properly
I've been trying to get a basic modal pop up to show, but not having any luck. With fade on I see the page contents shift to the left, but the modal is invisible. When fade removed I see the modal over the entire screen. I have no idea why its doing what its doing. Hopefully someone here can see what I'm doing wrong.
<!-- START: Header Banner -->
<div>
<img src="/img/default-header-img.jpg" class="img-responsive">
</div>
<!-- END: Header Banner -->
<!-- Message board area -->
<br>
<div class="container">
<div class="strap-card strap-person">
<h2 class="mb20">Message Board</h2>
<p>Welcome #User.Identity.Name, Let's get started...</p>
</div>
</div>
<!-- END: Message board -->
<div class="container">
#*Method 1*#
<div class="modal fade" id="loadingModal" tabindex="-1" role="dialog" data-keyboard="false" data-backdrop="static">
<div class="modal-dialog modal-sm">
<div class="modal-content">
<div class="modal-header">
<h4 class="modal-title">Login</h4>
</div>
<div class="modal-body">
</div>
<div class="modal-footer">
</div>
</div>
</div>
</div>
#*End Method 1*#
<div class="row">
<div class="col-md-6">
<div class="strap-card strap-person text-center">
<div class="strap-card-text">
<div id="templates">
<h4>Select a Template</h4>
<form id="frmTemplates" asp-action="return false" class="strap-form mb60">
<select id="selTemplates" asp-for="TemplateId" asp-items="Model.Templates" class="form-control"></select>
<br />
<button type="button" id="btnStart" name="button" value="Start" #(ViewBag.DisableRangeStart == true ? "disabled='disabled'" : "") class="btn btn-primary">Start</button> <button type="button" id="btnStop" name="button" value="Stop" class="btn btn-primary">Stop</button>
</form>
</div>
</div>
</div>
</div>
<div class="col-md-6">
<div class="strap-card strap-person text-center">
<div class="strap-card-text">
<div id="environment">
<h4>Environment Description</h4>
<br />
<span id="templateDesc">#Html.Raw(Model.TemplateDesc)</span>
</div>
</div>
</div>
</div>
</div>
</div>
#section scripts {
<script>
$(function ()
{
$("#btnStart").click(function (e)
{
$("#loadingModal").modal();
setTimeout(function () { $("#loadingModal").modal("hide") }, 300000);
});
$("#btnStop").click(function (e)
{
});
});
</script>
}
I've tried placing the modal code in different areas but the results are the same.
I tried putting everything in jsfiddle for testing, but I have no idea how to use that site.
Try to make a test with code below:
<h1>Test</h1>
<!-- START: Header Banner -->
<div>
<img src="/img/default-header-img.jpg" class="img-responsive">
</div>
<!-- END: Header Banner -->
<!-- Message board area -->
<br>
<div class="container">
<div class="strap-card strap-person">
<h2 class="mb20">Message Board</h2>
<p>Welcome #User.Identity.Name, Let's get started...</p>
</div>
</div>
<!-- END: Message board -->
<div class="container">
#*Method 1*#
<div class="modal fade" id="loadingModal" tabindex="-1" role="dialog" data-keyboard="false" data-backdrop="static">
<div class="modal-dialog modal-sm">
<div class="modal-content">
<div class="modal-header">
<h4 class="modal-title">Login</h4>
</div>
<div class="modal-body">
</div>
<div class="modal-footer">
</div>
</div>
</div>
</div>
#*End Method 1*#
<div class="row">
<div class="col-md-6">
<div class="strap-card strap-person text-center">
<div class="strap-card-text">
<div id="templates">
<h4>Select a Template</h4>
<form id="frmTemplates" asp-action="return false" class="strap-form mb60">
<select id="selTemplates" class="form-control"></select>
<br />
<button type="button" id="btnStart" name="button" value="Start" #(ViewBag.DisableRangeStart == true ? "disabled='disabled'" : "") class="btn btn-primary">Start</button> <button type="button" id="btnStop" name="button" value="Stop" class="btn btn-primary">Stop</button>
</form>
</div>
</div>
</div>
</div>
<div class="col-md-6">
<div class="strap-card strap-person text-center">
<div class="strap-card-text">
<div id="environment">
<h4>Environment Description</h4>
<br />
#*<span id="templateDesc">#Html.Raw(Model.TemplateDesc)</span>*#
</div>
</div>
</div>
</div>
</div>
</div>
#section scripts {
<!-- jQuery -->
<script src="//code.jquery.com/jquery-1.11.0.min.js"></script>
<!-- BS JavaScript -->
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js" integrity="sha384-Tc5IQib027qvyjSMfHjOMaLkfuWVxZxUPnCJA7l2mCWNIpG9mGCD8wGNIcPD7Txa" crossorigin="anonymous"></script>
<script>
$(function ()
{
$("#btnStart").click(function (e)
{
$("#loadingModal").modal();
setTimeout(function () { $("#loadingModal").modal("hide") }, 300000);
});
$("#btnStop").click(function (e)
{
});
});
</script>
}
Checkbox doesn't work on bootstrap modal using a partial view on a .net core project
I'm developing on a bootstrap-modal over a partial view (.net core) and want to use some checkbox to complete my formulary but when giving click the checkbox doesn't change. It seems to be frozen
I'm using VS 2017, C#, .net core and IIS v10
<!-- enter code here-->
#model Acre.Business.DTOs.FormMetadataDTO
#section head {
<link href="~/Content/summernote/summernote.css" rel="stylesheet" />
<link href="~/Content/summernote/plugin/databasic/summernote-ext-databasic.css" rel="stylesheet" />
}
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-label="Close">
<span class="glyphicon glyphicon-pencil" aria-hidden="true"></span>
</button>
<h4 class="modal-title" id="editLabel">Agregar <small>Metadatos</small></h4>
</div>
<div class="modal-body">
<!-- BEGIN FORM-->
<div class="form">
<div class="form-body">
<form asp-action="Create" asp-controller="FormMetadata" method="post" class="form-horizontal" role="form" id="FormMetadataMTE" novalidate="novalidate">
<div class="form-horizontal">
<div asp-validation-summary="ModelOnly" class="text-danger"></div>
<div class="alert alert-danger display-hide" id="ErrorMessage1">
<button class="close" data-close="alert"></button> Hay algunos errores en el formulario. Por favor verifique a continuación.
</div>
#*DUPLICADO*#
#*<div class="alert alert-danger display-hide" id="ErrorDuplicado" style="#(#ViewBag.StyleErrorMessage); display:#ViewBag.Display">
<button class="close" data-close="alert"></button> #ViewBag.ErrorDuplicado
</div>*#
<div class="alert alert-danger display-hide" id="ErrorMessage2" style="#(#ViewBag.StyleErrorMessage)">
<button class="close" data-close="alert"></button> #ViewBag.ErrorMessage
</div>
<div class="alert alert-success display-hide">
<button class="close" data-close="alert"></button> ¡La validación del formulario es exitosa!
</div>
<div class="row">
<div class="col-xs-6">
</div>
<div class="col-md-6">
</div>
</div>
<div class="row">
<div class="col-xs-6">
<div class="form-group form-md-line-input">
#*<label asp-for="TipoFormularioId" class="control-label col-md-4 text-right"></label>*#
#Html.LabelFor(model => model.TipoFormularioId, "TipoFormularioId", htmlAttributes: new { #class = "control-label col-md-4 text-right" })
<div class="col-xs-7">
<select asp-for="TipoFormularioId" class="form-control" asp-items="ViewBag.TipoFormularioId"></select>
#*#Html.DropDownList("TipoFormularioId", null, htmlAttributes: new { #class = "form-control", disabled= "disabled" })*#
<div class="form-control-focus"></div>
<span class="help-block">Seleccione el tipo de formulario</span>
</div>
</div>
</div>
<div class="col-xs-6">
<div class="form-group form-md-line-input">
<label asp-for="MetaCampoId" class="control-label col-md-4 text-right"></label>
<div class="col-xs-7">
<select asp-for="MetaCampoId" class="form-control" asp-items="ViewBag.MetaCampoId" id="MetaCampoId"></select>
<div class="form-control-focus"></div>
<span class="help-block">Seleccione el metacampo</span>
</div>
</div>
</div>
#*<div class="col-xs-6">
<div class="form-group form-md-line-input">
<label asp-for="TipoFormularioId" class="control-label col-md-4 text-right"></label>
<div class="col-xs-7">
<select asp-for="TipoFormularioId" class="form-control" asp-items="ViewBag.TipoFormularioId"></select>
<div class="form-control-focus"></div>
<span class="help-block">Seleccione el tipo de formulario</span>
</div>
</div>
</div>*#
</div>
<div class="row">
<div class="col-xs-6">
<div class="form-group form-md-line-input">
<label asp-for="MetaEtiqueta" class="control-label col-md-4 text-right"></label>
<div class="col-xs-7">
<input asp-for="MetaEtiqueta" class="form-control" autocomplete="off" />
<div class="form-control-focus"></div>
<span class="help-block">Escriba MetaEtiqueta</span>
</div>
</div>
</div>
<div class="col-xs-6">
<div class="form-group form-md-line-input">
<label asp-for="Orden" class="control-label col-md-4 text-right"></label>
<div class="col-xs-7">
<input asp-for="Orden" class="form-control" autocomplete="off" />
<div class="form-control-focus"></div>
<span class="help-block">Escriba Orden</span>
</div>
</div>
</div>
</div>
<div class="row">
<div class="col-xs-6">
<div class="form-group form-md-line-input">
#Html.LabelFor(model => model.Requerido, htmlAttributes: new { #class = "control-label col-md-4" })
<div class="col-md-4">
<div class="md-checkbox-list">
<div class="md-checkbox">
#Html.CheckBoxFor(model => model.Requerido, new { #class = "md-check" })
<label class="col-md-1 md-checkbox md-checkbox-outline text-right" for="Requerido">
<span class="inc"></span>
<span class="check"></span>
<span class="box"></span>
</label>
</div>
</div>
</div>
</div>
</div>
<div class="col-xs-6">
<div class="form-group form-md-line-input">
#Html.LabelFor(model => model.VisibleEnGrid, htmlAttributes: new { #class = "control-label col-md-4" })
<div class="col-md-4">
<div class="md-checkbox-list">
<div class="md-checkbox">
#Html.CheckBoxFor(model => model.VisibleEnGrid, new { #class = "md-check" })
<label class="col-md-1 md-checkbox md-checkbox-outline text-right" for="VisibleEnGrid">
<span class="inc"></span>
<span class="check"></span>
<span class="box"></span>
</label>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="row">
<div class="col-xs-6">
<div class="form-group form-md-line-input">
#Html.LabelFor(model => model.Privado, htmlAttributes: new { #class = "control-label col-md-4" })
<div class="col-md-4">
<div class="md-checkbox-list">
<div class="md-checkbox">
#Html.CheckBoxFor(model => model.Privado, new { #class = "md-check" })
<label class="col-md-1 md-checkbox md-checkbox-outline text-right" for="Privado">
<span class="inc"></span>
<span class="check"></span>
<span class="box"></span>
</label>
</div>
</div>
</div>
</div>
</div>
<div class="col-xs-6">
</div>
</div>
<div class="row">
<div class="col-xs-12">
<div class="form-group form-md-line-input">
<label asp-for="Ayuda" class="control-label col-md-2 text-right"></label>
<div class="col-xs-9">
<input asp-for="Ayuda" class="form-control Editor" autocomplete="off" />
<div class="form-control-focus"></div>
<span class="help-block">Escriba Ayuda</span>
</div>
</div>
</div>
</div>
</div>
<div class="form-actions">
<div class="row">
<div class="col-md-offset-5">
#*#Html.ActionLink("Cancelar", "Index", "FormMetadata", null, new { #class = "btn red" })*#
#*Cancelar*#
<button type="button" class="btn red" id="crudCancel" data-dismiss="modal">Cancelar</button>
<input type="submit" value="Guardar" class="btn blue" />
</div>
</div>
</div>
</form>
</div>
</div> <!-- END FORM-->
</div>
#*<div class="modal-footer">
<button type="button" data-dismiss="modal" class="btn default">Cerrar</button>
<button type="submit" class="btn blue" id="btnGuardar">
<i class="fa fa-check"></i> Guardar
</button>
</div>*#
#section Scripts {
#{await Html.RenderPartialAsync("_ValidationScriptsPartial");}
<script src="~/Content/summernote/summernote.js"></script>
<script src="~/Content/summernote/plugin/databasic/summernote-ext-databasic.js"></script>
<script src="~/Content/summernote/plugin/hello/summernote-ext-hello.js"></script>
<script src="~/Content/summernote/lang/summernote-es-ES.js"></script>
<script src="~/Content/summernote/plugin/specialchars/summernote-ext-specialchars.js"></script>
<script src="~/Scripts/home-index.js"></script>
}
I expect that my checkbox change of state when I give click over it
Bootstrap modal - popup window not showing
I am using following example
http://www.bootply.com/59864
But when I click on the button which triggers the pop up, background gets darker but window doesn't show. Any idea what's causing this? I am using bootstrap 3.2.0
<%# Page Title="" Language="C#" MasterPageFile="~/MasterPage.master" AutoEventWireup="true" CodeFile="CreateWorkbook.aspx.cs" Inherits="CreateWorkbook" %>
<asp:Content ID="Content0" ContentPlaceHolderID="head" runat="Server">
<script>
$(function () {
$('#myFormSubmit').click(function (e) {
e.preventDefault();
alert($('#myField').val());
/*
$.post('http://path/to/post',
$('#myForm').serialize(),
function(data, status, xhr){
// do something here with response;
});
*/
});
});
</script>
</asp:Content>
<asp:Content ID="Content1" ContentPlaceHolderID="ContentPlaceHolder1" Runat="Server">
<div class="row">
<div class="col-md-12 col-xs-12" style="margin-top: 10px">
<a data-toggle="modal" href="#myModal" role="button" class="btn btn-info btn-lg"><span class="glyphicon glyphicon-plus-sign">
</span>Add questions</a>
</div>
</div>
<div class="list-group col-md-8" style="margin-top:20px"> Questions list Q1: Name Q2: Location Q3: Outcome Q4: Next meeting date </div>
<div id="myModal" class="modal hide fade" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
<h3 id="myModalLabel">Modal header</h3>
</div>
<div class="modal-body">
<form id="myForm" method="post">
<input type="hidden" value="hello" id="myField">
<button id="myFormSubmit" type="submit">Submit</button>
</form>
</div>
<div class="modal-footer">
<button class="btn" data-dismiss="modal" aria-hidden="true">Close</button>
<button class="btn btn-primary">Save changes</button>
</div>
</div>
</asp:Content>
The working example is based on Bootstrap 2.3.1, if you are importing Bootstrap 3.3.0, then a working example could be: http://bootply.com/va3EnHE0MJ
HttpPost doesn't work into Modal Popup in MVC 4
I have view that has CompanyTable partial view. So this partial view has a CreateBankAccount partial view. Last partial view codes are
#model Invoice.Model.BankAccount
<script src="~/Scripts/jquery-1.7.1.min.js"></script>
<script src="~/Scripts/jquery.validate.min.js"></script>
<script src="~/Scripts/jquery.validate.unobtrusive.min.js"></script>
Launch demo modal
<div id="#Model.TaxID" class="modal hide fade" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
<h3 id="myModalLabel">Modal header</h3>
</div>
<div class="modal-body">
#using (Ajax.BeginForm("CreateModal", "CompanyController", new AjaxOptions { UpdateTargetId = "modal", HttpMethod = "post" }))
{
#Html.ValidationSummary(true)
<fieldset>
<legend>BankAccount</legend>
#Html.HiddenFor(model => model.ID)
<div class="editor-label">
#Html.LabelFor(model => model.BankName)
</div>
<div class="editor-field">
#Html.EditorFor(model => model.BankName)
#Html.ValidationMessageFor(model => model.BankName)
</div>
<div class="editor-label">
#Html.LabelFor(model => model.CorrespondentAccount)
</div>
<div class="editor-field">
#Html.EditorFor(model => model.CorrespondentAccount)
#Html.ValidationMessageFor(model => model.CorrespondentAccount)
</div>
<input type="submit" value="save" />
</fieldset>
}
</div>
<div class="modal-footer">
<button class="btn" data-dismiss="modal" aria-hidden="true">Close</button>
<input type="submit" class="btn btn-primary" value=" Save changes" data-dismiss="modal" />
</div>
</div>
so this partial view is modal popup. My problem is that when I want to creat bankAccount my HttpPost method doesn't work, and I return Index action. How I can fix it?