Javascript заменить «другое» значение с вводом из текстового поля - PullRequest
Новая
       13

Javascript заменить «другое» значение с вводом из текстового поля

0 голосов
/ 05 августа 2011

У меня есть следующая форма, над которой я работаю ...

Когда пользователь выбирает опцию из группы радиостанций, отображается div с списком множественного выбора.Если один из этих вариантов «другой», текстовое поле не отображается, позволяя пользователю ввести информацию.

Как получить форму для возврата выборов из списка множественного выбора при замене значения "other" значением поля ввода текста ??

Я потратил бесчисленные часы поискаGoogle и этот сайт, и хотя я нашел несколько похожих решений, ни один из них не предназначен для нескольких вариантов, и ни один не соответствует моим потребностям.

Это то, что у меня есть для формы: 

<form method="post" action="send_email.asp"  onsubmit="return Form_Validator (this)" 
  name="form2" id="form2" >
<tr>
<td>Product Type: <br />
<input name="ProductType" type="radio" value="Network" tabindex="1"
 onclick="setVisibility('NetworkProducts','inline'); setVisibility
('CPEProducts','none');"/>
        Network<br />
<input name="ProductType" type="radio" value="Network and CPE" tabindex="2"
 onclick="setVisibility('NetworkProducts','inline'); setVisibility
('CPEProducts','inline');"/>
        Network and CPE<br />
<input name="ProductType" type="radio" value="CPE Only" tabindex="3" 
onclick="setVisibility('NetworkProducts','none'); setVisibility
('CPEProducts','inline');"/>
        CPE Only<br/>

<div id="NetworkProducts" align="left">
        Network Product Sold <span class="style2">*</span> 
        <select name="NetProductSold" size="3" multiple="MULTIPLE"
 id="NetProductSold" onchange="showothernet(this.form);">
            <option value="Prod1">Prod1</option>
            <option value="Prod2">Prod2</option>
            <option value="Prod3">Prod3</option>
            <option value="Prod4">Prod4</option>
            <option value="Prod5">Prod5</option>
            <option value="Prod6">Prod6</option>
            <option value="Prod7">Prod7</option>
            <option value="Prod8">Prod8</option>
            <option value="Prod9">Prod9</option>
            <option value="Prod10">Prod10</option>
            <option value="Other">Other</option>            
            </select> 


      </div>

      <blockquote>
      <div id="OtherNetworkProducts" align="left" >
        If other, Please specify: <input name="OtherNetProductSold"
 type="text" id="OtherNetProductSold" size="50" onblur="setFocus(this);" >
          </div>
          </blockquote>

      <div id="CPEProducts" align="left">
      CPE Product Sold <span class="style2">*</span> 
      <select name="CPEProductSold" size="3" multiple="multiple"
 id="CPEProductSold" onchange="showothernet(this.form);" >
        <option value="CPE1">CPE1</option>
        <option value="CPE2">CPE2</option>
        <option value="CPE3">CPE3</option>
        <option value="CPE4">CPE4</option>
        <option value="CPE5">CPE5</option>
        <option value="CPE6">CPE6</option>
        <option value="CPE7">CPE7</option>
        <option value="Other">Other</option>
      </select>


      </div>    
      <blockquote>
      <div id="OtherCPEProducts">
    If other, Please specify: <input name="OtherCPEProductSold" type="text"
id="OtherCPEProductSold" size="50" >

          </div>
      </blockquote> 
</form>

И это то, что у меня есть для javascript: 

<script Language="JavaScript"><!--


function setVisibility(id, visibility) {
document.getElementById(id).style.display = visibility;
}
function showothernet (form) 
{
for (var j = 0; j < form.NetProductSold.length; j++) 
{
    if (form.NetProductSold.options[j].selected) 
    {
        if(form.NetProductSold.options[j].value == "Other") 
            {
            setVisibility('OtherNetworkProducts','inline');

            }
        else 
            {
            setVisibility('OtherNetworkProducts','none');
            }
    }

}

for (var i = 0; i < form.CPEProductSold.length; i++) 
{
    if (form.CPEProductSold.options[i].selected) 
    {
        if(form.CPEProductSold.options[i].value == "Other") 
        {
            setVisibility('OtherCPEProducts','inline');
        }
        else 
        {
            setVisibility('OtherCPEProducts','none');
        }
    }
}
}


function setFocus(form)
{
var process = form.OtherNetProductSold.value;
form.NetProductSold.options[10].value = process
alert (form.NetProductSold.options[10].value);
}
//--></script>

Форма работает так, какЯ хочу, чтобы, когда пользователь нажимает «Сеть» или «Сеть и CPE» и появляется список для сетевых продуктов, тогда, если «другой» вариант является одним из выбранных параметров, отображается текстовое поле для других.

Проблема заключается в том, как заменить это «другое» значение из множественного выбора входными данными из текстового поля.

ПОЖАЛУЙСТА, ПОМОГИТЕ!

Заранее спасибо!

1 Ответ

0 голосов
/ 05 августа 2011

Текст, отображаемый для пользователя, находится между <option> и </option>.Итак, вместо этого установите .innerHTML (текст изменяется): 

form.NetProductSold.options[10].innerHTML = process;

Во-вторых, у вас есть: 

<input name="OtherNetProductSold"
type="text" id="OtherNetProductSold" size="50" onblur="setFocus(this);" >

, в то время как ваш setFocus принимает форму.Итак, setFocus(this.form) вы должны использовать.

http://jsfiddle.net/pimvdb/nMkvb/

...