如何将数组从javascript传递到php

Question

So i've been asked to remake some registration forms. The way its supposed to work is, that an interpreter chooses X amount of languages in the first select box. Then based on the selections of languages, the user must specify from which languages they can translate from/to.

I want to store this data in a key/value array, with the key being "LanguageFrom" and Value being another array, of "LanguagesTo". This is how i have solved this:

function btnTest() {
            var fromArray = $('.freelancerLanguagesFrom').map(function() {
                return $(this).val();
            }).get();

            var toArray = $('.freelancerLanguagesTo').map(function() {
                return $(this).val();
            }).get();

            var tempArray = {};
            tempArray[fromArray] = toArray;
}

This method is being called with an "onclick" function in the html part. The user should specify which languages he can translate to for each of the chosen languages in the first box, I am aware that this probably isn't the ideal approach, but im still an inexperienced developer, and i'd love to hear your take on another approach. Now comes my problem:

1) How do i make it so the array wont overwrite the existing array with each button click, and instead just add to the array?

2) How do i process this array on the server side (php), so that i can store the values in my database?

3) Is it possible to skip the flow where the user has to press the save(gem) button after each language he has chosen?

edit: Question 1 and 3 are now solved, my only problem is accessing the array i made in js, on the php side

Answer 1

1) tempArray exists only in the scope of the btnTest() function. Declare it outside (in the global scope), initialize it as {} and don't reset it every time you click the button. The way you get the fromArray variable may require some tweaking depending on whether the "from" list can accept a multiple selection or not.

2) Ajax may help. Create a php endpoint to receive the request and call it using ajax. You can work on the array using JSON . Send your data using JSON.stringify(tempArray) and read it using json_decode() in your php script, or simply set the request headers as "application/json" to have it done automatically for you.

3) I personally wouldn't automate this process. Let's say I have 4 languages, Italian, English, French and Chinese.

I have selected a desirable state of languages I can handle:

Italian -> English, French

But I also know how to translate French in Italian so I click, in the from list, French, and I get

French -> English

Which is an undesirable state, for me, because I don't know how to do that. Especially if I were to select many languages, I'd get, inbetween 2 states I want to save, an indefinite amount of states I don't want to save.

If you still want to do so, you need to move the even listener from the button to the list(s), with the onchange event.

I'd also suggest you do your event binding trough jQuery , if you aren't already.

Hope this helped.