jQuery - 同じオブジェクトに依存する2つのオブジェクトを分離する方法は？

Question

私は以前のドロップダウン値に応じてドロップダウンが表示されるフォームのジェネリックバージョンを作成しようとしていますが、いくつかのドロップダウンは2つ以上の以前の回答に依存しています。

同じ質問に同じ回答で依存している質問があるので、JSONを繰り返してみると、両方とも表示されます。一方、2番目の質問は、すべての従属回答が満たされたときにのみ表示されると仮定します。私はそれらを分ける方法が必要です。現在、Id 8と9の質問には同じ従属回答がありますが、質問9にはもう1つの依存関係があります。

JSONは次のようになります。私は、質問8と9で満たされた2つのオブジェクトの配列を取得しますが、9ニーズに疑問を上記のコードでは

function onQuestionSelectChange() { 
     $("#questionsContainer div select").change(function() { 

      var selectedValue = $(this).val(); 
      var selectedQuestion = $(this).parent().attr('id').split('-'); 
      var selectedQuestionId = selectedQuestion[1]; 

      var potentialQuestions = []; 
      //var filteredQuestions = []; 


      $.each(questions, function(index, element) { 
       $.each(element.DependantAnswers, function (indexDepAnswer, elemDepAnswer){ 
        if(elemDepAnswer.answer == selectedValue) 
         potentialQuestions.push(element); 

       }); 

      }); 
      //here I need to separate question 8 from 9 and show only question 8 

     }); 

    } 

：

var questions = [ 
     //questions before these 
     { 

      Id: 6, 
      ProductGroups: [{ 
        ProductGroupId: 1, 
        show: false 
       }, 
       { 
        ProductGroupId: 2, 
        show: true 
       } 
      ], 
      //dependant answer(s) 
      DependantAnswers: [{ 
       QuestionId: 1, 
       answer: "" 
      }] 
     }, 
     { 

      Id: 7, //guid 
      ProductGroups: [{ 
        ProductGroupId: 1, 
        show: false 
       }, 
       { 
        ProductGroupId: 2, 
        show: false 
       } 
      ], 
      //dependant answer(s) 
      DependantAnswers: [{ 
       QuestionId: 6, 
       answer: "male" 
      }] 
     }, 
     { 

      Id: 8, //guid 
      ProductGroups: [{ 
        ProductGroupId: 1, 
        show: false 
       }, 
       { 
        ProductGroupId: 2, 
        show: false 
       } 
      ], 
      //dependant answer(s) 
      DependantAnswers: [{ 
       QuestionId: 6, 
       answer: "female" 
      } 
      ] 
     }, 
     { 

      Id: 9, //guid 
      ProductGroups: [{ 
        ProductGroupId: 1, 
        show: false 
       }, 
       { 
        ProductGroupId: 2, 
        show: false 
       } 
      ], 
      //dependant answer(s) 
      DependantAnswers: [{ 
        QuestionId: 6, 
        answer: "female" 
       }, 
       { 
        QuestionId: 8, 
        answer: "yes" 
       } 
      ] 
     } 

    ]; 

そして、これは、jQueryの関数であります質問8が値「はい」で応答された場合にのみ表示されます。私が試したことが何であれ、質問9は質問8と同じように進みます。なぜなら、それは同じ従属回答を持っているからです。質問9をフィルタリングして質問8で「はい」を選択した後でのみ表示するにはどうすればよいですか？

Answer 1

あなたの現在のソリューションの問題は、あなたが、あなたがどんな質問に依存回答のリストにあるように、現在選択された答えを見つける場合は、あなたの質問の配列で現在選択されて答えをチェックし、されていることですその質問は潜在的な次の質問として検討されていますが、その質問には成就できないかもしれない複数の貧困があるかもしれませんが、あなたはいかなる種類の国も維持していないので確認できません。あなたは、単に次の潜在的な問題の検索に確認しながら、すべてのdependcyが満たされた場合に答えてされた質問を追跡してハッシュマップを作成して行うことができます

一つ。

私が想定している元の関数は、それぞれの選択変更で呼び出されています。

var questionsCompleted = Object.create(null); 

function onQuestionSelectChange() { 
    $("#questionsContainer div select").change(function() { 

     var selectedValue = $(this).val(); 
     var selectedQuestion = $(this).parent().attr('id').split('-'); 
     var selectedQuestionId = selectedQuestion[1]; 

     var potentialQuestions = []; 
     //var filteredQuestions = []; 

     // Update the Hashmap 
     questionsCompleted[selectedQuestionId] = selectedValue; 

     // Check all the questions for the next potential question. The next potential question will be the one whose all dependent question are already answered 
     $.each(questions, function(index, element) { 
      var fulfilled = 0; 
      $.each(element.DependantAnswers, function(indexDepAnswer, elemDepAnswer) { 
       if (elemDepAnswer.answer === questionsCompleted[element.Id]) 
        fulfilled++; 

      }); 
      if (fulfilled === element.DependantAnswers.length) // All dependency fulfilled 
       potentialQuestions.push(element); 

     }); 
     //here I need to separate question 8 from 9 and show only question 8 

    }); 

} 

これが役に立ちます。

Answer 2

これはこれを行う1つの方法です。ここでは、すでに回答している質問の配列があるので、どのような潜在的な質問が表示されるかを把握することができます。私はあなたがこれを最適化できると確信していますが、これは非常に簡単な方法でそれを行う方法を示すことです。お役に立てれば。

let selectedValue = 'female'; 
// Push selectedValue into some array to keep track of current answers 
let selectedValues = [ 
    {QuestionId: 1, answer: 'q1'}, 
    {QuestionId: 2, answer: 'q2'}, 
    {QuestionId: 3, answer: 'q3'}, 
    {QuestionId: 4, answer: 'q4'}, 
    {QuestionId: 5, answer: 'q5'}, 
    {QuestionId: 6, answer: 'female'} 
]; 

let resultingQuestions = []; 

questions.filter((q) => { 
    return q.DependantAnswers.find((dp) => { 
    return dp.answer === selectedValue; 
    }); 
}).filter((pq) => { 
    let validQuestion; 
    pq.DependantAnswers.forEach((da) => { 
    validQuestion = selectedValues.find((sv) => { 
     return sv.QuestionId === da.QuestionId && sv.answer === da.answer; 
    }); 
    }); 

    if (validQuestion) { 
    resultingQuestions.push(pq); 
    } 
});