ここに jsfiddle があります: http://jsfiddle.net/aND4g/2/表示されるテキスト入力値に問題があります。
Option がTrue or False
またはYes or No
の場合、Number of Answers テキスト入力には常に値 1 が含まれている必要があります (常に、この値は変更できません)。その後、ユーザーがTrue or False
またはYes or No
オプションから番号付きオプションのいずれかに変更した場合、テキスト入力は 0 に戻る必要があります。
ただし、ユーザーがTrue or False
またはオプションを表の行に追加し、 、、またはYes or No
のいずれの回答ボタンもオンにせず、オプションを番号付きオプションの 1 つに変更すると、0 が表示される代わりに問題が発生します。値 1 を表示しています。True
False
Yes
No
True
ただし、ユーザーが、False
、Yes
またはNo
回答ボタンのいずれかをオンにしてから、オプションを番号付きオプションのいずれかに変更するとTrue or False
、テキストYes or No
入力の値が から に変更され1
ます0
。
0
なぜこれを行うのですか?番号付きオプションが選択されるたびに、常にテキスト入力になるように修正するにはどうすればよいですか?
問題は以下のどこかにあると思いますが、よくわかりません:
$(this).closest('.option').siblings('.answer').find('.answers').each(function(index) {
if (!isNaN(clickedNumber) && index < clickedNumber) {
$(this).show();
if (prevButton === 'True or False' || prevButton === 'Yes or No') {
// show as blank
$(this).closest('.option').siblings('.numberAnswer').find('.answertxt').val(0).show();
} else {
// show but don't change the value
$(this).closest('.option').siblings('.numberAnswer').find('.answertxt').show();
}
} else {
$(this).hide();
$(this).removeClass('answerBtnsOn');
$(this).addClass('answerBtnsOff');
}
....
function btnclick(btn, iQuestionIndex, bDisableAppend) {
//var context = $(btn).parent();
var context = $(btn).parents('tr'); // need to go up one level
context.add(context.siblings()); // to collect siblings in other rows since the limit in each row is 7
if (context.length == 0) {
context = $(btn).parents('tr');
}
var $btn = $(btn);
var value = btn.value;
var id = $btn.attr('id');
....
updateAnswer(context , iQuestionIndex, bDisableAppend);
var container = $btn.closest(".optionAndAnswer");
// here the zero gets assigned
var answertxt = $(".answertxt", container);
var numberison = $(".answerBtnsOn", container).length;
var maxRowValue = $('.gridTxt', container).val();
if (btn.id == "answerTrueRow" || btn.id == "answerFalseRow")
return;
if (maxRowValue === 'True or False' || maxRowValue === 'Yes or No') {
if (answertxt.val() == 1 && numberison == 0) {
numberison = 1;
}
}
answertxt.val(numberison);
return false;
}
アップデート:
フィドルは、メイン アプリケーションの完全な短縮版です。追加された各行は質問としてカウントされるため、行 1 は質問 1、行 2 は質問 2 などです。フィドルでは、オプションの種類、回答の数、および上部の正解を選択し、それを行に追加します。オプションの種類、回答の数、および変更したい場合は、追加された行の正解を編集できます。それが、設定されている方法で設定されている理由です。
JSFIDDLE の手順:
True or False
前のオプションがまたはYes or No
であるが応答ボタンがオンになっていない場合に何が起こるかを確認する手順:
アプリを開いて
Open Grid
リンクをクリックし、ボタンTrue or False
またはYes or No
グリッドから選択します。次に、Add Question
ボタンをクリックすると、選択したものの下に行が追加されます。追加された行のテキスト入力で、Number of Answers の値が 1 であることがわかります。これで問題ありません。ただし、追加された行をクリックして
Open Grid
、3 または 4 のいずれかの数値オプションを選択します。回答数のテキスト入力は、本来のように 0 に変化せず、1 と表示されたままです。
True or False
前のオプションがまたはYes or No
であるが応答ボタンがオンになっている場合に何が起こるかを確認する手順:
上記の手順 1 を繰り返します。
上記の手順 2 を繰り返しますが、 をクリックし
Open Grid
てオプションを変更する前に、または/または(選択したオプションによって異なります)Answer
の行の一番下にあるボタンを選択し、オプションを数値オプションに変更します。値が 1 から 0 に変化することがわかります。True
False
Yes
No
アップデート:
私はここで私の古いコードでフィドルを動かしました: http://jsfiddle.net/aND4g/50/
ここに最新のjsfiddleがありますが、これはうまく機能していません: http://jsfiddle.net/aND4g/53/
フィドルとそれが機能しなくなった原因との唯一の違いは、以下のコードであることがわかりました。
var $tbody = $('#qandatbl_onthefly > tbody');
var $tr = $("<tr class='optionAndAnswer' align='center'>");
var $td = $("<td width='50%' class='extratd'>");
var $options = $("<table class='option'><tbody><tr><td>1. Option Type:</td></tr></tbody></table>");
var $noofanswers = $("<br /><table class='noofanswers'><tbody><tr><td>2. Number of Answers:</td></tr></tbody></table>");
var $answer = $("<br /><table class='answer'><tbody><tr><td>3. Answer:</td></tr></tbody></table>");
var $questionType = '';
作業バージョンには、次のコードが含まれています。
var $tbody = $('#qandatbl_onthefly > tbody');
var $tr = $("<tr class='optionAndAnswer' align='center'>");
var $td = $("<td class='extratd'>");
var $noofanswers = $("<div class='noofanswers'>2. Number of Answers:<br/></div>");
var $options = $("<div class='option'>1. Option Type:<br/></div>");
var $answer = $("<div class='answer'>3. Answer:<br/></div>");
var $questionType = '';
$options
、$noofanswers
および$answer
変数を<table>
タグからタグに変更すると、機能し<div>
ます。<table>
しかし、変数をタグではなくタグに配置したい<div>
。<table>
では、タグで機能しないのはなぜですか?