Aquí tengo un cuestionario (un cuestionario tipo Likert). Dentro de él, quiero recopilar el número de pregunta y la pregunta-respuesta que puedo agregar como un solo objeto en la matriz. tanto tengo trabajando.

Necesito determinar si la persona iba a cambiar su respuesta en el cuestionario, y si lo hacen, tengo que reemplazar su respuesta anterior (que se guardó en la matriz) a esa ubicación de índice. Si aún no han respondido una determinada pregunta, simplemente empújela en la ubicación del índice del número de la pregunta.

let questions = [];


function get_id(xd,jf){

    let question = (xd.parentNode.id);
    let question_num = document.getElementById(question).getAttribute("value");
    let number = document.getElementById(jf).getAttribute("value");
    let new_answer = {Question:question_num, Answer:number};

    questions.push(new_answer);

    let found = questions.includes(new_answer);

    console.log(found);

    if (found == false) {
        questions.push(new_answer);

    };

    // if (questions.some... " i couldn't understand how to use the some method"

    //for (i = 0; i < questions.length; i++) { "and was thinking about using a for loop somehow."

    console.log(questions);

};

Puedes ver que trato de usar el método de inclusión, que es lo único que puedo obtener para devolver un bol, pero por alguna razón en realidad no comparó el "new_answer" con la respuesta anterior. simplemente volvería cierto cada vez. pero nunca falso, independientemente de que sean lo mismo.

En la parte inferior hay otros intentos / ideas, pero soy demasiado aficionado a esta cosa de programación.

Aquí está el HTML de una sola pregunta si tiene algún valor.

div class="row" id="question_1" value="0">
  <div class="col-sm-2">
    <div class="A">
      how are you?
    </div>
  </div>
  <div class="col-sm-2" id="answer5" onclick="get_id(this, id)" value="10">
    <button id="answer5" value="10">
      5
    </button>
  </div>
  <div class="col-sm-2" id="answer4" onclick="get_id(this, id)" value="8">
    <button id="answer4" value="8">
      4
    </button>
  </div>
  <div class="col-sm-2" id="answer3" onclick="get_id(this, id)" value="5">
    <button id="answer3" value="5">
      3
    </button>
  </div>
  <div class="col-sm-2" id="answer2" onclick="get_id(this, id)" value="2">
    <button id="answer2" value="2">
      2
    </button>
  </div>
  <div class="col-sm-2" id="answer1" onclick="get_id(this, id)" value="0">
    <button id="answer1" value="0">
      1
    </button>
  </div>
</div>

Y sí, ni siquiera estoy usando las propiedades del botón que no sean estilo lmao.

0
austin b 26 may. 2020 a las 21:27

4 respuestas

Puede hacerlo con la condición de verificar la longitud y luego presionar o actualizar

let questions = [];
function get_id(xd,jf){
    let question = (xd.parentNode.id);
    let question_num = document.getElementById(question).getAttribute("value");
    let number = document.getElementById(jf).getAttribute("value");
    let new_answer = {Question:question_num, Answer:number};
    let filtered=questions.filter(x=>x.Question==new_answer.Question);
    if(filtered.length>0){ filtered[0].Answer=new_answer.Answer;}
    else{ questions.push(new_answer);}
    console.log(questions);
};
<div class="row" id="question_1" value="0">
    <div class="col-sm-2"> <div class="A" > how are you? </div></div>
    <div class="col-sm-2" id="answer5" onclick="get_id(this, id)" value="10">
            <button id="answer5" value="10"> 5</button>
    </div>
    <div class="col-sm-2" id="answer4" onclick="get_id(this, id)" value="8">
            <button id="answer4" value="8">  4 </button>
    </div>
    <div class="col-sm-2" id="answer3" onclick="get_id(this, id)" value="5">
            <button id="answer3" value="5">  3 </button>       
    </div>
    <div class="col-sm-2" id="answer2" onclick="get_id(this, id)" value="2">
            <button id="answer2" value="2">2 </button>
    </div>
    <div class="col-sm-2" id="answer1" onclick="get_id(this, id)" value="0">
            <button id="answer1" value="0"> 1</button>
    </div>
</div>
0
pc_coder 26 may. 2020 a las 18:38

Para mí, lo siguiente parece ser la forma correcta de hacerlo.

  1. Filtre las preguntas y excluya la pregunta que se responde
  2. Si ya estará en las preguntas, se excluirá; de lo contrario, las preguntas seguirán siendo las mismas.
  3. Agregue la pregunta contestada que contiene los nuevos datos.

El código es el siguiente

questions = questions.filter(q => q.question_num !== new_answer.question_num);

questions.push(new_answer);
0
muasif80 26 may. 2020 a las 18:34

Has terminado de complicar el problema.

Tenga en cuenta que el índice de la matriz y los números de preguntas son idénticos, por lo que no es necesario buscar una respuesta en la matriz. Ya está en su lugar en la matriz, o no.

Push es el método incorrecto para agregar una respuesta a la matriz, ya que se agregará al final de la matriz. Desea insertar la respuesta en su posición de matriz correcta, que es simplemente:

questions[question_num] = {Question: question_num, Answer: value);
let questions = [];

function get_id(xd) {

  let qDiv = xd.parentNode;
  let question_num = qDiv.dataset.value;
  let value = xd.firstElementChild.value;
  let new_answer = {
    Question: question_num,
    Answer: value
  };

  questions[Number(question_num)] = new_answer;

  result.innerHTML = 'questions: ' +
    JSON.stringify(questions,null,2);
};

let result = document.getElementById('result');
#result {
  border: 1px solid gray;
  margin: 0.3rem;
  padding: 0.5rem;
  font-size: 0.75rem;
}
.row {
  margin-bottom: 0.5rem;
}
<div class="container">
  <div class="row" id="question_1" data-value="1">
    <div class="col-sm-2">
      <div class="A">
        Q1?
      </div>
    </div>
    <div class="col-sm-2" onclick="get_id(this)" value="10">
      <button value="10">5</button>
    </div>
    <div class="col-sm-2" onclick="get_id(this)" value="8">
      <button value="8">
      4
    </button>
    </div>
    <div class="col-sm-2" onclick="get_id(this)" value="5">
      <button value="5">
      3
    </button>
    </div>
    <div class="col-sm-2" onclick="get_id(this)" value="2">
      <button value="2">
      2
    </button>
    </div>
    <div class="col-sm-2" onclick="get_id(this)" value="0">
      <button value="0">
      1
    </button>
    </div>
  </div>

  <div class="row" id="question_3" data-value="3">
    <div class="col-sm-2">
      <div class="A">
        Q3?
      </div>
    </div>
    <div class="col-sm-2" onclick="get_id(this)" value="10">
      <button value="10">
      5
    </button>
    </div>
    <div class="col-sm-2" onclick="get_id(this)" value="8">
      <button value="8">
      4
    </button>
    </div>
    <div class="col-sm-2" onclick="get_id(this)" value="5">
      <button id="answer3" value="5">
      3
    </button>
    </div>
    <div class="col-sm-2" onclick="get_id(this)" value="2">
      <button value="2">
      2
    </button>
    </div>
    <div class="col-sm-2" onclick="get_id(this)" value="0">
      <button id="answer1" value="0">
      1
    </button>
    </div>
  </div>
</div>
<pre id="result"></pre>

<link href="https://stackpath.bootstrapcdn.com/bootstrap/4.5.0/css/bootstrap.min.css" rel="stylesheet">
0
terrymorse 26 may. 2020 a las 19:28

Puedes usar Array.findIndex así. y es mucho más limpio

let questions = [];


function get_id(xd,jf){

    let question = (xd.parentNode.id);
    let question_num = document.getElementById(question).getAttribute("value");
    let number = document.getElementById(jf).getAttribute("value");
    let new_answer = {Question:question_num, Answer:number};

    const founded = questions.findIndex(v => v.Question === question_num);
    if(founded === -1){
      questions.push(new_answer);
      console.log("new question answered");
      console.log(questions);
      return;
    }

    questions[founded].Answer = number;
    console.log("new question updated");
    console.log(questions);

};

codepen si quieres verlo :)

0
rubendmatos1985 26 may. 2020 a las 18:44