Calling php file without submit button - php

Question

I have a form table with checkboxes. I want the user to check whichever url (element) they want to delete, press a button which then calls a "delete.php" file which deletes that record in mysql.
What I am trouble finding out how to do is to call the delete.php file with a button outside of the form. I know that you would typically use a submit button inside the form but in this situation, I am exploring whether it is possible to do it with a button that is outside it.
An image is attached to illustrate why I want to do that. The url menu on the bottom is called by a function because I want it to be modular. So I think the "Delete BM" question needs to be able to action the deletion of the checked checkbox.
I have googled a variety of search cases which dont really answer my question:
How to send checkbox state through form in a table
Search "php how to call php file outside form"
Search "how to call php file without submit button"
Call php file without using form action
Submit without submit button

Answer 1

Use following code for submitting your form.
and use search keyword in google "submit form without submit button in php".
<form id="jsform" action="whatever you want">
// input fields
</form>
<script type="text/javascript">
document.getElementById('jsform').submit();
</script>
For Your Problem. Below are Sample code
<input type='checkbox' class='test' name='test' value='1'>
<input type='checkbox' class='test' name='test' value='2'>
<input type='checkbox' class='test' name='test' value='3'>
<input type='checkbox' class='test' name='test' value='4'>
is somthing your checkboxes then following is the script
<script>
$(function(){
$(".test").click(function(){
var checkBoxValue = $(this).val(); // value of checkbox
$.ajax(
{
url: "" // url of page where delete funcnality is written
// and id of field
})
.done(function(data)
{
// success
});
});
});
</script>

Answer 2

In the past I have come across this sort of issue, of wanting a submit button outside of a form for layout/presentation reasons.
Having given it some thought and reading around, I learned there were some very good reasons to avoid doing so;
Changing the default behaviours of the browser is generally a bad idea, you make extra work for yourself and in the end is likely to complicate things and often also lead to confusing users. (for example: what happens if user clicks enter, will it still submit the form?)
Users that do not have up to date javascript or do not have it switched on, will not be able to use your form / site.
You can achieve what you want and still use the standard html submit button. Using CSS to make it appear as a text link, great example;
How to make a submit button display as a link?
In your example I personally would just have the submit button appear as a button (styled to match sites design) directly under the checkboxes, separate from your menu below. As this makes the most sense to me, and would save you some work as you wouldn't need to fiddle with your menu function.
However if you wanted to achieve exactly as you set out, you could pass the button (html string) as a paramenter into your function so that it can be entered into the menu list, then return all the menu html string and print it inside your form;
<form>
<input type="checkbox" name="1" /><br />
<input type="checkbox" name="2" /><br />
<input type="checkbox" name="3" /><br />
<?php
$buttonHtml = '<input type="submit" name="delete_bm" value="delete bm" class="submitLink" />';
echo navMenu($buttonHtml);
?>
</form>
Now the submit tag is within the form tag (and will behave as as intended), it is simply a case of using CSS to style these and any other elements to give you the presentation that you desired (might need to remove padding, margin etc. from form element).
.submitLink {
font: inherit;
background-color: transparent;
text-decoration: underline;
border: none;
color: blue;
cursor: pointer;
}
.submitLink:focus {
outline: none;
}
form{
padding: 0;
margin: 0;
}
The big upside is that now you do not need any un-necessary javascript, giving maximum accessibility and maintaining the functionality that users expect.
Also feels less complicated to me and that it is less likely to need updating.
Side note: if your form allows users to delete multiple bookmarks at once (seems like it should) you might want the text on the button to read; delete bookmark(s) Hope you had considered that ;)

Answer 3

You can use jQuery AJAX for this.
Because, calling PHP script with form submit will cause total page refresh.
you need to just delete the selected checkbox row and delete the entry from database.
I will explain the pseudo logic for it.
On click of the link Delete BM, call javascript for AJAX.
First open a confirm dialog.
Through AJAX, pass the id to be deleted to backend PHP file.
In PHP file, write the code to delete the record.
If record gets deleted, echo success there else failure.
If in AJAX, we get results success, delete the respective rows.
jQuery $.ajax()