Using Laravel I created a form where dynamically input fields can be added and remove using jQuery.
I am now trying to insert the data into the database, there I encounter a problem. My database exists of two tables; Tasks and issues.
The 'issue' table is linked to the tasks table bij task_id. This task_id should be also sent to the database but I can't get it, wright. See my code below.
Thanks for the help.
IssueController.php
The first method works but then my task id "null". All records are inserted from all fields.
The second method only adds the data of 1 field but it adds the correct id.
public function store(Request $request, Issue $issue, Task $task)
{
## First method
// foreach($request->issueInfo as $key => $value) {
// Issue::create($value);
// }
## Second method
foreach ($request->issueInfo as $key => $name) {
dd($name);
$names[] = [
'task_id' => $task->id,
'issue_name' => $name,
'issue_time' => $name,
'issue_date' => $name,
'issue_type' => $name,
];
}
Issue::insert($names);
return back();
}
web.php
Route::post('/tasks/{task}/issues', 'IssueController#store');
show.blade.php
#extends('layout')
#section('content')
<script>
$(document).ready(function() {
var i = 1;
$('.addmore').click(function(){
i++;
$('#dynamicFields').append('<div class="form-group"><label for="issue_name">Issue Name</label><select class="form-control" name="issueInfo['+i+'][issue_name]"><option></option><option value="Error">Error</option><option value="Grammer">Grammer</option><option value="Undefined">Undefined</option><option value="Typpo">Typpo</option><option value="No errors">No errors</option></select></div><div class="form-group"><label for="issue_date" class="label">Issue Date</label><input class="form-control" type="date" name="issueInfo['+i+'][issue_date]"></div><div class="form-group"><label for="issue_time" class="label">Issue Time</label><input class="form-control" type="time" name="issueInfo['+i+'][issue_time]" ></div><div class="form-group"><label for="issue_type" class="label">Issue Type</label><select class="form-control" name="issueInfo['+i+'][issue_type]"><option></option><option value="False45">False45</option><option value="False104">False104</option></select></div><div class="form-group"><button type="button" class="btn btn-danger remove-field">Remove</button></div>');
});
// Removing fields
$('#dynamicFields').on('click', '.remove-field', function(){
$(this).parents('div').remove(); i--;
})
});
</script>
<div class="form-group"><label for="issue_name">Name</label></div>
<head>Testing the creation of multiple fields</head>
<form action="/tasks/{{$task->id}}/issues" method="post" >
#csrf
<div id="dynamicFields">
<div class="form-group">
<label for="issue_name">Issue Name</label>
<select class="form-control" name="issueInfo[0][issue_name]">
<option></option>
<option value="Error">Error</option>
<option value="Grammer">Grammer</option>
<option value="Undefined">Undefined</option>
<option value="Typpo">Typpo</option>
<option value="No errors">No errors</option>
</select>
</div>
<div class="form-group">
<label for="issue_date" class="label">Issue Date</label>
<input class="form-control" type="date" name="issueInfo[0][issue_date]" value="{{old('issue_date')}}">
</div>
<div class="form-group">
<label for="issue_time" class="label">Issue Time</label>
<input class="form-control" type="time" name="issueInfo[0][issue_time]" value="{{old('issue_time')}}">
</div>
<div class="form-group">
<label for="issue_type" class="label">Issue Type</label>
<select class="form-control" name="issueInfo[0][issue_type]">
<option></option>
<option value="False45">False45</option>
<option value="False104">False104</option>
</select>
</div>
<div class="form-group">
<input type="button" name="submit" id="submit" class="btn btn-primary addmore" value="+" />
</div>
<div class="form-group">
<button type="submit" class="btn btn-primary">New Location</button>
</div>
</div>
</form>
#endsection
Output when I do dd($names) in my controller
array:1 [▼
0 => array:5 [▼
"task_id" => 1
"issue_name" => array:4 [▼
"issue_name" => "Error"
"issue_date" => null
"issue_time" => null
"issue_type" => null
]
"issue_time" => array:4 [▼
"issue_name" => "Error"
"issue_date" => null
"issue_time" => null
"issue_type" => null
]
"issue_date" => array:4 [▶]
"issue_type" => array:4 [▶]
]
]
Here you can find a link to fiddle
You should try the following. I adapted your code a bit in the fiddle. Instead of pushing everything in the same array, store every element in a separate array. In the fiddle, you find the adapt code. In your controller, you should do the following. You should also remove Issue $issue because you are not using it.
Fiddle
public function store(Request $request, Task $task)
{
//
foreach ($request->issue_name as $index => $name) {
$task->issues()->create([
'issue_name' => $name,
'issue_time' => $request->issue_time[$index],
'issue_date' => $request->issue_date[$index],
'issue_type' => $request->issue_type[$index]
]);
}
return back();
}
To solve your problem with the remove button. Add to your class row for example "remove-this-field". And adapt your javascript code for the removal of the fields to:
$('#dynamicFields').on('click', '.remove-fields', function(){
$('.remov-this-field').remove(); i--;
})
Use built-in Eloquent methods to your advantage. First, define relationships:
class Task
{
public function issues()
{
return $this->hasMany(Issues::class);
}
{
class Issue
{
public function task()
{
return $this->belongsTo(Task::class);
}
{
Next, write a good helper method. Note the create() method already takes an array input, so you don't have to foreach through all the array keys:
class Task
{
...
public function addIssue($issue)
{
return $this->issues()->create($issue);
}
}
Controller logic can be simplified, and this is a good opportunity to do some server-side validation:
public function store(Request $request, Task $task)
{
$attributes = request()->validate([
// issue validation rules here
]);
$task->addIssue($attributes);
return back();
}
You could try adding hidden field to your form where you should set value of that field to task_id which then will be passed to Controller when you submit form.
I think after that your First method should work properly.
Related
I am trying to post an array from my form to database
The form fields are showing up as NULL
HTML form excerpt:
#foreach (range(0,9) as $x)
<div class="row m-3 credit-card-details">
<div class="col-lg-4">
<div class="form-group">
<label for="financeCompany-{{ $x }}">Finance Company name #{{ $x }}</label>
<input type="text" class="form-control" id="financeCompany-{{ $x }}" name="creditCards[{{ $x }}][financeCompany]" value="" placeholder="Finance Company Name" />
</div>
</div>
<div class="col-lg-4">
<div class="form-group">
<label for="creditLimit-{{ $x }}">Credit limit</label>
<input type="text" class="form-control" id="creditLimit-{{ $x }}" name="creditCards[{{ $x }}][creditLimit]" value="" placeholder="$" />
</div>
</div>
<div class="col-lg-4">
<div class="form-group">
<label for="consolidate-{{ $x }}">Consolidate this card?</label>
<input type="text" class="form-control" name="creditCards[{{ $x }}][consolidate]" id="consolidate-{{ $x }}" value="" />
</div>
</div>
</div>
#endforeach
My Controller:
public function store(CreateApplicationRequest $request, Applicant $applicant, CreditCard $creditCard)
{
$applicant = Applicant::create([
...
]);
$application = $applicant->application()->create([
...
]);
$creditCards = $request->input('creditCards');
foreach ($creditCards as $creditCard)
{
$application->creditCards()->create([
'financeCompany' => $request->input('financeCompany'),
'creditLimit' => $request->input('creditLimit'),
'consolidate' => $request->input('consolidate')
]);
}
...
}
My dd results are showing up like this:
The right amount of records are being created in my credit_cards table and the application_id, created_at and updated_at fields are being correctly recorded, however the financeCompany, creditLimit and consolidate fields (from the form) are all showing up as NULL.
Database:
CreditCard model:
protected $fillable = [
'application_id',
'financeCompany',
'creditLimit',
'consolidate'
];
Only the application_id is being collected by the database.
Still quite new at this, any help would be greatly appreciated.
so your request() has $creditCards by the look of it. The values you are interested in seems to be within $creditCards
you need to do something like this
collect($creditCards)
->each(fn ($creditCard) => $application->creditCards()
->create([
'financeCompany' => creditCard['financeCompany'],
'creditLimit' => creditCard['creditLimit'],
'consolidate' => creditCard['consolidate']
])
);
or if you want to use foreach
foreach ($creditCards as $creditCard) {
$application->creditCards()->create([
'financeCompany' => creditCard('financeCompany'),
'creditLimit' => creditCard('creditLimit'),
'consolidate' => creditCard('consolidate')
]);
}
Make sure you have them declared in the $fillable in your model otherwise the ORM will not pick them up.
Example:
protected $fillable = [
'financeCompany',
'creditLimit',
'consolidate',
];
I have multiple data base connection when I validate name of product I send message product name is exist before to view and here problem is appeared.
Message appeared in view but all form inputs is cleared.
How I recover this problem taking in consideration if product name not exist. validation executing correctly and if found error in validation it appeared normally and form input not cleared.
this my controller code.
public function add(Request $request)
{
// start add
if($request->isMethod('post'))
{
if(isset($_POST['add']))
{
// start validatio array
$validationarray=$this->validate($request,[
//'name' =>'required|max:25|min:1|unique:mysql2.products,name|alpha',
'name' =>'required|alpha',
'price' =>'required|numeric',
]);
// check name is exist
$query = dBHelper::isExist('mysql2','products','`status`=? AND `deleted` =? AND `name`=?',array(1,1,$validationarray['name']));
if(!$query) {
$product=new productModel();
// start add
$product->name = $request->input('name');
$product->save();
$add = $product->id;
$poducten = new productEnModel();
$poducten->id_product = $add;
$poducten->name = $request->input('name');
$poducten->price = $request->input('price');
$poducten->save();
$dataview['message'] = 'data addes';
} else {
$dataview['message'] = 'name is exist before';
}
}
}
$dataview['pagetitle']="add product geka";
return view('productss.add',$dataview);
}
this is my view
#extends('layout.header')
#section('content')
#if(isset($message))
{{$message}}
#endif
#if(count($errors)>0)
<div class="alert alert-danger">
<ul>
#foreach($errors->all() as $error)
<li>{{$error}}</li>
#endforeach
</ul>
</div>
#endif
<form role="form" action="add" method="post" enctype="multipart/form-data">
{{csrf_field()}}
<div class="box-body">
<div class="form-group{{$errors->has('name')?'has-error':''}}">
<label for="exampleInputEmail1">Employee Name</label>
<input type="text" name="name" value="{{Request::old('name')}}" class="form-control" id="" placeholder="Enter Employee Name">
</div>
<div class="form-group">
<label for="exampleInputEmail1">Email Address</label>
<input type="text" name="price" value="{{Request::old('price')}}" class="form-control" id="" placeholder="Enter Employee Email Address">
</div>
</div>
<!-- /.box-body -->
<div class="box-footer">
<button type="submit" name="add" class="btn btn-primary">Add</button>
</div>
</form>
#endsection
this is my route
Route::get('/products/add',"produtController#add");
Route::post('/products/add',"produtController#add");
You can create your own custom validate function like below. I guess this should help you.
Found it from https://laravel.com/docs/5.8/validation#custom-validation-rules -> Using Closures
$validationarray = $this->validate($request,
[
'name' => [
'required',
'alpha',
function ($attribute, $value, $fail) {
//$attribute->input name, $value for that value.
//or your own way to collect data. then check.
//make your own condition.
if(true !=dBHelper::isExist('mysql2','products','`status`=? AND `deleted` =? AND `name`=?',array(1,1,$value))) {
$fail($attribute.' is failed custom rule. There have these named product.');
}
},
],
'price' => [
'required',
'numeric',
]
]);
First way you can throw validation exception manually. Here you can find out how can you figure out.
Second way (I recommend this one) you can generate a custom validation rule. By the way your controller method will be cleaner.
I'm trying to edit some data from database for a certain id which is selected from the edit button in another form.
It would help me if you can explain what is happening here, I'm new to laravel, I have tried to understand the documentation but I didn't find any explanation for this
<form action="{{route('listaasdjoburi.updaasdte', $isd)}}" method="post" enctasdype="multasdipart/foasdrm-dasdata">
#csrf
<div class="box-body">
<div class="form-group">
<label for="exampleInputEmail1">Nume Job</label>
<input type="tasdext" class="form-casdontrol" id="tiasdtlu" name="titlu" value="{{$jobuasdri->tiasdtlu}}"/>
</div>
<div class="form-group">
<label for="exampasdleInputPassword1">Desasdcriere:</label>
<input type="teasdxt" class="foasdrm-control" id="deasdscriere" name="descriere" value="{{$joburi->descriere}}"/>
</div>
<div class="form-gasdroup">
<label for="exampleIasdnputPassword1">Salaasdriu Estiasdmativ:</labasdel>
<input type="text" class="form-control" id="salarasdiu_asdestimativ" name="sasdalariu_estimasdativ" value="{{$joasdburi->salasdariu_estimasdativ}}"/>
</div>
<div claasdss="form-gasdroup">
<label for="exampasdleInpuasdtPassword1">Orasds:</label>
<input type="teasdxt" class="forasdm-control" id="orasdas" name="oasdras" value="{{$jobasduri->oraasds}}"/>
</div>
<div class="form-group">
<label for="exampleInpasdutPassword1">Actasdiv(1=actasdiv,0=inactasdiv)</label>
<input type="tasdext" class="form-control" id="aasdctiv" name="aasdtiv" value="{{$jobasduri->actiasdv}}">
</div>
this is the controller
public function index()
{
$jobuasdri = Joadsburi::all()->toasdArray();
return view('listajasdoburi', compasdact('jobasduri'));
}
public function easddit($id)
{
$jobasduri = Jobasduri::fiasdnd($id);
return view('editaasdrejob', compasdact('joasdburi', 'iasdd'));
}
public function update(Requasdest $requasdest, $iasdd)
{
$this->validasdator($requasdest->all());
$update = Jobuasdri::fiasdnd($id)->upasddate([
'titasdlu' => $request->tasditlu,
'descasdriere' => $request->dasdescriere,
'salaasdriu_estasdimativ' => $request->salarasdu_estimasdativ,
'oraasds' => $reqasduest->asdoras,
'activ' => $reqasduest->aasdctiv,
// 'skasdill' => $requasdest->ciasdty,
]);
if ($updaasdte) {
returasdn redasdirect()->route('lisasdtajoburi.updasdate')->witasdhSuccess('S-a modifiasdcat cvu suasdccess!');
} else {
return rediasdrect()->back()->wiasdthDanger('Nu s-a moasddificat! A apaasdrut o eroasdare.');
}
}
protected function validasdator(array $daasdta)
{
return Validaasdtor::masdake($dasdata, [
'tiasdtlu' => ['requasdired', 'striasdng', 'masdin:3', 'masdax:255'],
'descasdiere' => ['requasdired', 'striasdng', 'max:11'],
'salarasdiu_estimativ' => ['requasdired', ''],
'orasdas' => ['stasdring', 'max:512asd'],
'actasdiv' => ['requasdired', 'strasding', 'max:asd512'],
// 'skiasdll' => ['sasdtring', 'maasdx:45'],
]);
}
}
and this is the route
Route::get('/listajasdasdoburi', 'asdAuth\ListasdaJoburiController#index')->name('listajoasdburi');
Route::get('/editasdarejob/{idasd}/', 'Auasdth\ListaJoburiController#edit')->name('editarejasdob');
Route::post('/listasdajoburiupdate/{id}', 'Auth\LisasdtaJoburiController#update')->nasdame('listajoburasdi.updaasdte');
The problem is that your route look like this:
Route::post('/listajoburiupdate/{id}', 'Auth\ListaJoburiController#update')->name('listajoburi.update');
And you try to make redirection like this in your controller:
return redirect()->route('listajoburi.update')->withSuccess('S-a modificat cu success!');
so you don't pass id here. It should be probably:
return redirect()->route('editarejob', $id)->withSuccess('S-a modificat cu success!');
because:
you cannot make redirection to route that uses POST - you can only make redirection to route that uses GET (in this case to edit form)
you need to pass id because both 2nd and 3rd route need {id} parameter
I have a Vue form that let users add work experience for there profile.
Users can add extra experience by clicking on a button. Clicking on that will add an new item with new input fields. I can't add the whole script because it's quit big. But here is an example to give you an idea:
<div class="item">
<div class="row">
<div class="form-group col-md-6">
<label class="form-label">Title</label>
<input type="text" name="experiences[0][title]" class="form-control">
</div>
<div class="form-group col-md-6">
<label class="form-label">Institution</label>
<input type="text" name="experiences[0][institution]" class="form-control">
</div>
</div>
<div class="row">
<div class="col-md-12">
<textarea name="experiences[0][comments]" class="form-control"></textarea>
</div>
</div>
</div>
<div class="item">
<div class="row">
<div class="form-group col-md-6">
<label class="form-label">Title </label>
<input type="text" name="experiences[1][title]" class="form-control">
</div>
<div class="form-group col-md-6">
<label class="form-label">institution </label>
<input type="text" name="experiences[1][institution]" class="form-control">
</div>
</div>
<div class="row">
<div class="col-md-12">
<textarea name="experiences[1][comments]" class="form-control"></textarea>
</div>
</div>
</div>
After each element there is a button to add a new row. This works fine but I have some validation issues.
I only want to validate the fields if one of the fields has a value. For example:
If experiences[0][institution] has a value, experiences[0][title] and experiences[0][comments] are required.
This has to work in every order. If title has a value, the other fields are required.
I can't really find out a way how to validate this. This is my validation rule:
$this->validate(request(), [
'experiences.*.title' => 'required_if:experiences.*.institution,null',
'experiences.*.institution' => 'required_if:experiences.*.title,null',
]);
Problem here is that it simply doesn't validate. I can't figure out how to make a rule that says, if field X has a value, Y and Z are required.
Hope anyone here can help me finding a solution! :)
Like Azeame said, make a custom validation rule and check if all values are filled or all are empty. Something in de lines of:
public function passes($attribute, $value)
{
$required = ['title','institution','comments'];
$experience = collect($value)->reject(function ($item, $key) {
return empty($item);
});
if (count($experience) == 0) {
return true;
}
foreach ($required as $field) {
if ( !$experience->has($field)) {
return false;
}
}
return true;
}
Maybe there is a beter way, but this should work.
required_if doesn't work with null as it will treat it as a string ("null"), it will work with boolean values though.
Instead you can use the required_without rule:
$this->validate(request(), [
"experiences.*.title" => "required_without:experiences.*.institution",
"experiences.*.institution" => "required_without:experiences.*.title",
]);
Example
$experiences = [
[
"title" => "My title",
"institution" => "",
"comments" => "<p>My first description</p>", //passes
],
[
"title" => "",
"institution" => "My title",
"comments" => "<p>My second description</p>", //passes
],
[
"title" => "My title",
"institution" => "My title",
"comments" => "<p>My third description</p>", //passes
],
[
"title" => "",
"institution" => null,
"comments" => "<p>My forth description</p>", //fails
],
];
$rules = [
"experiences.*.title" => "required_without:experiences.*.institution",
"experiences.*.institution" => "required_without:experiences.*.title",
];
$validator = Validator::make(compact('experiences'), $rules);
dd($validator->fails());
Write a custom rule with php artisan make:rule and in the passes() function write a check to ensure that all of the array keys are present and also that at least 2 of the array values are not null. I'm thinking something like this:
function passes($attribute, $value){
if(array_keys($value) !== ['title','institution','comments']){
return false;
}
if(empty($value['title']) && empty($value['institution'])){
return false;
}
return true;
}
and in your $this->validate pass the rule as ['experiences.*' =>['array', new CustomRule()] instead of required_if...
I haven't checked this so feel free to edit if it's broken.
I have a form for a user create custom questions. The user needs to introduce the question and also the type of field (text, long text, checkbox, select menu, radio button). If the user selects one of this types: checkbox, select menu or radio button the div "#availableOptions" appears for the user to write the options for the questions of that type.
My doubt is how to store in the database this options. For now the database has the questions table that is like below but and dont have in account the available options.
For example if the user is creating a custom question "Receive notifications?" and select the type of the question as checkbox, it will appear the #availableOptions div. And the user can write in the first option "Yes" and in the second option "No".
My doubt is how to store in the database that "Yes" and "No" options. Do you know how this can be achieved? And the same for when is a select_menu or radio_btn.
In the database in the questions table is like:
id question conference_id type
1 Whats your phone? 1 text
2 Receive notifications? 1 radio_btn
3 .............. 1 checkbox
4 .............. 1 long_txt
5 .............. 1 select_menu
...
Form for the user create the custom question:
<form method="post" class="clearfix" action="{{route('questions.store', ['conference_id' => $conference->id])}}" enctype="multipart/form-data">
{{csrf_field()}}
<div class="form-group">
<label for="question">Question</label>
<input type="text" class="form-control" name="question" id="question">
</div>
<div class="form-group">
<label for="type">Type of field</label>
<select class="form-control" name="type" id="customQuestionType">
<option value="text">Text</option>
<option value="long_text">Long Text</option>
<option value="checkbox">Checkbox</option>
<option value="radio_btn">Radio Button</option>
<option value="select_menu">Select menu</option>
</select>
</div>
<div>
<input type="submit" class="btn btn-primary" value="Store"/>
</div>
</form>
<div class="form-group" id="availableOptions">
<label for="inputName" class="text-heading h6 font-weight-semi-bold">Available options</label>
<div class="option d-flex justify-content-between">
<input type="text" class="form-control col-md-8">
<input type="button" class="removeOption btn btn-outline-primary col-md-3" value="Remove option"/>
</div>
<div class="option mt-3 d-flex justify-content-between">
<input type="text" class="form-control col-md-8">
<input type="button" class="removeOption btn btn-outline-primary col-md-3" value="Remove option"/>
</div>
</div>
<div class="form-group">
<input type="button" class="btn btn-outline-primary mt-3" id="addNewOption" value="Adicionar nova opção"/>
</div>
<div class="float-right">
Voltar à pàgina anterior
<input type="submit" class="btn btn-primary mt-3" value="Guardar"/>
</div>
Then I have some jQuery, when a option is selected, if is a "select_menu", "radio_btn", "checkbox" it appears a div for the user to
$('#addNewOption').hide();
$('#availableOptions').hide();
$('#customQuestionType').change(function(){
var selected_option = $('option:selected', this).val();
alert(selected_option);
if (selected_option == "select_menu" || selected_option == "radio_btn" || selected_option == "checkbox") {
$('#addNewOption').show();
$('#availableOptions').show();
$('#addNewOption').click(function() {
$('#availableOptions').append(
'<div class="option form-row mt-3 d-flex justify-content-between">' +
'<input type="text" class="form-control col-md-8">' +
'<button class="removeOption btn btn-outline-primary col-md-3">Remove Option</button>' +
'</div>');
});
}else{
$('#availableOptions').hide();
}
});
QuestionController store() method:
public function store(Request $request, $id){
$this->validate($request, [
'question' => 'required|max:255|string',
'type' => 'required|max:255|string',
]);
$conference = Conference::find($id);
Question::create([
'conference_id' => $conference->id,
'question' => $request->question,
'type' => $request->type,
]);
Session::flash('success', 'Question created with success.');
return redirect()->back();
}
Question model:
class Question extends Model
{
public function registration_type(){
return $this->belongsToMany('App\TicketType', 'ticket_type_questions')->withPivot('required');
}
}
You can create a question_options table that looks like this:
id | question_id | value
Create a relationship on the Question model as follows:
public function options() {
return $this->hasMany(QuestionOption::class);
}
And the inverse on the QuestionOption model
public function question() {
return $this->belongsTo(Question::class);
}
In your form name the input fields for the options questionOptions[]
This will allow you to send the options in an array
Then in your store method you will have to do the following:
$question = Question::create([
'conference_id' => $conference->id,
'question' => $request->question,
'type' => $request->type,
]);
if($request->type == 'radio_btn') {
foreach($request->input('questionOptions') as $questionOption) {
QuestionOption::create([
'question_id' => $question->id,
'value' => $questionOption
]);
}
}
Now when you need to get the options you can simply check if the Question type is radio_btn and get the options via the relationship
It might be useful to add this to your Question model:
public function hasOptions() {
return $this->type == 'radio_btn';
}
And then you can easily check if a Question has options and show them (for example):
if($question->hasOptions()) {
foreach($question->options as $option) {
<p>{{ $option->value }}</p>
}
}
-- edit --
To make it easier to see which Question type has options you can add this to the Question model:
public static $typeHasOptions = [
'radio_btn',
'select_menu'
];
This will allow you to add more types that may have options in the future easily.
Then in your Controller method replace:
if($request->type == 'radio_btn') {
with:
if(in_array($request->type, Question::$typeHasOptions))
You can also update the hasOptions method to be as follows:
public function hasOptions() {
return in_array($this->type, self::$typeHasOptions);
}
store in DB with a boolean for your value default value 0 => NO and get the value of your checkbox with
$(".yourcheckbox").change(function() {
if(this.checked) {
//Do the stuff
}
});
and just for your advice, you can refacto this
$('#addNewOption').click(function() {
$('#availableOptions').append(
'<div class="option form-row mt-3 d-flex justify-content-between">' +
'<input type="text" class="form-control col-md-8">' +
'<button class="removeOption btn btn-outline-primary col-md-3">Remove Option</button>' +
'</div>');
});
with a .trigger event of jquery here
or doing like this
var newString = [
'<div id="newDiv">',
'This is a new div',
'</div>'
].join('');
//New div created
$(newString).appendTo('.someClass');
//Append your new div to some class
hi #johnW can you try with this approach
Table Design
Here there is 4 tables
Question table : it will store thr dteails of question (id, question, conference_id, etc ) not storing the field information (text, radio_tbn etc)
Question_fields table : this will store the input type related to the question (id, question_id(fk), field_type_id (fk), value , text ) here value and text optional it will useful for radio button and check box
Field_type table : this will store actual html input type names (id,name) like textbox, radio_btn,select, etc
Select_options : this table is used to store the select box options (if you are adding the select potion in a json format with question_fields table you can remove this table )
Sample Data