-2

I am doing a website php based and I have a question with form submit. For example, I have the following form in my index.php:

<form method='post' action='./insert_database.php'>    
<input type="checkbox" name="value[]" value="name1">'name1'</br>
<input type="checkbox" name="value[]" value="name2">'name2'</br>
<input type="checkbox" name="value[]" value="name3">'name3'</br>
<input type="checkbox" name="value[]" value="name4">'name4'</br>
<input type="checkbox" name="value[]" value="name5">'name5'</br>
<input type="checkbox" name="value[]" value="name6">'name6'</br>
<input type='submit' name='submit' value='submit'>
</form>

Then, I can mark a checkbox and when I submit the form, it goes to another url "./insert_database.php" via POST and it launch the proper query.

The problem is that I do not want this. I do not want leave the current page. Exist any form to do it in background and stay in the index.php? I know that I can do a "re-direct" in insert_database.php to index.php but.. I think that exists a better idea.

I mean, I do not want move the user from index.php when they submit the form. Or exist another form to insert a form values into database?

Thank you in advance.


Let me explain my case better...

This is my php code:

echo "<form>";
        if (is_dir($dir)){
            if ($dh = opendir($dir)){
                while (($file = readdir($dh)) !== false){
                    if ($file !== '.' && $file !== '..'){
                        echo '
                        <input type="checkbox" class="song" name="song[]" value="'.$file.'">'.$file.'</br>';
                    }   
                }
                closedir($dh);
            }
        }

    echo "<button id='submit'>Submit</button>";
echo "</form>";

This functions is reading a DIR and creating a form with checkbox with all songs in this dir. Then, if you check for example 5 songs and press the submit button, it execute the following script:

<head>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
    <script>
    $('#submit').click(function() {
    $.ajax({
        url: "./functions/add_list.php",
        type: "post",
        data: $('.song:checked').serialize();
    });
    });

    </script>

</head>

Wheere ./functions/add_list have a php code to insert the values in a database. The problem is that this is not working for me and I do not know why...I am new with ajax and I need help with this... I have tried find a solution in this forum but not found.

Simpleacc
  • 90
  • 1
  • 2
  • 9

2 Answers2

0

Using AJAX to submit the request in background is the way to go.

Using a plugin like jQuery Form would easily solve this: http://malsup.com/jquery/form/

  • then if I send the values via AJAX with a type: "POST" command, it will insert into the database the checked box without leaving the current page? I will try it. Thanks. – Simpleacc Feb 26 '17 at 11:09
0
function submit_form() {
    $.post("./insert_database.php", { 
            //the names of the keys being passed into POST
            first_name: $("#tbxFirstName").val(),
            last_name: $("#tbxLastName").val()
        }, function(msg) {
        //What gets returned by the PHP
        console.log(msg);
    });
};
ToMakPo
  • 855
  • 7
  • 27