Как мне увеличить количество параметров в этом JavaScript? - PullRequest
0 голосов
/ 03 апреля 2012

Объявление: я не уверен, является ли это параметром. Пожалуйста, просветите.

У меня есть медицинская анкета с почти 19 переключателями «да» и «нет». Для того, чтобы она работала, переключатели каждого вопроса должны иметь уникальное имя для ввода. Мне удается найти подходящий код для переключения текстовой области, если выбран переключатель «Да», однако он может работать только с одним из входных имен, и есть еще 18, которые также должны работать.

Мой главный вопрос:

function displayTextBox()
    {
        var objElement = document.getElementById('addmed');
        addmed.style.display = 'block';
        addmed.style.visibility = 'visible';
    }

    function hideTextBox()
    {
        var objElement = document.getElementById('addmed');
        addmed.style.display = 'none';
        addmed.style.visibility = 'hidden';
    }

    function validate()
    {
        var arrElements = document.getElementsByName('medq');
        var objElement;
        var boolContinue = false;
        var objaddmedtext;

        for(var i=0, _length=arrElements.length; i<_length; i++)
        {
            objElement = arrElements[i];

            if(objElement.checked)
            {
                if(objElement.id == 'yes')
                {
                    objaddmedtext = document.getElementById('addmedtext');

                    if(strTrim(objaddmedtext.value).length>0)
                    {
                        boolContinue = true;
                        break;
                    }
                }
                else
                {
                    boolContinue = true;
                    break;
                }
            }
        }

        if(boolContinue)
        {
            alert('Continue, user completed the information.')
        }
        else
        {
            alert('Ask user to complete the data.')
        }
    }

    /**
     * Removes all white space characters from the string.
     * 
     * @param: {String} String to trim.
     * 
     * @return {String} Trimed string.
    */
    function strTrim(strTrim) 
    {
        return strTrim.replace(/^\s+|\s+$/g, '');
    }

Глядя на этот javascript, текстовую область

<div id="addmed" style="display:none;visibility:hidden; margin-left:10px; width:110px;">
        <textarea id="addmedtext" cols="60" rows="6" placeholder="Please give details with dates"></textarea>
</div> 

появится только в том случае, если для * 1011 выбрана радиокнопка yes.

<tr>
<td width="33">1.</td>
<td width="491">Heart or circulatory problems including: high blood pressure, heart attack, angina, heart murmur, heart failure, palpitations, circulatory problemseg. whitefinger, blocked arteries, stroke aneurysm.</td>
<td width="68"><input name="medq" id="yes" type="radio" value="yes" onclick="displayTextBox()"/><label for="yes"> Yes </label></td>
<td width="78"><input name="medq" id="no" type="radio" value="no" onclick="hideTextBox()"/><label for="no"> No </label></td>

Однако это только 1 вопрос ... У меня есть еще 18 вопросов с name="medq 1 to 18 ".

Есть идеи, как редактировать JavaScript, чтобы добавить параметры ??

1 Ответ

1 голос
/ 03 апреля 2012

Во-первых, вы должны иметь уникальный идентификатор на каждой переключателе. Но вам нужно одно и то же ИМЯ на каждой паре кнопки ДА / НЕТ, чтобы обработать выбранную пару. Таким образом, вы можете иметь

<input type="radio" name="foo" id="foo_y" value="yes" /><label for="foo_y">Yes</label>
<input type="radio" name="foo" id="foo_n" value="no" /><label for="foo_y">Yes</label>
<textarea id="foo_text" name="foo_text"><textarea>

Теперь, для переключателей «да», вы можете добавить onclick = "displayTextBox (this)". «this» - указатель на текущий переключатель.

Затем вы можете обновить функцию следующим образом:

function displayTextBox( f ) { // f is the field that was clicked
    f.style.display = 'block';
    f.style.visibility = 'visible';
}

Теперь это общая функция. Сделайте то же самое для функции «скрыть».

Наконец, вы можете обновить свою функцию проверки, чтобы циклически проходить по массиву полей ввода формы вместо просмотра одного поля.

  1. var arrElements = document.getElementsByTagName("input");.
  2. Внутри вашего цикла: if( (objElement.type === "radio") && (objElement.checked) ) {.
  3. Не использовать if(objElement.id == 'yes'), проверьте значение текущего поля: if(objElement.value == 'yes')
  4. Наконец, вы можете получить текст из соответствующей текстовой области: objTextArea = document.getElementByName( objElement.name + "_text" );

Итак, вы просто делаете каждую из существующих функций обобщенной и ищете метаданные каждого поля, а не пытаетесь кодировать каждое поле.

...