Блог

Главная - Вопросы по программированию - ajax-функция передачи нескольких параметров

ajax-функция передачи нескольких параметров

#javascript #php #jquery #ajax

#javascript #php #jquery #ajax

Вопрос:

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

 $(document).ready(function(){
  
	
	    $('#CourseList,#GroupList,#SeriesList').on('change',function(){
        
		 var Code_Course  = $(this).val();
		 var Code_Group = $(this).val();
		 var Code_Series  = $(this).val();
		
        if(Code_Course,Code_Group ,Code_Series{
            $.ajax({
                type:'POST',
               url:"page2.php",

             data: {Code_Course: Code_Course,Code_Group: Code_Group,Code_Series:Code_Series},
                success:function(html){
                    $('#table').html(html);
                }
            }); 
        }
    });
    });

Комментарии:

1. Когда вы используете $ (this).val() для получения значения, это приведет к получению для одного элемента не того значения, которое вы хотите, вместо $ (this).val() используйте var Code_Course = $(«#CourseList»).val() для получения значения и того же для других переменных, потому что $ (this).val() ссылается только на одно значение.

Ответ №1:

Посмотрите, как это решение, показанное здесь, работает хорошо.

 <!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width">
  <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
  <title>JS Bin</title>
</head>
<body>

CourseList
  <select id="CourseList">
    <option value="1">1</option>
    <option value="2">2</option>
  </select>
GroupList
  <select id="GroupList">
    <option value="1">1</option>
    <option value="2">2</option>
  </select>
  SeriesList
  <select id="SeriesList">
    <option value="1">1</option>
    <option value="2">2</option>
  </select>
<script>

    $(document).ready(function(){
      
    	
    	    $('#CourseList,#GroupList,#SeriesList').on('change',function(){
            var f = document.createElement("form");
              var i = document.createElement("input"); //input element, text
				i.setAttribute('name','Code_Course');
				i.setAttribute('value',$('#CourseList').val());
				f.appendChild(i);
              var i = document.createElement("input"); //input element, text
				i.setAttribute('name','Code_Group');
				i.setAttribute('value',$('#GroupList').val());
				f.appendChild(i);
              var i = document.createElement("input"); //input element, text
				i.setAttribute('name','Code_Series');
				i.setAttribute('value',$('#SeriesList').val());
				f.appendChild(i);
    		
            
                $.ajax({
                    type:'POST',
                   url:"page2.php",
                  processData: false,
					   contentType: false,
                 data: new FormData(f),
                    success:function(html){
                        $('#table').html(html);
                    }
                }); 
        });
        });

  </script>


</body>
</html>