0

ここに 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 を表示しています。TrueFalseYesNo

Trueただし、ユーザーが、FalseYesまたは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であるが応答ボタンがオンになっていない場合に何が起こるかを確認する手順:

  1. アプリを開いてOpen Gridリンクをクリックし、ボタンTrue or FalseまたはYes or Noグリッドから選択します。次に、Add Questionボタンをクリックすると、選択したものの下に行が追加されます。

  2. 追加された行のテキスト入力で、Number of Answers の値が 1 であることがわかります。これで問題ありません。ただし、追加された行をクリックしてOpen Grid、3 または 4 のいずれかの数値オプションを選択します。回答数のテキスト入力は、本来のように 0 に変化せず、1 と表示されたままです。

True or False前のオプションがまたはYes or Noであるが応答ボタンがオンになっている場合に何が起こるかを確認する手順:

  1. 上記の手順 1 を繰り返します。

  2. 上記の手順 2 を繰り返しますが、 をクリックしOpen Gridてオプションを変更する前に、または/または(選択したオプションによって異なります)Answerの行の一番下にあるボタンを選択し、オプションを数値オプションに変更します。値が 1 から 0 に変化することがわかります。TrueFalseYesNo

アップデート:

私はここで私の古いコードでフィドルを動かしました: 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>では、タグで機能しないのはなぜですか?

4

1 に答える 1

2

問題が見つかりました:jsFiddle:http ://jsfiddle.net/NhaCN/

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 = '';

braとaの2つのタグを持つjquery要素を作成していtableます。したがって、要素に追加するものはすべて、両方のタグに追加されます。

作業コード

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 = $("<table class='noofanswers'><tbody><tr><td>2. Number of Answers:</td></tr></tbody></table>");
var $answer = $("<table class='answer'><tbody><tr><td>3. Answer:</td></tr></tbody></table>");
var $questionType = '';

要素間に新しい行が必要な場合は、ここに追加します。

$tr.append($td);
$td.append($options);
$td.append("<br/>");
$td.append($noofanswers);
$td.append("<br/>");
$td.append($answer);
$tbody.append($tr);  
于 2012-12-29T19:56:22.187 に答える