Select Question Matrix

Въпрос с отговор, състоящ се от няколко полета за избор.

Опции

• question | (string|node): въпрос, който да се показва в горната част на матрицата за избор на въпрос. Default: ''.
• rows | array: етикети на редове. Default: [].
• cols | array: етикети на колони. Default: [].
• options | object: обект с двойки ключове-стойности с ключове с формата row:col, например 0:0, 0:1, 1:0 и т.н., а съответстващите им стойности са масиви от възможните варианти на отговори за отделните въпроси за избор. Default: {}.
• solution | object: обект за решение с двойки ключове-стойности с ключове с формата реда:колона, например 0:0, 0:1, 1:0 и т.н., а съответните им стойности са индексът на елемента на правилния отговор от съответния масив опции.. Default: {}.
• hints | array<(string|node)>: подсказки, които дават насоки за това как да отговорите на въпроса. Default: [].
• hintPlacement | string: разположение на подсказките (или top, right, left, или bottom). Default: 'bottom'.
• feedback | boolean: контролира дали да се показват бутони за обратна връзка. Default: true.
• provideFeedback | string: дали да предоставите "никаква" обратна връзка изобщо, "индивидуална" обратна връзка за подадения отговор(и) или "обща" обратна връзка за всички въпроси.. Default: 'individual'.
• allowIncomplete | boolean: дали да разрешите подаване на данни без избор, направен във всяко поле за избор. Default: false.
• nTries | number: след колко опита не се приемат допълнителни отговори (ако provideFeedback не е none). Default: 3.
• failureMsg | string: текст на известие, който се показва при подаване на неправилни отговори. Default: none.
• successMsg | string: текст на известие, който се показва при подаване на верни отговори. Default: none.
• cellLabels | object: етикети за клетки, дефинирани от обект с ключове с формат row:col. Default: {}.
• chat | boolean: контролира дали елементът трябва да има интегриран чат. Default: false.
• panelProps | object: допълнителни свойства, които да се предават на външния компонент
  . Default: {}.
• className | string: име на класа. Default: ''.
• style | object: CSS инлайн стилове. Default: {}.
• onChange | function: функция за обратна връзка, която се извиква при промяна на отговорите. Default: onChange() {}.
• onSubmit | function: функция за обратна връзка, която се извиква при подаване с отговорите като първи и булев параметър, указващ коректност, като втори параметър. Default: onSubmit() {}.

Примери

• Minimal
• With Hints
• With Style
• Feedback Messages

Редактор в реално време

<SelectQuestionMatrix question="Test your art history knowledge" rows={[ 'Composer', 'Author' ]} cols={[ '18th Century', '19th Century' ]} options={{ '0:0': [ 'Philipp Emmanuel Bach', 'Johann Wolfgang von Goethe', 'Nicolas Poussin'], '0:1': [ 'Gustave Flaubert', 'Gustave Courbet', 'Richard Wagner'] , '1:0': [ 'Philipp Emmanuel Bach', 'Johann Wolfgang von Goethe', 'Nicolas Poussin'], '1:1': [ 'Gustave Flaubert', 'Gustave Courbet', 'Richard Wagner'] }} solution={{ '0:0': 0, '0:1': 2, '1:0': 1, '1:1': 0 }} />

<SelectQuestionMatrix
    question="Test your art history knowledge"
    rows={[ 'Composer', 'Author' ]} 
    cols={[ '18th Century', '19th Century' ]} 
    options={{ 
        '0:0': [ 'Philipp Emmanuel Bach', 'Johann Wolfgang von Goethe', 'Nicolas Poussin'], 
        '0:1': [ 'Gustave Flaubert', 'Gustave Courbet', 'Richard Wagner'] ,
        '1:0': [ 'Philipp Emmanuel Bach', 'Johann Wolfgang von Goethe', 'Nicolas Poussin'],
        '1:1': [ 'Gustave Flaubert', 'Gustave Courbet', 'Richard Wagner'] 
    }} 
    solution={{ '0:0': 0, '0:1': 2, '1:0': 1, '1:1': 0 }}
/>

Резултат

ReferenceError: Provider is not defined