追加された行に「True」、「False」、「Yes」、「No」のボタンが表示されません。
ここにアプリケーションがあります:アプリケーション
アプリケーションを使用するには、次の手順に従ってください。
1. アプリケーションを開くと、緑色のプラス ボタンが表示されます。このボタンをクリックすると、モーダル ウィンドウが表示され、内部に検索バーが表示されます。
2. 検索バーに次の「オレンジ」と入力し (二重引用符なし)、検索を送信します。
3. 検索の用語と「質問」列の下の用語に一致する行が表示されます。「回答」列の下に、回答が「True」であることが表示されます。「追加」ボタンをクリックして行から内容を追加してください。
4. 右側に「True」ボタンと「False」ボタンが表示され、「True」ボタンが緑色で強調表示されていることがわかります。これで問題ありません。
しかし、以下で問題が発生します。
1. [質問を追加] ボタンをクリックすると、下に行が追加され、上からコントロールがコピーされます。
2. 追加した行に別の緑色のプラス ボタンが表示されます。このボタンをクリックして、手順 2 と 3 をもう一度実行します。
追加された行には、「True」または「False」ボタンがまったく表示されていないことがわかります。だから私の質問は、追加された行内で、モーダルウィンドウから質問を追加すると、答えが「True」または「False」の場合に「True」または「False」ボタンが表示されないのはなぜですか? これは「はい」「いいえ」ボタンでも同様です。
コード全体が jsfiddle に表示されます (モーダル ウィンドウを開く関数は、フィドルの JavaScript セクションの下部にあります)。
コード：
function plusbutton(plus_id) {
// Set global info
plusbutton_clicked = plus_id;
// Display an external page using an iframe
var src = "previousquestions.php";
$.modal('<iframe src="' + src + '" style="border:0;width:100%;height:100%;">');
return false;
}
function addwindow(numberAnswer, gridValues, btn) {
if (btn == "True" || btn == "False" || btn == "Yes" || btn == "No") {
var answers = '#answer' + btn;
var answersrow = '#answer' + btn + 'Row';
} else {
var answers = $.map(btn.split(''), function(chr) {
return "#answer" + chr;
}).join(', ');
var answersrow = $.map(btn.split(''), function(chr) {
return "#answer" + chr + "Row";
}).join(', ');
}
var myNumbers = {};
myNumbers["True or False"] = "True or False";
myNumbers["Yes or No"] = "Yes or No";
gridValues = myNumbers[gridValues];
if ($(plusbutton_clicked).attr('id') == 'mainPlusbutton') {
if (gridValues == "True or False") {
$('#btn' + 'TrueorFalse').trigger('click');
}
else if (gridValues == "Yes or No") {
$('#btn' + 'YesorNo').trigger('click');
}
$('#answerSection').find('.answerBtnsOn').trigger('click');
$(answers).trigger('click');
} else {
if (gridValues == "True or False") {
$(plusbutton_clicked).closest('tr').find('input.gridTxtRow').val(gridValues).parent().append($('.optionTypeTbl'));
$('#btn' + 'TrueorFalse').trigger('click');
}
else if (gridValues == "Yes or No") {
$(plusbutton_clicked).closest('tr').find('input.gridTxtRow').val(gridValues).parent().append($('.optionTypeTbl'));
$('#btn' + 'YesorNo').trigger('click');
}
}
$('#btn' + gridValues).trigger('click');
$(plusbutton_clicked).closest('tr').find('.answerBtnsOn').trigger('click');
$(plusbutton_clicked).closest('tr').find(answersrow).trigger('click');
$.modal.close();
return false;
}
トッププラスボタンの HTML:
<table id="question">
<tr>
<td colspan="2">
<a onclick="return plusbutton();">
<img src="Images/plussign.jpg" width="30" height="30" alt="Look Up Previous Question" class="plusimage" id="mainPlusbutton" name="plusbuttonrow"/>
</a>
<span id="plussignmsg">(Click Plus Sign to look up Previous Questions)</span>
</td>
</tr>
</table>
以下は、各行にプラスボタンを追加する jquery コードです。
$('.plusimage').each( function() {
var $this = $(this);
var $plusimagerow = $("<a onclick='return plusbutton(this);'><img src='Images/plussign.jpg' width='30' height='30' alt='Look Up Previous Question' class='imageplus'/></a>").attr('name',$this.attr('name')+"[]")
.attr('value',$this.val());
$plusrow.append($plusimagerow);
});
