I am getting error 1364. Field 'dis' does not have a default value. I am going well with form and CRUD operation. In saving data in the database through form I got this error. Create form redirects to show view. I got this error when I click on the submit button of my form. I check my database data is not stored there.
Error:
Illuminate\Database\QueryException
SQLSTATE[HY000]: General error: 1364 Field 'dis' doesn't have a default value (SQL: insert into
`students` (`full_name`, `dob`, `gender`, `cnic`, `marital_Status`, `nationality`, `religion`,
`domicile`, `province`, `father_name`, `father_cnic`, `father_profession`, `guardian_name`,
`guardian_cnic`, `email`, `address`, `tel_landline`, `tel_office`, `cell1`, `cell2`,
`matric_obtained_marks`, `matric_total_marks`, `matric_marksheet_image`, `fsc_obtained_marks`,
`fsc_total_marks`, `fsc_marksheet_image`, `nmdcat_obtained_marks`, `nmdcat_total_marks`,
`nmdcat_result_image`, `updated_at`,
Here is my controller
class StudentsController extends Controller
{
/**
* Display a listing of the resource.
*
* #return \Illuminate\Http\Response
*/
public function index()
{
return view ('index');
}
/**
* Show the form for creating a new resource.
*
* #return \Illuminate\Http\Response
*/
public function create()
{
return view('create');
}
/**
* Store a newly created resource in storage.
*
* #param \Illuminate\Http\Request $request
* #return \Illuminate\Http\Response
*/
public function store(Request $request)
{
$student= new student;
$student->full_name=$request->full_name;
$student->dob=$request->dob;
$student->gender=$request->dis;
$student->cnic=$request->cnic;
$student->marital_Status=$request->marital_status;
$student->nationality=$request->nationality;
$student->religion=$request->religion;
$student->domicile=$request->domicile;
$student->province=$request->province;
$student->father_name=$request->father_name;
$student->father_cnic=$request->father_cnic;
$student->father_profession=$request->father_profession;
$student->guardian_name=$request->guardian_name;
$student->guardian_cnic=$request->guardian_cnic;
$student->email=$request->email;
$student->address=$request->address;
$student->tel_landline=$request->tel_lanline;
$student->tel_office=$request->tel_office;
$student->cell1=$request->cell1;
$student->cell2=$request->cell2;
$student->matric_obtained_marks=$request->matric_obtained_marks;
$student->matric_total_marks=$request->matric_total_marks;
$student->matric_marksheet_image=$request->matric_marksheet_image;
$student->fsc_obtained_marks=$request->fsc_obtained_marks;
$student->fsc_total_marks=$request->fsc_total_marks;
$student->fsc_marksheet_image=$request->fsc_marksheet_image;
$student->nmdcat_obtained_marks=$request->nmdcat_obtained_marks;
$student->nmdcat_total_marks=$request->nmdcat_total_marks;
$student->nmdcat_result_image=$request->nmdcat_result_image;
$student->save();
return redirect('/show');
}
Here is my form
<form action="/students" method="post">
{{csrf_field()}}
<div class="form-group col-md-9">
<label for="exampleFormControlInput1">Name of applicant:</label>
<input type="text" class="form-control" id="exampleFormControlInput1" name="full_name" placeholder="Enter your full name" required>
</div>
<div class="form-row">
<div class="form-group col-md-6">
<label for="example-date-input" class="col-6 col-form-label">Date of Birth:</label>
<div class="col-8">
<input class="form-control" type="date" value="2001-05-19" id="example-date-input" name="dob" required>
</div>
</div>
<div class="form-group col-md-6" id="gen">
<label for="example-date-input" class="col-3 col-form-label" id="gender">Gender:</label>
<div class="col-9" id="gnd">
<div class="form-check form-check-inline">
<label class="form-check-label">
<input class="form-check-input" type="radio" name="gender" id="inlineRadio1" value="male"> Male
</label>
</div>
<div class="form-check form-check-inline" id="fma">
<label class="form-check-label">
<input class="form-check-input" type="radio" name="gender" id="inlineRadio2" value="female"> Female
</label>
</div>
</div>
</div>
<div class="form-group col-md-4" id="dis">
<label for="exampleFormControlInput1" class="col-2 col-form-label">Disability:</label>
<div class="col-7">
<input class="form-control" type="text" id="exampleFormControlInput1" name="dis" required>
</div>
</div>
</div>
<div class="form-group col-md-9">
<label for="exampleFormControlInput1">CNIC:</label>
<input type="text" class="form-control" id="exampleFormControlInput1" name="cnic" placeholder="Enter your CNIC" required>
</div>
<div class="form-row">
<div class="form-group col-md-6">
<label for="example-date-input" class="col-6 col-form-label">Marital Status:</label>
<div class="col-6">
<input class="form-control" type="text" name="marital_status">
</div>
</div>
<div class="form-group col-md-5" id="nat">
<label for="example-date-input" class="col-4 col-form-label">Nationality:</label>
<div class="col-7">
<input class="form-control" type="text" name="nationality" required>
</div>
</div>
<div class="form-group col-md-5" id="rel">
<label for="example-date-input" class="col-4 col-form-label">Religion:</label>
<div class="col-7">
<input class="form-control" type="text" name="religion" required>
</div>
</div>
</div>
<div class="form-row">
<div class="form-group col-md-6">
<label for="example-date-input" class="col-4 col-form-label">Domicile:</label>
<div class="col-7">
<input class="form-control" type="text" name="domicile" placeholder="Your domicile" required>
</div>
</div>
<div class="form-group col-md-6" id="dom">
<label for="example-date-input" class="col-4 col-form-label">Province:</label>
<div class="col-7">
<input class="form-control" type="text" name="province" placeholder="Your province" required>
</div>
</div>
</div>
<div class="form-group col-md-9">
<label for="exampleFormControlInput1">Father Name:</label>
<input type="text" class="form-control" id="exampleFormControlInput1" name="father_name" placeholder="Enter your father name" required>
</div>
<div class="form-group col-md-9">
<label for="exampleFormControlInput1">Father CNIC:</label>
<input type="text" class="form-control" id="exampleFormControlInput1" name="father_cnic" placeholder="Enter father CNIC" required>
</div>
<div class="form-group col-md-9">
<label for="exampleFormControlInput1">Father Profession:</label>
<input type="text" class="form-control" id="exampleFormControlInput1" name="father_profession" placeholder="Enter father profession" required>
</div>
<div class="form-group col-md-9">
<label for="exampleFormControlInput1">Guardian Name:</label>
<input type="text" class="form-control" id="exampleFormControlInput1" name="guardian_name" placeholder="Enter your guardian name" required>
</div>
<div class="form-group col-md-9">
<label for="exampleFormControlInput1">Guardian CNIC:</label>
<input type="text" class="form-control" id="exampleFormControlInput1" name="guardian_cnic" placeholder="Enter guardian CNIC" required>
</div>
<div class="form-group col-md-9">
<label for="exampleFormControlInput1">Email Address:</label>
<input type="email" class="form-control" id="exampleFormControlInput1" name="email" placeholder="Enter your email address" required>
</div>
<div class="form-group col-md-9">
<label for="exampleFormControlTextarea1">Permanent and Mailing Address:</label>
<textarea class="form-control" id="exampleFormControlTextarea1" rows="5" name="address" placeholder="Enter your address" required></textarea>
</div>
<div class="form-row">
<div class="form-group col-md-8">
<label for="example-date-input" class="col-5 col-form-label">Tel (Landline):</label>
<div class="col-5">
<input class="form-control" type="tel" name="tel_landline" placeholder="Landline">
</div>
</div>
<div class="form-group col-md-8" id="tel1">
<label for="example-date-input" class="col-5 col-form-label">Tel (Office):</label>
<div class="col-5">
<input class="form-control" type="tel" name="tel_office" placeholder="Office">
</div>
</div>
</div>
<div class="form-row">
<div class="form-group col-md-7">
<label for="example-date-input" class="col-4 col-form-label">Cell 1:</label>
<div class="col-7">
<input class="form-control" type="tel" name="cell1" placeholder="0***-*******" required>
</div>
</div>
<div class="form-group col-md-7" id="cell2">
<label for="example-date-input" class="col-4 col-form-label">Cell 2:</label>
<div class="col-7">
<input class="form-control" type="tel" name="cell2" placeholder="0***-*******" required>
</div>
</div>
</div>
<label id="mat">Matric/O Level Marks:</label>
<div class="form-row" id="mar">
<br>
<div class="form-group col-md-8">
<label for="example-date-input" class="col-5 col-form-label">Obtained Marks:</label>
<div class="col-5">
<input class="form-control" type="number" name="matric_obtained_marks" required>
</div>
</div>
<div class="form-group col-md-8" id="tom">
<label for="example-date-input" class="col-5 col-form-label">Total Marks:</label>
<div class="col-5">
<input class="form-control" type="number" max="1100" name="matric_total_marks" required>
</div>
</div>
</div>
<label id="mat">Matric/O Level Marksheet:</label>
<div class="input-group col-md-9">
<div class="custom-file">
<input type="file" class="custom-file-input" id="inputGroupFile04" name="matric_marksheet_image" >
<label class="custom-file-label" for="inputGroupFile04">Choose file</label>
</div>
<div class="input-group-append">
<button type="button" class="btn btn-primary" id="upl">Upload</button>
</div>
</div>
<small id="mat" class="form-text text-muted">Upload scanned picture of your Matric/O Level marksheet</small>
<br>
<label id="mat">FSc/A-Level Marks:</label>
<div class="form-row" id="mar">
<br>
<div class="form-group col-md-8">
<label for="example-date-input" class="col-5 col-form-label">Obtained Marks:</label>
<div class="col-5">
<input class="form-control" type="number" name="fsc_obtained_marks" required>
</div>
</div>
<div class="form-group col-md-8" id="tom">
<label for="example-date-input" class="col-5 col-form-label">Total Marks:</label>
<div class="col-5">
<input class="form-control" type="number" max="1100" name="fsc_total_marks" required>
</div>
</div>
</div>
<label id="mat">FSc/A-Level Marksheet:</label>
<div class="input-group col-md-9">
<div class="custom-file">
<input type="file" class="custom-file-input" id="inputGroupFile04" name="fsc_marksheet_image" >
<label class="custom-file-label" for="inputGroupFile04">Choose file</label>
</div>
<div class="input-group-append">
<button type="button" class="btn btn-primary" id="upl">Upload</button>
</div>
</div>
<small id="mat" class="form-text text-muted">Upload scanned picture of your FSc/A-Level marksheet</small>
<br>
<label id="mat">NMDCAT Marks:</label>
<div class="form-row" id="mar">
<br>
<div class="form-group col-md-8">
<label for="example-date-input" class="col-5 col-form-label">Obtained Marks:</label>
<div class="col-5">
<input class="form-control" type="number" name="nmdcat_obtained_marks" required>
</div>
</div>
<div class="form-group col-md-8" id="tom">
<label for="example-date-input" class="col-5 col-form-label">Total Marks:</label>
<div class="col-5">
<input class="form-control" type="number" name="nmdcat_total_marks" required>
</div>
</div>
</div>
<label id="mat">NMDCAT Result:</label>
<div class="input-group col-md-9">
<div class="custom-file">
<input type="file" class="custom-file-input" id="inputGroupFile04">
<label class="custom-file-label" for="inputGroupFile04" name="nmdcat_result_image" >Choose file</label>
</div>
<div class="input-group-append">
<button type="button" class="btn btn-primary" id="upl">Upload</button>
</div>
</div>
<small id="mat" class="form-text text-muted">Upload scanned picture of your NMDCAT result</small>
<br>
<button type="submit" class="btn btn-success col-md-2" id="sig" align="center" center>Submit</button>
</form>
</div>
#endsection
Here is my migration:
public function up()
{
Schema::create('students', function (Blueprint $table) {
$table->id();
$table->string('full_name');
$table->date('dob');
$table->text('gender');
$table->text('dis');
$table->biginteger('cnic');
$table->text('marital_status');
$table->text('nationality');
$table->text('religion');
$table->text('domicile');
$table->text('province');
$table->text('father_name');
$table->biginteger('father_cnic');
$table->text('father_profession');
$table->text('guardian_name');
$table->biginteger('guardian_cnic');
$table->text('email');
$table->text('address');
$table->biginteger('tel_landline');
$table->biginteger('tel_office');
$table->biginteger('cell1');
$table->biginteger('cell2');
$table->integer('matric_obtained_marks');
$table->integer('matric_total_marks');
$table->binary('matric_marksheet_image');
$table->integer('fsc_obtained_marks');
$table->integer('fsc_total_marks');
$table->binary('fsc_marksheet_image');
$table->integer('nmdcat_obtained_marks');
$table->integer('nmdcat_total_marks');
$table->binary('nmdcat_result_image');
$table->timestamps();
});
}
You are not saving any data to dis field in your database, instead dis input field is saving data to gender field in your database. Do it like this
$student->dis=$request->dis;
or assign some default value to dis field in your database.
Here in your table dis column is not nullable. so when you save any row this column need to fill. To solve this problem you need to nullable this column or set a default value for this. add a new migration file & make this column nullable or set default value.
$table->text('dis')->nullable();
or
$table->text('dis')->default('your_disere_value');
Or save dis column value from blade to controller.
$student->dis=$request->dis;
You have to modify your primary key to NOT NULL like this:
ALTER TABLE employee_details MODIFY emp_id int NOT NULL AUTO_INCREMENT;
Related
I am a beginner in web development, I used have an html elements, like textbox and other type of elements, I want to use them as my object and when they have a value and click a button, it will save the value of all the elements in mysql.
I have a code like this, but it cannot be inserted and anything does not happen when clicking a button.
Please help.
PHP:
<?php
define('DB_SERVER', 'localhost');
define('DB_USERNAME', 'root');
define('DB_PASSWORD', '');
define('DB_DATABASE', 'ytp');
$db = mysqli_connect(DB_SERVER,DB_USERNAME,DB_PASSWORD,DB_DATABASE);
if(!$db ) {
die('Could not connect: ' . mysqli_error());
}
$fname = "";
$mname = "";
$lname = "";
$funame = "";
$cnum = "";
$bday = "";
$age = "";
$add = "";
if (isset($_POST['submit'])){
$fname = $_POST['fName'];
$mname = $_POST['mName'];
$lname = $_POST['lName'];
$funame = $_POST['fuName'];
$cnum = $_POST['Cnumber'];
$bday = $_POST['bday'];
$age = $_POST['age'];
$add = $_POST["address"];
}
$sql = "INSERT INTO employee ".
"(fName,mName,lName,fuName,cNumber,bDay,Age,Address) ".
"VALUES ('$fname','$mname','$lname','$funame','$cnum','$bday','$age','$add' )";
if (! mysqli_query($db , $sql)){
echo 'Cannot Insert';
}
else{
echo 'Success';
}
?>
HTML:
<div class="content">
<div class="row">
<div class="col-md-10">
<div class="card">
<div class="card-header">
<h5 class="title">Add User Information</h5>
</div>
<div class="card-body">
<form method="POST" action="php_functions\saveEmployee.php" name="INSERT">
<div class="row">
<div class="col-md-5 pr-md-1">
<div class="form-group">
<label>Company (disabled)</label>
<input type="text" class="form-control" disabled="" placeholder="Company" value="Benchmark Valuer's Inc.">
</div>
</div>
<div class="col-md-3 px-md-1">
<div class="form-group">
<label>ID</label>
<input type="text" class="form-control" placeholder="User ID" value="" id="id" name ="id" disabled>
</div>
</div>
<div class="col-md-4 pl-md-1">
<div class="form-group">
<label for="exampleInputEmail1">Email address</label>
<input type="email" class="form-control" placeholder="s.sample#gmail.com" id="email" name ="email">
</div>
</div>
</div>
<div class="row">
<div class="col-md-4 pr-md-1">
<div class="form-group">
<label>First Name</label>
<input type="text" class="form-control" placeholder="First Name" id="fName" name ="fName">
</div>
</div>
<div class="col-md-4 pl-md-1">
<div class="form-group">
<label>Middle Name</label>
<input type="text" class="form-control" placeholder="Middle Name" id="mName" name ="mName">
</div>
</div>
<div class="col-md-4 pl-md-1">
<div class="form-group">
<label>Last Name</label>
<input type="text" class="form-control" placeholder="Last Name" id="lName" name ="lName">
</div>
</div>
<div class="col-md-4 pl-md-1" hidden>
<div class="form-group">
<label>Fullname</label>
<input type="text" class="form-control" placeholder="Full Name" id="fuName" name ="fuName">
</div>
</div>
</div>
<div class="row">
<div class="col-md-4 pr-md-1">
<div class="form-group">
<label>Contact Number</label>
<input type="tel" class="form-control" placeholder="Contact Number" id="Cnumber" name="Cnumber">
</div>
</div>
<div class="col-md-4 pl-md-1">
<div class="form-group">
<label>Age</label>
<input type="number" class="form-control" placeholder="Age" id="age" name="age">
</div>
</div>
<div class="col-md-4 pl-md-1">
<div class="form-group">
<label>Birthday</label>
<input type="date" class="form-control" placeholder="Birthday" id="bday" name="bday">
</div>
</div>
</div>
<div class="row">
<div class="col-md-12">
<div class="form-group">
<label>Address</label>
<input type="text" class="form-control" placeholder="Home Address" id="address" name ="address">
</div>
</div>
</div>
<div class="row">
<div class="col-md-4 pr-md-1">
<div class="form-group">
<label>Username</label>
<input type="text" class="form-control" placeholder="Username" id="uName">
</div>
</div>
<div class="col-md-4 px-md-1">
<div class="form-group">
<label>Password</label>
<input type="password" class="form-control" placeholder="Password" id="pWord">
</div>
</div>
<div class="col-md-4 pl-md-1">
<div class="form-group">
<label>UserType</label>
<input type="number" class="form-control" placeholder="0" id="uType">
</div>
</div>
</div>
<div class="row" hidden>
<div class="col-md-12">
<div class="form-group">
<label>Image Path:</label>
<input type="text" class="form-control" placeholder="C:\\" id="imageURL">
</div>
</div>
</div>
</form>
</div>
<div class="card-footer">
<button type="submit" class="btn btn-fill btn-primary" id="submit" name="submit">Save</button>
<button class="btn btn-fill btn-success" id="btnBrowse">Browse</button>
<button class="btn btn-fill btn-danger" id="btnCancel">Cancel</button>
</div>
</div>
</div>
</div>
</div>
Your HTML form is closing before submit button. You should close that after submit button and also need to manage hierarchy of opening form tag as below:
<form method="POST" action="php_functions\saveEmployee.php" name="INSERT">
<div class="card-body">
<div class="row">
<div class="col-md-5 pr-md-1">
<div class="form-group">
<label>Company (disabled)</label>
<input type="text" class="form-control" disabled="" placeholder="Company" value="Benchmark Valuer's Inc.">
</div>
</div>
<div class="col-md-3 px-md-1">
<div class="form-group">
<label>ID</label>
<input type="text" class="form-control" placeholder="User ID" value="" id="id" name ="id" disabled>
</div>
</div>
<div class="col-md-4 pl-md-1">
<div class="form-group">
<label for="exampleInputEmail1">Email address</label>
<input type="email" class="form-control" placeholder="s.sample#gmail.com" id="email" name ="email">
</div>
</div>
</div>
<div class="row">
<div class="col-md-4 pr-md-1">
<div class="form-group">
<label>First Name</label>
<input type="text" class="form-control" placeholder="First Name" id="fName" name ="fName">
</div>
</div>
<div class="col-md-4 pl-md-1">
<div class="form-group">
<label>Middle Name</label>
<input type="text" class="form-control" placeholder="Middle Name" id="mName" name ="mName">
</div>
</div>
<div class="col-md-4 pl-md-1">
<div class="form-group">
<label>Last Name</label>
<input type="text" class="form-control" placeholder="Last Name" id="lName" name ="lName">
</div>
</div>
<div class="col-md-4 pl-md-1" hidden>
<div class="form-group">
<label>Fullname</label>
<input type="text" class="form-control" placeholder="Full Name" id="fuName" name ="fuName">
</div>
</div>
</div>
<div class="row">
<div class="col-md-4 pr-md-1">
<div class="form-group">
<label>Contact Number</label>
<input type="tel" class="form-control" placeholder="Contact Number" id="Cnumber" name="Cnumber">
</div>
</div>
<div class="col-md-4 pl-md-1">
<div class="form-group">
<label>Age</label>
<input type="number" class="form-control" placeholder="Age" id="age" name="age">
</div>
</div>
<div class="col-md-4 pl-md-1">
<div class="form-group">
<label>Birthday</label>
<input type="date" class="form-control" placeholder="Birthday" id="bday" name="bday">
</div>
</div>
</div>
<div class="row">
<div class="col-md-12">
<div class="form-group">
<label>Address</label>
<input type="text" class="form-control" placeholder="Home Address" id="address" name ="address">
</div>
</div>
</div>
<div class="row">
<div class="col-md-4 pr-md-1">
<div class="form-group">
<label>Username</label>
<input type="text" class="form-control" placeholder="Username" id="uName">
</div>
</div>
<div class="col-md-4 px-md-1">
<div class="form-group">
<label>Password</label>
<input type="password" class="form-control" placeholder="Password" id="pWord">
</div>
</div>
<div class="col-md-4 pl-md-1">
<div class="form-group">
<label>UserType</label>
<input type="number" class="form-control" placeholder="0" id="uType">
</div>
</div>
</div>
<div class="row" hidden>
<div class="col-md-12">
<div class="form-group">
<label>Image Path:</label>
<input type="text" class="form-control" placeholder="C:\\" id="imageURL">
</div>
</div>
</div>
</div>
<div class="card-footer">
<button type="submit" class="btn btn-fill btn-primary" id="submit" name="submit">Save</button>
<button class="btn btn-fill btn-success" id="btnBrowse">Browse</button>
<button class="btn btn-fill btn-danger" id="btnCancel">Cancel</button>
</div>
</form>
Hope it helps you.
the form has been closed before the submit button.
the </form> tag should be placed after the <div class="card-footer">...</div>.
please try it. hope it will help.
For my website, when this particular page is clicked I want the form to be populated with data from the database. Here is the code for the form:
<form class="form-horizontal" role="form" method="post" action="{{url('/company-profile/update')}}">
{{ csrf_field() }}
#foreach($getAllDetails as $list)
<div class="form-group">
<div class="col-sm-10">
<label for="companyname" class="control-label">Company Name</label>
<input type="text" class="form-control" id="companyname" name="companyname" placeholder="Enter Company Name" value={{$list->companyName}}>
</div>
</div>
<div class="form-group">
<div class="col-xs-5 col-sm-4 col-md-3">
<label for="shortCode" class="control-label">Short Code</label>
<input class="form-control" id="shortCode" name="shortCode" placeholder="Short Code" value={{$list->shortCode}}>
</div>
<div class="col-xs-7 col-sm-6 col-md-7">
<label for="telnum" class="control-label">Telephone Number</label>
<input type="tel" class="form-control" id="telnum" name="telnum" placeholder="Tel. number" value={{$list->phoneNo}}>
</div>
</div>
<div class="form-group">
<div class="col-sm-10">
<label for="emailid" class="control-label">Email</label>
<input type="email" class="form-control" id="emailid" name="emailid" placeholder="Email" value={{$list->emailAddress}}>
</div>
</div>
<div class="form-group">
<div class="col-sm-10">
<label for="logoPath" class="control-label">Logo Path</label>
<input type="" class="form-control" id="logoPath" name="logoPath" placeholder="Enter Logo Path" value={{$list->logoPath}}>
</div>
</div>
<div class="form-group">
<div class="col-sm-10">
<label for="feedback" class="control-label">Contact Address</label>
<textarea class="form-control" id="address" name="address" rows="2" value={{$list->contactAddress}}></textarea>
</div>
</div>
#endforeach
<div class="form-group">
<div class="col-sm-10">
<button type="submit" class="btn btn-success">Submit</button>
</div>
</div>
</form>
This issue is:
For example, if I want to fetch the company name {{$list->companyName}} only the first word gets displayed. For example, If the company's name is National Film Institute, only National gets displayed.
Here is code the for my index function in the controller:
public function index()
{
$data['getAllDetails']= DB::table('tblcompany')->get();
return view('companyProfile.companyProfile', $data);
}
Change
value={{$list->your_field}}
to
value="{{$list->your_field}}"
I'm a beginner at Bootstrap. When I press Tab, I want to select the next tab.
Click loan_form.php and then the cursor is automatically in Loan Name. After you complete it and press tab on the keyboard, the cursor will move to the Department label instead of the Device code label:
<div class="row">
<div class="col-md-6 mb-3">
<label>* Loan Name</label>
<input type="text" class="form-control" name="loan_name" id="loan_name" placeholder="Full Name" required>
</div>
<div class="col-md-6 mb-3">
<label>Device Code</label>
<select name="device_code" class="form-control" id="device_code" data-validetta="required" ></select>
</div>
</div>
<br />
<div class="row">
<div class="col-md-6 mb-3">
<label>* Department</label>
<input type="text" class="form-control" name="dept" id="dept" placeholder="Department" required></div>
<div class="col-md-6 mb-3">
<label>Brand</label>
<input type="text" class="form-control" name="device_brand" id="device_brand" placeholder="Brand" disabled required>
</div>
Use tabindex html tag in all the input fields. See reformatted code here:
<div class="row">
<div class="col-md-6 mb-3">
<label>* Loan Name</label>
<input type="text" class="form-control" name="loan_name" id="loan_name" placeholder="Full Name" required tabindex="1">
</div>
<div class="col-md-6 mb-3">
<label>Device Code</label>
<select name="device_code" class="form-control" id="device_code" data-validetta="required" tabindex="2"></select>
</div>
</div>
<br />
<div class="row">
<div class="col-md-6 mb-3">
<label>* Department</label>
<input type="text" class="form-control" name="dept" id="dept" placeholder="Department" required tabindex="3"></div>
<div class="col-md-6 mb-3">
<label>Brand</label>
<input type="text" class="form-control" name="device_brand" id="device_brand" placeholder="Brand" disabled required tabindex="4">
</div>
I have a contact form in php which has has two tabs containing two different contact forms. I want to get all the values of both the forms and send it as an email. I have coded it for one of the tab, but i am not getting the values of each of the field in the contact form in that tab. Can anyone tell how to do this ? My code is shown below for one of the tab:
<form name="contactForm" id='contact_form' method="post" action=''>
<div tab-id="1" class="tab active">
<div class="form-inline">
<div class="form-group col-sm-12 padd">
<input type="text" class="form-control" name="name" id="exampleInputName" placeholder="name" >
</div>
<div class="form-group col-sm-12 padd">
<input type="email" class="form-control" name="email" id="exampleInputEmail" placeholder="email address">
</div>
<div class="form-group col-sm-12 padd">
<input type="text" class="form-control" name="telephone" placeholder="phone">
</div>
<div class="form-group col-sm-12 padd">
<input type="text" class="form-control" name="Country" id="exampleInputName" placeholder="Country" >
</div>
<div class="form-group col-sm-12 padd">
<textarea class="form-control" name="message" rows="3" id="exampleInputMessage" placeholder="message" ></textarea>
</div>
</div>
<div class="form-group col-xs-12 padd">
<div id='mail_success' class='success' style="display:none;">Your message has been sent successfully.
</div><!-- success message -->
<div id='mail_fail' class='error' style="display:none;"> Sorry, error occured this time sending your message.
</div><!-- error message -->
</div>
<div class="form-group col-xs-8 padd">
<div class="g-recaptcha" data-sitekey="6LcJqyITAAAAABks5hnD6U_2ptu09RiXYOHvNNud"></div>
</div>
<div class="form-group col-sm-4 padd" id='submit'>
<input type="submit" id='send_message' name="send" class="btn btn-lg costom-btn" value="send">
</div>
</div>
<div tab-id="2" class="tab">
<div class="form-inline">
<div class="form-group col-sm-12 padd">
<input type="text" class="form-control" name="name" id="exampleInputName" placeholder="full name" >
</div>
<div class="form-group col-sm-6 padd">
<input type="email" class="form-control" name="email" id="exampleInputEmail" placeholder="Email">
</div>
<div class="form-group col-sm-6 pad">
<input type="text" class="form-control" name="telephone" placeholder="Phone">
</div>
<div class="form-group col-sm-12 padd">
<input type="text" class="form-control" name="subject" id="exampleInputSubject" placeholder="Tell us about your project in your own words ?" >
</div>
<div class="form-group col-sm-12 padd">
<input type="text" class="form-control" name="subject" id="exampleInputSubject" placeholder="Tell us about you or your company" >
</div>
<div class="form-group col-sm-12 padd">
<p>Which services are you interested in ?</p>
<p>
<input type="checkbox" id="test1" />
<label for="test1"></label>
</p>
<p>
<input type="checkbox" id="test2"/>
<label for="test2"></label>
</p>
<p>
<input type="checkbox" id="test3"/>
<label for="test3"></label>
</p>
<p>
<input type="checkbox" id="test4"/>
<label for="test4"></label>
</p>
<p>
<input type="checkbox" id="test5"/>
<label for="test5"></label>
</p>
<p>
<input type="checkbox" id="test6"/>
<label for="test6"></label>
</p>
</div>
</div>
<div class="form-group col-xs-12">
<div id='mail_success' class='success' style="display:none;">Your message has been sent successfully.
</div><!-- success message -->
<div id='mail_fail' class='error' style="display:none;"> Sorry, error occured this time sending your message.
</div><!-- error message -->
</div>
<div class="form-group col-sm-12" id='submit'>
<input type="submit" id='send_message' class="btn btn-lg costom-btn" value="send">
</div>
</div>
</form>
Please try with this code.
<form name="contactForm" id='contact_form' method="post" action='php/email.php'>
//This is the first tab
<div tab-id="1" class="tab active">
<div class="form-inline">
<div class="form-group col-sm-12 padd">
<input type="text" class="form-control" name="name" id="exampleInputName" placeholder="name" >
</div>
<div class="form-group col-sm-12 padd">
<input type="email" class="form-control" name="email" id="exampleInputEmail" placeholder="email address">
</div>
<div class="form-group col-sm-12 padd">
<input type="text" class="form-control" name="telephone" placeholder="phone">
</div>
<div class="form-group col-sm-12 padd">
<input type="text" class="form-control" name="Country" id="exampleInputName" placeholder="Country" >
</div>
<div class="form-group col-sm-12 padd">
<textarea class="form-control" name="message" rows="3" id="exampleInputMessage" placeholder="message" ></textarea>
</div>
</div>
<div class="form-group col-xs-12 padd">
<div id='mail_success' class='success' style="display:none;">Your message has been sent successfully.
</div><!-- success message -->
<div id='mail_fail' class='error' style="display:none;"> Sorry, error occured this time sending your message.
</div><!-- error message -->
</div>
<div class="form-group col-xs-8 padd">
<div class="g-recaptcha" data-sitekey="6LcJqyITAAAAABks5hnD6U_2ptu09RiXYOHvNNud"></div>
</div>
<div class="form-group col-sm-4 padd" id='submit'>
<input type="submit" id='send_message' name="send" class="btn btn-lg costom-btn" value="send">
</div>
</div>
//This is the Second tab
<div tab-id="2" class="tab">
<div class="form-inline">
<div class="form-group col-sm-12 padd">
<input type="text" class="form-control" name="name" id="exampleInputName" placeholder="full name" >
</div>
<div class="form-group col-sm-6 padd">
<input type="email" class="form-control" name="email" id="exampleInputEmail" placeholder="Email">
</div>
<div class="form-group col-sm-6 pad">
<input type="text" class="form-control" name="telephone" placeholder="Phone">
</div>
<div class="form-group col-sm-12 padd">
<input type="text" class="form-control" name="subject" id="exampleInputSubject" placeholder="Tell us about your project in your own words ?" >
</div>
<div class="form-group col-sm-12 padd">
<input type="text" class="form-control" name="subject" id="exampleInputSubject" placeholder="Tell us about you or your company" >
</div>
<div class="form-group col-sm-12 padd">
<p>Which services are you interested in ?</p>
<form action="#">
<p>
<input type="checkbox" id="test1" />
<label for="test1">Web Design & development</label>
</p>
<p>
<input type="checkbox" id="test2"/>
<label for="test2">E-Commerce Solutions</label>
</p>
<p>
<input type="checkbox" id="test3"/>
<label for="test3">Digital Marketing</label>
</p>
<p>
<input type="checkbox" id="test4"/>
<label for="test4">SEO Solutions</label>
</p>
<p>
<input type="checkbox" id="test5"/>
<label for="test5">2D&3D Animation</label>
</p>
<p>
<input type="checkbox" id="test6"/>
<label for="test6">Game development</label>
</p>
</div>
</div>
<div class="form-group col-xs-12">
<div id='mail_success' class='success' style="display:none;">Your message has been sent successfully.
</div><!-- success message -->
<div id='mail_fail' class='error' style="display:none;"> Sorry, error occured this time sending your message.
</div><!-- error message -->
</div>
<div class="form-group col-sm-12" id='submit'>
<input type="submit" id='send_message' class="btn btn-lg costom-btn" value="send">
</div>
</form>
</div>
Assuming the following form-tab html structure:
<form name="contactForm" id='contact_form' method="post" action=''>
<div tab-id="1" class="tab active">
...
<input name="field1" value="" class="form-control" />
<input name="field2" value="" class="form-control" />
</div>
<div tab-id="2" class="tab">
...
<input name="field1" value="" class="form-control" />
<input name="field2" value="" class="form-control" />
</div>
</form>
As your div tabs have not attribute called id, and the class attribute you assigned is the same for every tab, it is not clear to see how to define the jquery selector for the inputs within those tabs you created.
You can access the values of each tab, using jquery as follows:
var fields = {}
fields.tab1 = {}
fields.tab1.field1 = $('div[tab-id=1] input[name=field1]').val()
fields.tab1.field2 = $('div[tab-id=1] input[name=field2]').val()
fields.tab2 = {}
fields.tab2.field1 = $('div[tab-id=2] input[name=field1]').val()
fields.tab2.field2 = $('div[tab-id=2] input[name=field2]').val()
Here is the fiddle of the working example.
var datastring = $("#contact_form").serialize();
alert(datastring);
try this in jquery after , you wiil get all the elements values between the
...
here data strings gives output as below
name=tj&email=tj#gmail.com&telephone=8888888888&Country=ind&message=msdfdf&name=tj&email=tj#gmail.com&telephone=12345689&subject=sub&subject=sub
I work on from to add more than one device when user click on add more
But How can I group multiple fields with same name as array for every device from this form, my server side language is PHP.
<form>
<div class="row">
<div class="col-md-12">
<div class="widget stacked">
<div class="widget-header">
<i class="icon-hdd"></i>
<h3>Remove Devices</h3> <a class="btn label label-success add_new_device">Add more</a>
</div>
<div class="widget-content">
<div class="form-group">
<label for="device_name">Device Name</label>
<input class="form-control" data-validation="length" data-validation-length="max128" data-validation-optional="true" name="device[device_name][]" type="text">
</div>
<div class="form-group">
<label for="device_description">Device Description</label>
<input class="form-control" data-validation="length" data-validation-length="max255" data-validation-optional="true" name="device[device_description][]" type="text">
</div>
<div class="form-group">
<label for="device_url">Device Url</label>
<input class="form-control" data-validation="url" data-validation-optional="true" data-validation-help="Ex: http://000.000.000.000/index.cgi" name="device[device_url][]" type="url">
</div>
<div class="form-group">
<label for="device_ip4">IP4</label>
<input class="form-control" data-validation="length" data-validation-length="max15" data-validation-optional="true" data-validation-help="Ex: 000.000.000.000" name="device[device_ip4][]" type="text">
</div>
<div class="form-group">
<label for="device_ip6">IP6</label>
<input class="form-control" data-validation="length" data-validation-length="max45" data-validation-help="Ex: 0000:0000:0000:0000:0000:0000" name="device[][device_ip6]" type="text">
</div>
<div class="form-group">
<label for="device_username">Device Username</label>
<input class="form-control" data-validation="length" data-validation-length="max128" data-validation-optional="true" name="device[][device_username]" type="text">
</div>
<div class="form-group">
<label for="device_password">Device Password</label>
<input class="form-control" data-validation="length" data-validation-length="max128" data-validation-optional="true" name="device[][device_password]" type="text">
</div>
</div>
</div>
</div>
</div>
<div class="row">
<div class="col-md-12">
<div class="widget stacked">
<div class="widget-header">
<i class="icon-hdd"></i>
<h3>Remove Devices</h3> <a class="btn label label-success add_new_device">Add more</a>
</div>
<div class="widget-content">
<div class="form-group">
<label for="device_name">Device Name</label>
<input class="form-control" data-validation="length" data-validation-length="max128" data-validation-optional="true" name="device[device_name][]" type="text">
</div>
<div class="form-group">
<label for="device_description">Device Description</label>
<input class="form-control" data-validation="length" data-validation-length="max255" data-validation-optional="true" name="device[device_description][]" type="text">
</div>
<div class="form-group">
<label for="device_url">Device Url</label>
<input class="form-control" data-validation="url" data-validation-optional="true" data-validation-help="Ex: http://000.000.000.000/index.cgi" name="device[device_url][]" type="url">
</div>
<div class="form-group">
<label for="device_ip4">IP4</label>
<input class="form-control" data-validation="length" data-validation-length="max15" data-validation-optional="true" data-validation-help="Ex: 000.000.000.000" name="device[device_ip4][]" type="text">
</div>
<div class="form-group">
<label for="device_ip6">IP6</label>
<input class="form-control" data-validation="length" data-validation-length="max45" data-validation-help="Ex: 0000:0000:0000:0000:0000:0000" name="device[][device_ip6]" type="text">
</div>
<div class="form-group">
<label for="device_username">Device Username</label>
<input class="form-control" data-validation="length" data-validation-length="max128" data-validation-optional="true" name="device[][device_username]" type="text">
</div>
<div class="form-group">
<label for="device_password">Device Password</label>
<input class="form-control" data-validation="length" data-validation-length="max128" data-validation-optional="true" name="device[][device_password]" type="text">
</div>
</div>
</div>
</div>
</div>
<div class="row">
<div class="col-md-12">
<div class="widget stacked">
<div class="widget-header">
<i class="icon-hdd"></i>
<h3>Remove Devices</h3> <a class="btn label label-success add_new_device">Add more</a>
</div>
<div class="widget-content">
<div class="form-group">
<label for="device_name">Device Name</label>
<input class="form-control" data-validation="length" data-validation-length="max128" data-validation-optional="true" name="device[device_name][]" type="text">
</div>
<div class="form-group">
<label for="device_description">Device Description</label>
<input class="form-control" data-validation="length" data-validation-length="max255" data-validation-optional="true" name="device[device_description][]" type="text">
</div>
<div class="form-group">
<label for="device_url">Device Url</label>
<input class="form-control" data-validation="url" data-validation-optional="true" data-validation-help="Ex: http://000.000.000.000/index.cgi" name="device[device_url][]" type="url">
</div>
<div class="form-group">
<label for="device_ip4">IP4</label>
<input class="form-control" data-validation="length" data-validation-length="max15" data-validation-optional="true" data-validation-help="Ex: 000.000.000.000" name="device[device_ip4][]" type="text">
</div>
<div class="form-group">
<label for="device_ip6">IP6</label>
<input class="form-control" data-validation="length" data-validation-length="max45" data-validation-help="Ex: 0000:0000:0000:0000:0000:0000" name="device[][device_ip6]" type="text">
</div>
<div class="form-group">
<label for="device_username">Device Username</label>
<input class="form-control" data-validation="length" data-validation-length="max128" data-validation-optional="true" name="device[][device_username]" type="text">
</div>
<div class="form-group">
<label for="device_password">Device Password</label>
<input class="form-control" data-validation="length" data-validation-length="max128" data-validation-optional="true" name="device[][device_password]" type="text">
</div>
</div>
</div>
</div>
</div>
</form>
Name your fields like devices[0][description], devices[1][description] and so on.
If every object has the exact same number of fields and every one is a new record - you can use devices[][description] and browser will fill indexes for you, but this can lead to bugs in the future, if you decide to use same form for editing records.
Also see How to get form input array into PHP array