ページの上部には、ユーザーがグリッドからオプションを選択できるオプションと回答のコントロールがあり、選択したオプションに応じて関連する回答ボタンが表示されます。
以下は、オプションと回答の制御機能を格納する html コードです。
ページ上部のオプションと回答のコントロール:
<table id="optionAndAnswer" class="optionAndAnswer">
<tr class="option">
<td>1. Option Type:</td>
<td>
<div class="box">
<input type="text" name="gridValues" class="gridTxt maxRow" id="mainGridTxt" readonly="readonly" />
<span href="#" class="showGrid" id="showGridId">[Open Grid]</span>
</div>
<?php
$num = range("3","26");
?>
<table class="optionTypeTbl">
<tr>
<?php
$i = 1;
foreach($num as $key => $val){
if($i%7 == 1) echo"<tr><td>";
echo"<input type=\"button\" value=\"$val\" id=\"btn".$val."\" name=\"btn".$val."Name\" class=\"gridBtns gridBtnsOff\">";
if($i%7 == 0) echo"</td></tr>";
$i++;
}
?>
</tr>
</table>
</td>
</tr>
<tr class="answer">
<td>3. Answer</td>
<td>
<?php
$a = range("A","Z");
?>
<table id="answerSection">
<tr>
<?php
$i = 1;
foreach($a as $key => $val){
if($i%7 == 1) echo"<tr><td>";
echo"<input type=\"button\" onclick=\"btnclick(this);\" value=\"$val\" id=\"answer".$val."\" name=\"answer".$val."Name\" class=\"answerBtns answers answerBtnsOff\">";
if($i%7 == 0) echo"</td></tr>";
$i++;
}
?>
</tr>
</table>
</td>
</tr>
</table>
追加ボタンがクリックされた後に正しい数の回答ボタンを表示するコード行は次のコードです:
$('#btn'+gridValues).trigger('click');
このコードは含まれていませんが、ユーザーは [追加] ボタンをクリックして、オプション タイプのテキスト ボックスにオプション タイプを追加できます。オプション タイプがテキスト ボックスに挿入されると、グリッド内でオプション値が一致するオプション ボタンが自動的に選択されます。このため、上記のトリガー コードは、どのオプション タイプが正しいかを確認することで、正しい数の回答ボタンを表示できます。グリッドから選択されます。
私が抱えている問題は、これがページの上部にあるオプションと回答のコントロールでのみ機能することです。ユーザーはアプリケーションに行を追加でき、各行に独自のオプションと回答コントロールを追加できます。行内の追加および回答とオプション コントロールのコードは次のとおりです。
function insertQuestion(form) {
var $tbody = $('#qandatbl > tbody');
var $tr = $("<tr class='optionAndAnswer' align='center'>");
var $options = $("<div class='option'>Option Type:<br/></div>");
var $answer = $("<div class='answer'>Answer:<br/></div>");
$('.gridTxt', context).each( function() {
var $this = $(this);
var $optionsText = $("<input type='text' class='gridTxtRow maxRow' readonly='readonly' />")
.attr('name',$this.attr('name')+"[]")
.attr('value',$this.val())
.appendTo( $options )
.after("<span href='#' class='showGrid'>[Open Grid]</span>");
$questionType = $this.val();
});
var $this, i=0, $row, $cell;
$('#optionAndAnswer .answers').each(function() {
$this = $(this);
if(i%7 == 0) {
$row = $("<tr/>").appendTo($answer);
$cell = $("<td/>").appendTo($row);
}
var $newBtn = $("<input class='answerBtnsRow answers' type='button' style='display:%s;' onclick='btnclick(this);' />".replace('%s',$this.is(':visible')?'inline-block':'none')).attr('name', $this.attr('name')).attr('value', $this.val()).attr('class', $this.attr('class'));
$newBtn.appendTo($cell);
i++;
});
$td.append($options);
$td.append($answer);
$tbody.append($tr);
}
したがって、私の質問は、このトリガー$('#btn'+gridValues).trigger('click');
が上部のメインオプションと回答コントロールでのみ機能する場合、特定の行内の回答とオプションコントロールに正しい数の回答ボタンを表示できるようにするには、このトリガーをどのように含めることができますか?
行を見つけることができる開始コードがあります。行#btn
のオプションと応答コントロールにないため、このコードの最後にトリガーを含める方法についてのヘルプが必要です:
$(plusbutton_clicked).closest('tr').....;