Form Query Selector is Null on Second Form - php

I'm a bit confuse on this form behaviour, I can get the second form but the first form is null. Here is my form codes:
<div class="modal-body">
<form action="{{ route('payroll',$data->id) }}" method="get" id="duadua">
</form>
<form action="{{ route('payroll',$data->id) }}" method="get" id="payrollForm">
</form>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
<button id="payrollSubmit" type="button" class="btn btn-primary">
{{ __('Process') }}
</button>
</div>
<script type="text/javascript">
$('document').ready(function(){
$("#payrollSubmit").click(function(){
var isi = document.getElementById('payrollForm');
console.log(isi);
});
});
</script>
I can get value of second form like this:
Meanwhile when I change to call first form (duadua) it returs null, like this:
I have no Idea why only second form can be called, while first form returns null.

Related

My iconpicker button submits my HTML form

I have a problem with my iconpicker: In my form, i want the user to choose an icon. So i added an iconpicker button from FontAwsome. If i put it out of the form, it works. But when i put it into the form, what i just need to do, when i click on it, it submits the form.
I've tried to write "type='button'" but it not works.
Can someone help me and show what's wrong?
Thank you!
<body>
<form method="post" id="form1" action="page_generator.php" enctype="multipart/form-data">
<div id="free_links">
<p >other</p>
<div class="form row" id="free_a_cloner"style="display:none" >
<div class="form-group col-1">
<button name="flnk_0[]" id="ipk" class="btn btn-outline-secondary" data-icon="fas fa-mouse-pointer" role="iconpicker" ></button>
</div>
</div>
</form>
<div class="form row">
<div class="col-sm-10">
<button type="submit" form="form1" class="btn btn-primary">Submit</button>
</div>
</div>
<script>
$("#ipk").iconpicker();
</script>
</body>
Specify that the buttun isn't of type submit by adding type='button':
<button type='button' name="flnk_0[]" id="ipk" class="btn btn-outline-secondary" data-icon="fas fa-mouse-pointer" role="iconpicker" ></button>
you forget to close a div and also try with type="button". sometime it may cause issues. Try the code below and better to create a pen for better understanding or provide head code as well thanks.
<body>
<form method="post" id="form1" action="page_generator.php" enctype="multipart/form-data">
<div id="free_links">
<p >other</p>
<div class="form row" id="free_a_cloner"style="display:none" >
<div class="form-group col-1">
<button type="button" name="flnk_0[]" id="ipk" class="btn btn-outline-secondary" data-icon="fas fa-mouse-pointer" role="iconpicker" ></button>
</div>
</div>
</div>
</form>
<div class="form row">
<div class="col-sm-10">
<button type="submit" form="form1" class="btn btn-primary">Submit</button>
</div>
</div>
<script>
$("#ipk").iconpicker();
</script>
</body>
Add type="button" and check source code on browser because it could be changed by javascript after page rendered and check if there is $("button").onClick.submit like javascript code.
be sure there is only 1 type property i mean not like that:
<button type="button" type="submit">
you can use this code!!
<button type="button" form="form1" class="btn btn-primary">Submit</button>

The DELETE & PUT method is not supported for this route. Supported methods: GET, HEAD,POST

I need your help guys on this, my app can't delete neither can it Update. it keeps on popping these errors on my edit and Delete Buttons;
(1/1) MethodNotAllowedHttpException
The DELETE method is not supported for this route. Supported methods: GET, HEAD.
(1/1) MethodNotAllowedHttpException
The PUT method is not supported for this route. Supported methods: GET, HEAD.
this is my route
Route::group(['middleware' => ['role:Admin']], function () {
Route::resource('/device', 'DeviceController');
});
this is my edit blade
<form action="/device" method="POST" id="editForm">
{{csrf_field()}}
{{ method_field('PUT') }}
<div class="col-md-4 mb-3">
<label>Serial Number</label>
<input type="text" name="Serial_No" id="" class="form-control" placeholder="Enter Serial number">
</div>
<button class="btn btn-primary" type="submit">Add Data</button>
<button type="reset" class="btn btn-default float-right">Cancel</button>
<button type="reset" class="btn btn-default float-middle">Clear</button>
</form>
This is my delete blade
<form action="/device" method="POST" id="deleteForm">
{{csrf_field()}}
{{method_field('DELETE')}}
<div class="form-row">
<input type="hidden" name="_method" value="DELETE" >
<P>Are You Sure!.. You want to delete this Device?</P>
</div>
<button class="btn btn-primary " type="submit" >YES! DELETE DEVICE</button>
<button type="button" class="btn btn-secondary float-right" data-dismiss="modal" >CANCEL</button>
</form>
This is my controller for delete
public function destroy($id)
{
$devices = Device::find($id);
$devices -> delete();
return Redirect::back() -> with('success','Data Deleted Successfully');
}
This is my script that deletes
<script>
//Start Delete Record
table.on('click', '.delete', function () {
$tr = $(this).closest('tr');
if ($($tr).hasClass('child')) {
$tr = $tr.prev('.parent');
}
var data = table.row($tr).data();
console.log(data);
$('#deleteForm').attr('action', '/laptops/'+data[0]);
$('#deleteModal').modal('show');
});
//End Delete Record
});
</script>
You are not passing the correct actions
your update form should look like this instead
<form action="" method="POST" id="editForm">
{{csrf_field()}}
{{ method_field('PUT') }}
<div class="col-md-4 mb-3">
<label>Serial Number</label>
<input type="text" name="Serial_No" id="" class="form-control" placeholder="Enter Serial number">
</div>
<button class="btn btn-primary" type="submit">Add Data</button>
<button type="reset" class="btn btn-default float-right">Cancel</button>
<button type="reset" class="btn btn-default float-middle">Clear</button>
</form>
your delete form should look like this instead.
<form action="" method="POST" id="deleteForm">
{{csrf_field()}}
{{method_field('DELETE')}}
<div class="form-row">
<p>Are You Sure!.. You want to delete this Device?</p>
</div>
<button class="btn btn-primary " type="submit">YES! DELETE DEVICE</button>
<button type="button" class="btn btn-secondary float-right" data-dismiss="modal">
CANCEL
</button>
</form>
your script should look like this (change 'laptops/' to 'device/')
table.on('click', '.delete', function () {
$tr = $(this).closest('tr');
if ($($tr).hasClass('child')) {
$tr = $tr.prev('.parent');
}
var data = table.row($tr).data();
console.log(data);
$('#deleteForm').attr('action', '/device/'+data[0]);
$('#deleteModal').modal('show');
});
Also as an opinion you could pluralize your resource route instead of the singular approach. i.e /devices instead of /device
so in your web.php routes file you have:
Route::group(['middleware' => ['role:Admin']], function () {
Route::resource('/devices', 'DeviceController');
});
That way you have a more friendly route list like:
GET - /devices
GET - /devices/create
POST - /devices/update
GET - /devices/{device}
GET - /devices/{device}/edit
PUT/PATCH - /devices/{device}
DELETE - /devices/{device}
All these can be viewed in your cli using php artisan route:list

cannot able to post item into my controller ? why?

I am using modal window to post the the values to the controller .
<form action="<?php echo base_url();?>Users/sms/" id="form" method="post" class="form-horizontal" enctype="multipart/form-data">
buttons
<button type="button" id="custom" class="btn btn-warning" disabled="disabled">
Custom Msg
</button>
<button type="button" id="initial" class="btn btn-primary">
Initial
</button>
no response in my screen. i cannot able find the error. in popup window showing nothing. when i click the button no response. suggestion please
Type should be submit instead of button to post the data.

Pass method = "post" in button and not in form

I want to pass a variable but for that I need to create a form. But I am using JavaScript to open the next page (that is a block page)
but I want to pass the method="post" directly in the button and not in the form, because it does not recognise the code.
Here is an example:
<form action="" method="post">
<button onclick="document.getElementById('id144').style.display='block'" class="btn btn-warning">
Editar nome grupo
</button>
</form>
What I want:
<button //pass method = post here onclick="document.getElementById('id144').style.display='block'" class="btn btn-warning">
Editar nome grupo
</button>
<form action="" id="formname" method="post">
</form>
<button onclick="document.getElementById('formname').submit();document.getElementById('id144').style.display='block';" class="btn btn-warning">Editar nome grupo</button>
Set form id.

Laravel Route resource destroy not working

Here is my form :
<form action="{{ route('invoice.destroy' , $invoice->id)}}" method="DELETE">
<div class="modal-footer no-border">
<button type="button" class="btn btn-info" data-dismiss="modal">No</button>
<button type="submit" class="btn btn-primary">Yes</button>
<input type="hidden" name="_method" value="DELETE" />
</div>
</form>
Here is my controller :
public function destroy($id)
{
$invoice = Invoice::find($id);
if(!$invoice){
return redirect()->route('invoice.index')->with(['fail' => 'Page not found !']);
}
$invoice->delete();
return redirect()->route('invoice.index')->with(['success' => 'Invoice Deleted.']);
}
But it can not delete where is the problem ? How solve this ?
You need to use POST method for the form and add input element with name _method and value DELETE. Also, add token:
<form action="{{ route('invoice.destroy' , $invoice->id)}}" method="POST">
<input name="_method" type="hidden" value="DELETE">
{{ csrf_field() }}
<div class="modal-footer no-border">
<button type="button" class="btn btn-info" data-dismiss="modal">No</button>
<button type="submit" class="btn btn-primary">Yes</button>
</div>
</form>
I think you must add a hidden input to the form which will contain the method used:
<form action="{{ route('invoice.destroy' , $invoice->id)}}" method="POST">
<input type="hidden" name="_method" value="DELETE" />
</form>
Read more on Laravel documentation about Form method spoofing
In order to get PUT and DELETE methods to work, you need an additional field, since only POST and GET are possible within HTML (out-of-the-box).
The additional field will be made with the code:
{!! method_field('DELETE') !!}
So your form will look like this:
<form action="{{ route('invoice.destroy' , $invoice->id)}}" method="DELETE">
{!! method_field('DELETE') !!}
<div class="modal-footer no-border">
<button type="button" class="btn btn-info" data-dismiss="modal">No</button>
<button type="submit" class="btn btn-primary">Yes</button>
</div>
</form>
Also, if you are using blade templates, you can add the method field like so:
#method('DELETE')
More Laravel way you can do this
<form action="{{ route('invoice.destroy',$invoice->id)}}" method="POST">
#method('DELETE')
<button type="submit" class="btn btn-primary">Yes</button>
</form>

Categories