0

我有一个你可以在下面使用的应用程序，但基本上它是一个文本输入，在用户从一行添加信息后不会改变。

这是应用程序：

应用

请按照以下步骤操作：

1：当你打开应用程序时，你会看到一个“添加问题”按钮，点击这个按钮，你会看到下面附加了一个表格行。

2：在附加的行中，单击按钮“B”和“C”，这些按钮将变为绿色，表示它们已打开，在下方您将看到 2 个文本输入显示您已打开的按钮的值。

3：您将在行的左侧看到一个绿色的加号按钮。请单击此按钮，您将看到一个模式窗口出现。

4：您将在模态窗口中看到一个搜索栏，在搜索栏中输入“狗”，然后单击搜索按钮。

5：将出现与您的搜索相关的一行，请点击右侧的“添加”按钮添加信息。

6：您将在附加行中看到，现在按钮“A”已突出显示，而其他按钮已关闭。

但问题是下面的文本输入并没有改变。IT 仍然显示值“B”和“C”的文本输入，这是不正确的，因为按钮“A”已打开并且是唯一打开的按钮，它应该只显示为按钮“A”的文本输入，另一个应删除文本输入。

所以我的问题是，在用户从模式窗口添加信息之后，它如何将文本输入更改为仅显示打开的按钮的值？

以下是更新答案按钮的代码：

    updateAnswer(context , iQuestionIndex, bDisableAppend);

    var container = $btn.closest(".optionAndAnswer");
    $(".answertxt", container).val( $(".answerBtnsOn", container).length );

    return false;
}


function updateAnswer(context, iQuestionIndex, bDisableAppend) {
    var _sCurrQ_Class = 'q_' + iQuestionIndex;
    var _oCurrAnswerContainer = jQuery('#answer_selections .' + _sCurrQ_Class);
    if (!_oCurrAnswerContainer.length) {
        _oCurrAnswerContainer = jQuery(document.createElement('div')).addClass(_sCurrQ_Class);
        !bDisableAppend && jQuery('#answer_selections').append(_oCurrAnswerContainer);
    }

    _oCurrAnswerContainer.html('');

    var value, id;
    // loop through all buttons with 'on' status and their info to the current answer container
    $('.answerBtnsOn', context).each(function(i, btn) {

        var $btn = $(btn);
        value = btn.value;
        id = $btn.attr('id');

        var n = $("input[name='" + id + "value']").length;
        var hid = "hidden" + id + n + "value";    
        $(btn).attr("data-hid", hid);


        if (!bDisableAppend) {
            // append those values to the form
            var input = '<input type="text" id="' + hid + '" value="' + value + '" name="' + id + 'value" />';
            _oCurrAnswerContainer.append(input);
        }
    });        
}

下面是它控制模态窗口及其中所有内容的代码：

函数添加窗口（btn）{

    var answers = $.map(btn.split(''),function(chr){   return "#answer"+chr;  }).join(', 
    var answersrow = $.map(btn.split(''),function(chr){   return "#answer"+chr+"Row";  }).join(', ');
}



    if($(plusbutton_clicked).attr('id')=='mainPlusbutton') { //green plus button at top of application


        $('#answerSection').find('.answerBtnsOn').removeClass('answerBtnsOn').addClass('answerBtnsOff');
        $(answers).addClass("answerBtnsOn").siblings().addClass('answerBtnsOff');

        } else { 
//green plus button within an appended row
            $(plusbutton_clicked).closest('tr').find('.answerBtnsOn').removeClass('answerBtnsOn').addClass('answerBtnsOff');
            $(plusbutton_clicked).closest('tr').find(answersrow).addClass("answerBtnsOn").siblings().addClass('answerBtnsOff');

            }

    $.modal.close(); 
    return false;
}
4

1 回答 1

0

正如我在评论中提到的，用于updateAnswer更新文本输入。

您需要发送包含该答案的所有按钮的节点。在addwindow我认为应该是$(plusbutton_clicked).closest('tr')。您还需要以某种方式发送问题索引。

如果您将一些数据属性附加到某些元素以简化检索各种值而不是为每个值创建类，这可能会更容易。

于 2012-10-08T12:09:40.433 回答