Combine array of alternatives with array of php / jquery question

0

My question is this: I have this jquery code where I capture all the questions of a test and just below the alternatives of it; but I can not relate the alternatives to the questions, someone can help me, I tried everything I think.

follows html

<form action="" method="post">
<li><textarea name="quest[]" placeholder="Digite seu texto aqui." required=""></textarea>
<input type="text" id="quest1" name="alternativa[]" value="a)" required="">
<input type="text" id="quest1" name="alternativa[]" value="b)" required=""></li>

<li><textarea name="quest[]" placeholder="Digite seu texto aqui." required=""></textarea>
<input type="text" id="quest2" name="alternativa[]" value="a)" required="">
<input type="text" id="quest2" name="alternativa[]" value="b)" required="">
<input type="text" id="quest2" name="alternativa[]" value="c)" required=""></li></form>

$("body").on('click', 'button[name="enviaProva"]', function (e) {
    e.preventDefault();
    var textarea = [];        
    var input = [];


    $('textarea[name="quest[]"]').each(function () {
        textarea.push($(this).val());
        $(this).parent().children('input[name="alternativa[]"]').each(function () {
            input.push($(this).val());
        });
    });

    $.ajax({
        type: 'POST',
        url: '/enviaProva.php',
        dataType: "json",
        data: {questao: textarea, alternativa: input},
        success: function (res) {

        }
    });
});

The expected result in php would be:

$questao = isset($_POST['questao']) ? $_POST['questao'] : "";
$alternativa = isset($_POST['alternativa']) ? $_POST['alternativa'] : "";

If I give a var_dump in the $ question, it returns me:

array(2) {[0]=> string(12) "primeira questao" [1]=> string(12) "segunda questao"}

no alternative $ returns me:

array(5) { [0]=> string(2) "a)" [1]=> string(2) "b)" [2]=> string(2) "a)" [3]=> string(2) "b)" [4]=> string(2) "c)" } 

The alternatives of the first question are "a)" and "b)". And the second question is "a)", "b)" and "C)"

I can not relate the two arrays within php.

    
asked by anonymous 18.05.2018 / 09:51

2 answers

0

You can create an array where each question is an object of the format

{
  pergunta: 'texto',
  alternativas: [
    'altern 1',
    'altern x'
  ]
}

You can get this like this:

$("body").on('click', 'button[name="enviaProva"]', function(e) {
  e.preventDefault();
  const perguntas = $('textarea[name="quest[]"]').get().map(function(el) {
    const alternativas = $(el)
      .parent()
      .children('input[name="alternativa[]"]')
      .get()
      .map(function(input) {
        return input.value;
      });

    return {
      pergunta: el.value,
      alternativas: alternativas
    };
  });
  
  console.log(JSON.stringify(perguntas));

  $.ajax({
    type: 'POST',
    url: '/enviaProva.php',
    dataType: "json",
    data: perguntas,
    success: function(res) {
      console.log(res);
    }
  });
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script><formaction="" method="post">
  <li><textarea name="quest[]" placeholder="Digite seu texto aqui." required=""></textarea>
    <input type="text" id="quest1" name="alternativa[]" value="a)" required="">
    <input type="text" id="quest1" name="alternativa[]" value="b)" required=""></li>

  <li><textarea name="quest[]" placeholder="Digite seu texto aqui." required=""></textarea>
    <input type="text" id="quest2" name="alternativa[]" value="a)" required="">
    <input type="text" id="quest2" name="alternativa[]" value="b)" required="">
    <input type="text" id="quest2" name="alternativa[]" value="c)" required=""></li>
</form>
<button name="enviaProva">Enviar</button>
    
18.05.2018 / 10:02
0

Hello, I thank the staff for the special help to the moderator Sergio. I managed to pass everything to PHP, both the questions and the alternatives and it looked like this:

    $("body").on('click', 'button[name="enviaProva"]', function (e) {
    e.preventDefault();
    var textarea = [];

    var perguntas = $('textarea[name="quest[]"]').get().map(function (el) {
        var alternativas = $(el)
                .parent()
                .children('input[name="alternativa[]"]')
                .get()
                .map(function (input) {
                    return input.value;
                });
        return {
            perguntas: el.value,
            alternativas: alternativas
        };
    });

    $.ajax({
        type: 'POST',
        url: '/enviaProva.php',
        dataType: "json",
        data: {perguntas: perguntas},
        success: function (res) {
            console.log(res);
        }
    });
});

This way I retrieve the data in PHP:

$questao = isset($_POST['perguntas']) ? $_POST['perguntas'] : "";
var_dump($questao);

and returns me the values:

    array(2) {
  ["perguntas"]=>
  string(8) "primeira"
  ["alternativas"]=>
  array(2) {
    [0]=>
    string(2) "a)"
    [1]=>
    string(2) "b)"
  }
}
array(2) {
  ["perguntas"]=>
  string(7) "segunda"
  ["alternativas"]=>
  array(3) {
    [0]=>
    string(2) "a)"
    [1]=>
    string(2) "b)"
    [2]=>
    string(2) "c)"
  }
}

Now how do I do the insertion in the bank, using the foreach it returns me a new array, how would the insert in the bank in that case?

    
19.05.2018 / 03:44