I am trying to log some input values into an array via jquery and then use those to run a method server side and get the data returned as JSON.
The HTML looks like this,
<div class="segment">
<div class="label">
<label>Choose region: </label>
</div>
<div class="column w190">
<div class="segment">
<div class="input">
<input type="checkbox" class="radio" value="Y" name="area[Nationwide]" id="inp_Nationwide">
</div>
<div class="label ">
<label for="inp_Nationwide">Nationwide</label>
</div>
<div class="s"> </div>
</div>
</div>
<div class="column w190">
<div class="segment">
<div class="input">
<input type="checkbox" class="radio" value="Y" name="area[Lancashire]" id="inp_Lancashire">
</div>
<div class="label ">
<label for="inp_Lancashire">Lancashire</label>
</div>
<div class="s"> </div>
</div>
</div>
<div class="column w190">
<div class="segment">
<div class="input">
<input type="checkbox" class="radio" value="Y" name="area[West_Yorkshire]" id="inp_West_Yorkshire">
</div>
<div class="label ">
<label for="inp_West_Yorkshire">West Yorkshire</label>
</div>
<div class="s"> </div>
</div>
<div class="s"> </div>
</div>
I have this javascript the detect whether the items are checked are not
if($('input.radio:checked')){
}
What I dont know is how to get the values of the input into an array so I can then send the information through AJAX to my controller. Can anyone help me?
You can use jQuery's each() function.
$('input.radio:checked').each(function() {
//put each of the selected check boxes into an array
});
You need to serialize your input with - serialize()
var data = $('#MYFORM').serialize();
Related
I have branch index page it contains 2 drop-down menu called company and dealership when i click on company it contains a company i created when click on a company the corresponding dealership should list in the dealership dropdown. i used eloqent straightly into index page i did that because the i can't access the company and dealership in the index page
Index
#include('theme.header')
<?php use Illuminate\Support\Facades\DB;?>
<div class="page-content-wrapper ">
<div class="container-fluid">
<div class="row">
<div class="col-sm-12">
<div class="page-title-box">
<div class="btn-group float-right">
</div>
<h4 class="page-title">Branch Management</h4>
</div>
</div>
</div>
<!-- end page title end breadcrumb -->
<div class="row">
<div class="col-12">
<div class="card m-b-30">
<div class="card-body">
<h4 class="mt-0 header-title">Branch</h4>
<br>
<br>
<form id="form" method="post" action="{{route('branch.store')}}">
{{csrf_field()}}
<div class="form-group row">
<label class="col-sm-2 col-form-label">Company</label>
<div class="col-sm-10">
<select class="form-control" id="company" name="company">
<option>Select Company</option>
#foreach(\App\Company::all()->where('status','0') as $company)
<option value="{{$company->comp_id}}">{{$company->name}}</option>
#endforeach
</select>
</div>
</div>
<div class="form-group row">
<label class="col-sm-2 col-form-label">Dealership</label>
<div class="col-sm-10">
<select class="form-control" id="dealer" name=" dealer">
<option>Select Dealership</option>
#foreach(\App\Dealership::join('companies','comp_id','=','dealerships.comp_id')->where('status','0') as $dealership)
<option value="{{$dealership->dlr_id}}">{{$dealership->name}}</option>
#endforeach
</select>
</div>
</div>
<div class="form-group row">
<label for="example-text-input" class="col-sm-2 col-form-label">Email</label>
<div class="col-sm-10">
<input class="form-control" type="email" id="email" name="email" required>
</div>
</div>
<div class="form-group row">
<label for="example-text-input" class="col-sm-2 col-form-label">Branch Name</label>
<div class="col-sm-10">
<input class="form-control" type="text" id="branch" name="branch" required>
</div>
</div>
<div class="row">
<div class="col-sm-12">
<div class="page-title-box">
<div class="btn-group float-right">
<button class="btn btn-primary" id="btn_save" data-toggle="modal"
data-target="#create" type="submit">Save
</button>
</div>
</div>
</div>
</div>
</form>
</div>
</div>
#include('theme.footer')
First thing first. You need to change queries.
Company::where(‘status’, 0)->get();
And next you missed the tailing get() in the next dropdown.
And why are you not using relationships to query?
Like Muhammad Naumann already said you have to use the get() method to get the actual data:
Company::where(‘status’, 0)->get();
On the company select field you could add an event listener like onChange. In this listener you run a ajax get request to fetch the dealerships for the selected company.
I figured it out with Ajax.
Create a custom function in controller file. In this case Branch controller, this function contains query builder to retrieve the data
Write Ajax, in the index file, the dealership dropdown is hidden default when you select the company the dropdown will show corresponding data.
Index File
#include('theme.header')
<?php use Illuminate\Support\Facades\DB;?>
<script language="javascript">
/*--- Fliter dealership corressponging company---*/
$(document).ready(function () {
$('#dealership_div').hide();
$('#company').change(function () {
alert('hello');
$('#dealership_div').show();
let id = this.value;
$.ajax({
url: '/filter_dealer',
type: "post",
data: {option: id},
success: function (data) {
$('#dealer')
.find('option')
.remove()
.end()
.append(" <option value=''>--- Select dealership ---</option>")
$.each(data, function (key, value) {
$('#dealer')
.append($("<option></option>")
.attr('value', value['dlr_id'])
.text(value['name'])
);
});
},
error: function () {
alert("Error occurred While Processing");
}
});
});
});
</script>
<div class="page-content-wrapper ">
<div class="container-fluid">
<div class="row">
<div class="col-sm-12">
<div class="page-title-box">
<div class="btn-group float-right">
</div>
<h4 class="page-title">Branch Management</h4>
</div>
</div>
</div>
<!-- end page title end breadcrumb -->
<div class="row">
<div class="col-12">
<div class="card m-b-30">
<div class="card-body">
<h4 class="mt-0 header-title">Branch</h4>
<br>
<br>
<form id="form" method="post" action="{{route('branch.store')}}">
{{csrf_field()}}
<div class="form-group row">
<label class="col-sm-2 col-form-label">Company</label>
<div class="col-sm-10">
<select class="form-control" id="company" name="company">
<option>Select Company</option>
#foreach(\App\Company::all()->where('status','0') as $company)
<option value="{{$company->comp_id}}">{{$company->name}}</option>
#endforeach
</select>
</div>
</div>
<div class="form-group row" id="dealership_div">
<label class="col-sm-2 col-form-label">Dealership</label>
<div class="col-sm-10">
<select class="form-control" id="dealer" name=" dealer">
<option></option>
</select>
</div>
</div>
<div class="form-group row">
<label for="example-text-input" class="col-sm-2 col-form-label">Email</label>
<div class="col-sm-10">
<input class="form-control" type="email" id="email" name="email" required>
</div>
</div>
<div class="form-group row">
<label for="example-text-input" class="col-sm-2 col-form-label">Branch Name</label>
<div class="col-sm-10">
<input class="form-control" type="text" id="branch" name="branch" required>
</div>
</div>
<div class="row">
<div class="col-sm-12">
<div class="page-title-box">
<div class="btn-group float-right">
<button class="btn btn-primary" id="btn_save" data-toggle="modal"
data-target="#create" type="submit">Save
</button>
</div>
</div>
</div>
</div>
</form>
</div>
</div>
Branch Controller File With a custom function
public function filter_dealer(Request $request)
{
$company_id=$request->input('option');
$dealership=DB::table('dealerships')->select('dlr_id','name')->where([['comp_id','=',$company_id],['status','=','0']])->get();
return response()->json($dealership);
}
Route File
Route::post('filter_dealer', 'BranchController#filter_dealer')->name('filter_dealer');
If you want to dynamically change the contents of dealership dropdown, on the event of changing the company dropdown, you should use javascript, jquery or similar javascript framework, because PHP is a server side scripting language and require page refresh to change the contents of a web page.
I'm trying to upload a file with Laravel but it does not work
I will send the field with the meta name view
<div class="panel-body">
<div class="tab-content">
<div class="tab-pane fade in active" id="tab1success">
<form method="post" name="type" action="songs">
{{ csrf_field() }}
<div class="form-group">
<div class="row">
<label class="col-md-3 control-label" for="Name">نام موزیک</label>
<div class="col-md-7">
<div class="input-group">
<div class="input-group-addon">
<i class="fa fa-music">
</i>
</div>
<input id="Name" name="title" type="text"
placeholder="نام موزیک" class="form-control input-md">
</div>
</div>
</div>
<br>
<div class="row">
<label class="col-md-3 control-label" for="Name (Full name)">دسته
بندی</label>
<div class="col-md-7">
<div class="input-group">
<div class="input-group-addon">
<i class="fa fa-list">
</i>
</div>
<select id="Name" name="category" type="دسته بندی"
placeholder="دسته بندی" class="form-control input-md">
<option>fun</option>
<option>love</option>
<option>birth</option>
<option>wedding</option>
</select>
</div>
</div>
</div>
<br>
<div class="row">
<label class="col-md-3 control-label" for="Name (Full name)">توضیحات</label>
<div class="col-md-7">
<div class="input-group">
<div class="input-group-addon">
<i class="fa fa-file-text-o">
</i>
</div>
<textarea id="Name" name="text" placeholder="توضیحات"
class="form-control input-md"></textarea>
</div>
</div>
</div>
<br>
<div class="row">
<label class="col-md-3 control-label" for="Name (Full name)">انتخاب
فایل</label>
<div class="col-md-7">
<div class="input-group">
<div class="input-group-addon">
<i class="fa fa-folder-o">
</i>
</div>
<input id="meta" name="meta" type="file" placeholder="انتخاب فایل"
class="form-control input-md">
</div>
</div>
</div>
<br>
<div class="row" style="text-align: center">
<div class="col-md-10 " style="text-align: center">
<button id="Name" name="submit" type="submit" placeholder="انتخاب فایل"
class="form-control input-md" style="text-align: center">اضافه
</button>
</div>
</div>
</div>
</form>
</div>
</div>
</div>
Controller
public function create(Request $req, $type) {
$this->authorize('is_admin');
$req->file('meta')->store('app');
// $path = Storage::putFile('app', $req->file('meta'))
}
error
Symfony \ Component \ Debug \ Exception \ FatalThrowableError (E_ERROR)
Call to a member function store() on null
Here is an image of the error
Does anybody know what i should do about this?
Add enctype="multipart/form-data" to your <form> tag in your blade:
<form method="post" name="type" action="songs" enctype="multipart/form-data">
Based on your blade file you can see that the file meta being uploaded is not required, so in your controller, you need to check if the file was sent before calling the store method on it. Check this:
public function create(Request $req, $type) {
$this->authorize('is_admin');
$file = $req->file('meta') ? $req->file('meta')->store('app') : null;
}
i am using Ckeditor for blog posting in my project when i submit the form nothing i am get in controller can any one suggest me solution for that.
my view is looking like
<div class="container">
<div class="row">
<div class="col-md-10 col-md-offset-2">
<div class="panel panel-default">
<div class="panel-heading">Post</div>
<div class="panel-body">
<form class="form-horizontal" role="form" method="POST" action="{{ route('store-post') }}">
{{ csrf_field() }}
<div class="form-group">
<label for="category_id" class="col-md-2 control-label">Select Categories</label>
<div class="col-md-8">
<select class="form-control" id="category_id" name="category_id">
#foreach($categories as $category)
<option value="{{$category->url_name}}">
{{$category->category_name}}</option>
#endforeach
</select>
</div>
</div>
<div class="form-group">
<label for="email" class="col-md-2 control-label">Post Title</label>
<div class="col-md-8">
<input id="post_title" type="text" class="form-control" name="post_title" value="{{ old('post_title') }}">
</div>
</div>
<div class="form-group">
<label for="post_content" class="col-md-2 control-label">Post Description</label>
<div class="col-md-8">
<textarea id="post_content" rows="10" cols="60" class="span8" placeholder="Image Title Goes Here" name="post_content"></textarea>
</div>
</div>
<div class="form-group">
<label for="p_url" class="col-md-2 control-label">Post Url</label>
<div class="col-md-8">
<input id="p_url" type="text" class="form-control" name="p_url" value="{{ old('p_url') }}">
</div>
</div>
<div class="form-group">
<label for="p_title" class="col-md-2 control-label">Meta Title</label>
<div class="col-md-8">
<input id="p_title" type="text" class="form-control" name="p_title" value="{{ old('p_title') }}">
</div>
</div>
<div class="form-group">
<label for="p_keyword" class="col-md-2 control-label">Meta Keyword</label>
<div class="col-md-8">
<input id="p_keyword" type="text" class="form-control" name="p_keyword" value="{{ old('p_keyword') }}">
</div>
</div>
<div class="form-group">
<label for="email" class="col-md-2 control-label">Meta Description</label>
<div class="col-md-8">
<textarea class="form-control" id="p_mdesc" name="p_mdesc" rows="3">
</textarea>
</div>
</div>
<div class="form-group">
<div class="col-md-8 col-md-offset-2">
<button type="submit" class="btn btn-primary">
Submit
</button>
</div>
</div>
<!--Error start-->
#if ($errors->any())
<div class="alert alert-danger">
<ul>
#foreach ($errors->all() as $error)
<li>{{ $error }}</li>
#endforeach
</ul>
</div>
#endif
<!--error ends-->
</form>
</div>
</div>
</div>
</div>
</div>
my controller code is
public function store(Request $request){
/*$this->validate($request, [
'category_id' => 'required',
'post_title' => 'required',
//'post_content' => 'required',
'p_url' => 'required',
'p_title' => 'required',
'p_keyword' => 'required',
'p_mdesc' => 'required',
]);*/
$post=new Post;
echo $post_content=$request->input('post_content');
}
in previous project ie designed in CI i just use
$tc=$this->input->post('tc'); in controller for getting the Ckeditor value but in laravel i am not sure how to get it done.
Your view contain 2 name attribute for the post_content field (textarea). Please check.
You can do it like this -
{!! Form::textarea('tc', $tc,array('required', 'class'=>'form-control', placeholder'=>'Your message')) !!}
and then you will have to initialise it
$(document).ready(function () {
CKEDITOR.replace( 'tc' );
});
The documentation has clear examples.
In your Blade you should add ckeditor like this:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>A Simple Page with CKEditor</title>
<!-- Make sure the path to CKEditor is correct. -->
<script src="../ckeditor.js"></script>
</head>
<body>
<form>
<textarea name="editor1" id="editor1" rows="10" cols="80">
This is my textarea to be replaced with CKEditor.
</textarea>
<script>
// Replace the <textarea id="editor1"> with a CKEditor
// instance, using default configuration.
CKEDITOR.replace( 'editor1' );
</script>
</form>
</body>
</html>
So the javascript code triggers a replace of a textarea to the editor
Now for the retrieving data part
<script>
var data = CKEDITOR.instances.editor1.getData();
// Your code to save "data", usually through Ajax.
</script>
You need to create an endpoint if you want to send this data indeed trough Ajax. Don't forget to add a CSRF token
As mentioned by #user3888958,
<textarea name="tc" id="post_content" rows="10" cols="60"
class="span8" placeholder="Image Title Goes Here" name="post_content">
the textarea has two name attribute.
You could access the textarea content using the name attribute, remove any one name attribute and pass that in as a parameter to the request
$request->input('tc'); // OR
$request->input('post_content');
and to access the value of
<textarea class="form-control" id="p_mdesc" name="p_mdesc" rows="3">
</textarea>
you could access it using the name
$request->input('p_mdesc');
master peace of codeigniter. im new user for this framework.
i have problem to show comment data by id_diskusi in the single post of diskusi. i try to show data using 'where' in the lybrary code but its still not show the data. i hope the people at there can help me & solved this problem.
i use library to get data from database
public function setuju(){
$data=$this->CI->db->query("SELECT komentar.id AS id,
komentar.diskusi_id AS id_diskusi,
komentar.pilih AS pilih,
komentar.nama AS nama,
komentar.email AS email,
komentar.pesan AS pesan,
komentar.tanggal AS tanggal,
diskusi.diskusi_id as nomor_diskusi
FROM diskusi, komentar
WHERE diskusi.diskusi_status='publish' AND komentar.pilih='1' AND komentar.diskusi_id=diskusi.diskusi_id ORDER BY komentar.id DESC
");
return $data->result_array();
}
i use this code to filter data who data on komentar will be show by id of diskusi.
komentar.diskusi_id=diskusi.diskusi_id
but still not work
and its my controller
$data['setuju']=$this->diskusi->setuju();
code in the view
<div id="netral" class="tab-pane">
<?php
foreach ($netral AS $value) {
echo "<div class='box box-body no-border'>
<div class='row'>
<div class='col-md-2'>
<div class='box-profile'>"; ?>
<img alt='user image' style='margin-top:10px' class='profile-user-img img-responsive img-circle' src='<?php echo img_user_url('user.png'); ?>'>
<?php echo"
<h3><center>$value[nama]</center</h3>
</div>
</div>
<div class='col-md-10'>
<div class='callout callout-danger lead'><span class='pull-right'>".format_tanggal($value['tanggal'])."</span><br>
<p>$value[pesan]</p>
</div>
</div>
</div>
</div>";
}?>
</div><!-- /.tab-pane -->
<div class="box box-danger">
<div class="box-header with-border">
<div class="user-block">
<h3 class="no-margin">Tinggalkan Komentar</h3>
</div><!-- /.user-block -->
<div class="box-tools">
<button data-widget="collapse" class="btn btn-danger btn-sm"><i class="fa fa-minus"></i></button>
</div><!-- /.box-tools -->
</div>
<div class="box-body">
<form method='POST' id='komentar' action='<?php echo baseURL('form_visitors/komentar'); ?>' autocomplete='off' method="post" class="form-horizontal">
<div class="form-group">
<label class="col-sm-2 control-label" for="inputName">Name</label>
<div class="col-sm-10">
<input type="hidden" name="diskusi_id" value="<?php echo "$diskusi[id]";?>">
<input type="text" placeholder="Nama" data-original-title="Masukkan Nama" required='required' name="nama" id="inputName" class="form-control">
<input type='hidden' class='form-control' name='url' value='<?php echo current_url() ?>' />
</div>
</div>
<div class="form-group">
<label class="col-sm-2 control-label" for="inputEmail">Email</label>
<div class="col-sm-10">
<input type="email" name="email" data-original-title="Masukkan Email" placeholder="Email" required='required' id="inputEmail" class="form-control">
</div>
</div>
<div class="form-group">
<label class="col-sm-2 control-label"></label>
<div class="col-sm-10">
<div class="checkbox">
<label>
<input type="radio" name="pilih" value="1"> <i class="fa fa-thumbs-o-up margin-r-5 text-green"> <b>Setuju</b></i>
</label>
<label>
<input type="radio" name="pilih" value="2"> <i class="fa fa-square margin-r-5 text-yellow"> <b>Netral</b></i>
</label>
<label>
<input type="radio" name="pilih" value="3"> <i class="fa fa-thumbs-o-down margin-r-5 text-red"> <b>Tidak Setuju</b></i>
</label>
</div>
</div>
</div>
<div class="form-group">
<label class="col-sm-2 control-label" for="inputExperience">Komentar</label>
<div class="col-sm-10">
<textarea placeholder="Komentar" name="pesan" id="inputExperience" required='required' class="form-control"></textarea>
</div>
</div>
<div class='form-group'>
<label class="col-sm-2 control-label" for="inputExperience"></label>
<div class="col-sm-10">
<div id='recaptcha1'></div>
</div>
</div>
<div class="form-group">
<div class="col-sm-offset-2 col-sm-10">
<button class="btn btn-danger" type="submit" id="submit">Submit</button>
<div class="cssload" style="display: none; width: 100px">
<div class="cssload-tube-tunnel"></div>
</div>
</div>
</div>
</form>
</div>
</div>
how can i show comment data according with single post of diskusi who have comment. Thank you very much in advance! sorry for my english.
I can see you are fetching the data from two different tables but you have not used 'JOIN'.
you can try the following query string :
public function setuju(){
$data=$this->CI->db->query("SELECT komentar.id AS id,
komentar.diskusi_id AS id_diskusi,
komentar.pilih AS pilih,
komentar.nama AS nama,
komentar.email AS email,
komentar.pesan AS pesan,
komentar.tanggal AS tanggal,
diskusi.diskusi_id as nomor_diskusi
FROM komentar, diskusi
JOIN diskusi
ON diskusi.diskusi_id=komentar.diskusi_id
WHERE diskusi.diskusi_status='publish' AND komentar.pilih='1' ORDER BY komentar.id DESC
");
return $data->result_array();
}
I have a problem with FormValidation to validate a form in multi-tab (Bootstrap theme).When I click on submit button in #tab-1, formValidation work correctly. but when I change to #tab-2 or #tab-3, field validation in #tab-1 don't work and submit form without validation.
<form id="newstext" method="post" class="form-horizontal"
data-fv-framework="bootstrap"
data-fv-message="This value is not valid"
data-fv-icon-valid="glyphicon glyphicon-ok"
data-fv-icon-invalid="glyphicon glyphicon-remove"
data-fv-icon-validating="glyphicon glyphicon-refresh">
<div class="tabbable">
<ul class="nav nav-tabs">
<li class="active"><i class="green ace-icon fa fa-home bigger-120"></i>tab-1</li>
<li><i class="red ace-icon fa fa-folder bigger-120"></i>tab-2</li>
<li><i class="blue ace-icon fa fa-exchange bigger-120"></i>tab-3</li>
</ul>
<div class="tab-content">
<div class="tab-pane active" id="tab-1">
<div class="panel-body">
<div class="col-md-6">
<div class="form-group">
<label class="control-label">title *</label>
<input id="title" name="title" type="text" placeholder="" class="form-control"
data-fv-notempty="true"
data-fv-notempty-message="The title is required" />
</div>
<div class="form-group">
<label class="control-label">abstract </label>
<input id="abst" name="abst" type="text" placeholder="" class="form-control">
</div>
</div>
</div>
</div>
<div class="tab-pane" id="tab-2">
<div class="panel-body">
<div class="col-md-6">
<div class="form-group">
<label class="control-label">name</label>
<input id="namee" name="namee" type="text" placeholder="" class="form-control">
</div>
</div>
</div>
</div>
<div class="tab-pane" id="tab-3">
<div class="panel-body">
<div class="col-md-6">
<div class="form-group">
<label class="control-label">show</label>
<input name="show_callme" value="1" id="show_callme" type="checkbox">Ok
<input name="show_callme" value="1" id="shows" type="checkbox">Bold
</div>
</div>
</div>
</div>
<br>
<button type="submit" class="btn btn-success">submit</button>
</div>
</div>
Please see my code in Codepen
This example might be helpful: formvalidation.io/examples/bootstrap-tab
JQuery FormValidation Has solved the problem Validation
That by replacing the jquery, validation between tabs work
You can add "ignore" in validate function, this worked fine with me
$("#form").validate({
...
rules: {...},
messages: {...},
ignore: "",
...
});