дополнительный вариант при выборе пунка

Discussion in 'PHP' started by ufaclub, 2 Aug 2010.

  1. ufaclub

    ufaclub New Member

    Joined:
    13 Jul 2010
    Messages:
    204
    Likes Received:
    0
    Reputations:
    0
    PHP:

    <select  name="d8">

    <
    option selected="selected" value="Нет детей"Нет детей</option>
    <
    option value="1"</option>
    <
    option value="2"</option>
    <
    option value="3"</option>
    <
    option value="4"</option>

    </
    select>

    как сделать чтоб появились поле ввода данных, если будет выбран пунк 2 ребенка?

    то есть на каждого ребенка должно появиться поле для ввода данных.

    как это сделать на JS :confused:
     
  2. Mixon

    Mixon Elder - Старейшина

    Joined:
    12 Mar 2008
    Messages:
    394
    Likes Received:
    119
    Reputations:
    12
    HTML:
    <script>
    function show(bool){
    if(bool){
    document.getElementById('MyText').style.display='block';
    }else{
    document.getElementById('MyText').style.display='none';
    }
    }
    </script>
    <select  name="d8"> 
    
    <option selected="selected" value="Нет детей" onClick='show(false)'> Нет детей</option> 
    <option onClick='show(true)' value="1"> 1 </option> 
    <option onClick='show(true)' value="2"> 2 </option> 
    <option onClick='show(true)' value="3"> 3 </option> 
    <option onClick='show(true)' value="4"> 4 </option> 
    
    </select>
    
    <br>
    
    <textarea style="display:none" id='MyText'></textarea>
    чтот на подобии...
    только пробелы в n one и b lock убери)
     
  3. ufaclub

    ufaclub New Member

    Joined:
    13 Jul 2010
    Messages:
    204
    Likes Received:
    0
    Reputations:
    0
    а как сделать чтоб если 1 - то 1 поле появляеться
    если выбрали 2 то два пунка
    если 3 то три пункта ввода данных появлялось б :rolleyes:
     
  4. -=Zhenek=-

    -=Zhenek=- Elder - Старейшина

    Joined:
    31 Dec 2007
    Messages:
    283
    Likes Received:
    75
    Reputations:
    1
    PHP:
    <script>
    function 
    show(kolvo){
    if(
    kolvo == '1'){
    document.getElementById('child1').style.display='b  lock';
    document.getElementById('child2').style.display='n  one';
    document.getElementById('child3').style.display='n  one';
    document.getElementById('child4').style.display='n  one';
    }
    if(
    kolvo == '2'){
    document.getElementById('child1').style.display='b  lock';
    document.getElementById('child2').style.display='b lock';
    document.getElementById('child3').style.display='n  one';
    document.getElementById('child4').style.display='n  one';
    }
    if(
    kolvo == '3'){
    document.getElementById('child1').style.display='b  lock';
    document.getElementById('child2').style.display='b lock';
    document.getElementById('child3').style.display='b lock';
    document.getElementById('child4').style.display='n  one';
    }
    if(
    kolvo == '4'){
    document.getElementById('child1').style.display='b  lock';
    document.getElementById('child2').style.display='b lock';
    document.getElementById('child3').style.display='b lock';
    document.getElementById('child4').style.display='b lock';
    }
    if(
    kolvo == '0'){
    document.getElementById('child1').style.display='n  one';
    document.getElementById('child2').style.display='n  one';
    document.getElementById('child3').style.display='n  one';
    document.getElementById('child4').style.display='n  one';
    }
    }
    </script>

    <select  name="d8"> 

    <option onClick='show(1)' value="1"> 1 </option> 
    <option onClick='show(2)' value="2"> 2 </option> 
    <option onClick='show(3)' value="3"> 3 </option> 
    <option onClick='show(4)' value="4"> 4 </option> 
    </select>

    <br>

    <option selected="selected" value="Нет детей" onClick='show(0)'> Нет детей</option>
    <div id=1 style="display:none"><input type=text name=child1></div>
    <div id=2 style="display:none"><input type=text name=child2></div>
    <div id=3 style="display:none"><input type=text name=child3></div>
    <div id=4 style="display:none"><input type=text name=child4></div>
    Это конечно не лучший вариант, думаю можно сделать динамическое добавление произвольного кол-ва полей, но тут тебе точно известны названия полей
     
  5. Mixon

    Mixon Elder - Старейшина

    Joined:
    12 Mar 2008
    Messages:
    394
    Likes Received:
    119
    Reputations:
    12
    ufaclub, советую для подобного использовать jQuery,на нём,это-бы заняло 2-3 строчки...
     
  6. ufaclub

    ufaclub New Member

    Joined:
    13 Jul 2010
    Messages:
    204
    Likes Received:
    0
    Reputations:
    0

    неработает (((
     
  7. ufaclub

    ufaclub New Member

    Joined:
    13 Jul 2010
    Messages:
    204
    Likes Received:
    0
    Reputations:
    0

    а как такое сделать ну джуквери? :rolleyes:
     
  8. diGriz

    diGriz Elder - Старейшина

    Joined:
    11 Oct 2006
    Messages:
    141
    Likes Received:
    82
    Reputations:
    6
    Вот так:
    Code:
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.3/jquery.min.js"></script>
    <script>
    $(function() {
    	$("select").change(
    		function() {
    			$('#myDiv').empty();
    				for (i = 0; i < this.value; i++ ){
    					$('#myDiv').append('<input type="text" />');
    				}
    		}
    	);
    });
    </script>
     <select  name="d8">
    <option selected="selected" value="Нет детей"> Нет детей</option>
    <option value="1"> 1 </option>
    <option value="2"> 2 </option>
    <option value="3"> 3 </option>
    <option value="4"> 4 </option>
    </select>  
    <div id="myDiv">
    </div>
    
     
  9. ufaclub

    ufaclub New Member

    Joined:
    13 Jul 2010
    Messages:
    204
    Likes Received:
    0
    Reputations:
    0

    а как сделать чтобы у каждого <input type="text" стояло уникальное name="d22" name="d23" name="d24" name="d25"

    и как бы сделать чтоб они через <br> шли
     
  10. diGriz

    diGriz Elder - Старейшина

    Joined:
    11 Oct 2006
    Messages:
    141
    Likes Received:
    82
    Reputations:
    6
    Измени:
    Code:
    $('#myDiv').append('<input type="text" />');
    
    на это
    Code:
    $('#myDiv').append('<input type="text" name="d'+i+'"/><br />');
    
     
  11. ufaclub

    ufaclub New Member

    Joined:
    13 Jul 2010
    Messages:
    204
    Likes Received:
    0
    Reputations:
    0
    у меня выше стоят другие селекты и при выборе их тоже открываются скрытые варианты :mad:

    как сделать чтоб только на данный селект распространялось это условие? :confused:


    а так да... работает классно то что хотел... :rolleyes:
     
  12. diGriz

    diGriz Elder - Старейшина

    Joined:
    11 Oct 2006
    Messages:
    141
    Likes Received:
    82
    Reputations:
    6
    Замени это:
    Code:
    $("select").change
    
    на это:
    Code:
    $('select[name="d8"]').change
    
    Функция будет работать, при изменении селекта с именем d8.
     
  13. ufaclub

    ufaclub New Member

    Joined:
    13 Jul 2010
    Messages:
    204
    Likes Received:
    0
    Reputations:
    0
    спасибо

    вроде получилось )))

    http://putevkav.ru/start
     
Loading...