除了提交以外的其他方法

Question

I have a PHP submit form, within that form I have a PHP image gallery that displays images from a folder. (I have a dropdown to select images from different folders).

When I click on an image from the gallery the path to that image is entered into an input field so it can be linked to the other information when submitted.

My problem is when I choose a different image gallery folder from the dropdown it submits the form. I understand why it does this, but am unsure how to change the way it uses PHP to choose different folders to JS/JQ so there is no need for a submit or refresh.

Here is the relevant code...

<script>
function change(){
    document.getElementById("myfolders").submit();
}
</script>


$subF = $_POST['otherFolders'];

<form id="myfolders" method="post">

  <select name="otherFolders" onchange="change()">
        <option selected="selected">Other Galleries</option>
        <?php
        $otherFolders = $dirs2;
        foreach($otherFolders as $item){
        ?>
        <option value="<?php echo $item; ?>"><?php echo $item; ?></option>
        <?php
        }
        ?>
    </select>

Thanks for any help

Answer 1

I believe that you dont want to refresh the page when a user clicks on submit. There is very limited info from the question, so I cannot provide changes to your code. But, what you want to do is either prevent the form from submitting by using the preventDefault(); function in JS and then reading the form elements, submitting an aJax request to your server (PHP), and using the server response to display on the page.

If you do not want the form to even submit, you can just make a button that does not submit a form, but simply has an onClick event that reads the form elements and does the same as above.

Form submit will always refresh the page if not prevented. If an action attribute is not provided, it will default to submitting the form to the current page.