Is there a way to store in a PHP array the selected Jesús Díaz Castro May 29 '20 at 14:02

2 Answers2

2

Personaly I would use change in stead of input in the .on() function for detecting a change like:

$('.linPed').on('change', function() {
  alert( this.value );
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<select class='linPed'>
    <option value="1"><li>One</li></option>
    <option value="2">Two</option>
</select>

For getting al the value I would use the .each() function like:

var arr = [];
$('.linPed').each(function(){
  arr.push($(this).val())
})

If I'm correct this gives you al the selected values in the array arr.

Edit:

I executed echo myself and lookt at it. It is there where lays the problem. Your class is't linPed it's \"linPed"\.

enter image description here

In your code replece al the \ with nothing.

Edit 2:

Having a look at your snippet and saw it instantly. You js ran before the html is loaded. Put your JavaScript at the end of your code. Or put an ready function around your code like

$(function () {
  //Code ..
});
Tim567
  • 775
  • 1
  • 5
  • 22
  • @JesúsDíazCastro made one with an `
  • ` still works. Are you sure your `linPed` class is on the `
  • – Tim567 May 29 '20 at 13:08
  • I think so, in the question is shown on the PHP function part – Jesús Díaz Castro May 29 '20 at 13:11
  • Made an eddit to my answer please look at it – Tim567 May 29 '20 at 13:25
  • I have just tried that, but still doesnt show the alert box. I have edited the question, with the class name withouth errors. and still doesn't work... – Jesús Díaz Castro May 29 '20 at 13:54
  • Edit wil do it! – Tim567 May 29 '20 at 14:06
  • 0

    Despite the fact I wouldn't have achieved the solution without Tim's answer, I want to post how have I stored the html values into the php array in case someone ecounters this same problem.

    Using onchange inside the <select> field I call a js function (with parameters: the value of the selected option and the select id)

    <select onchange="añadirDTO(this.value, this.id)">
       ...
    </select>
    

    JS

    First of all, create 2 global variables that correspond to the parameters of the function, in this case array and number.

    var dtoSeleccionados = [];
    var id = 0; //Initialize both var
    

    Now the function that receives the data:

    This function will be called each time the user changes a select, so to avoid useless values an store only the final decision of each select, check if the id of the select passed as parameter is equal to the global id var. If it isn't we change the global id for the new id, else change the last element of the global array

    function añadirDTO(baseDTO, linId){
        if(linId !== id){
            id = linId;
            dtoSeleccionados.push(baseDTO);
        }else{
            dtoSeleccionados[dtoSeleccionados.length - 1] = baseDTO;
        }
    }
    

    Once the user has completed the form and the array values are definitives, using an auxiliar <select multiple> field that is hidden, we modify its inner html like so:

    <div>
        <!-- we use a label to identify the element that it corresponds with the php var -->
        <label for="baseDTO" hidden></label>
        <!-- the name of the select must match with the php array name with '[]' at the end -->
        <select multiple name="baseDTO[]" id="baseDTO" hidden>
    
        </select>
    </div>
    
    function seleccionarTodo(){
        text="";
        for(i=0; i<dtoSeleccionados.length; i++){
            text += "<option selected value=\""+dtoSeleccionados[i]+"\"></option>\n";
        }
    
        document.getElementById("baseDTO").innerHTML = text;
    }
    

    The above function goes at the submit of the form like so:

    <input type="submit" onclick="seleccionarTodo()" value="Registrar factura"/>
    

    And that succesfully add one by one different <select> <option> 's into an array