2016-10-01 54 views
2

我已经从第一个组合框中设置第一个值现在我需要从第二个组合框发送第二个变量,并在同一个php文件中接收它是阿贾克斯:如何发送数据与依赖下拉列表中的AJAX

$(document).ready(function(){ 
    $(".rutas").change(function(){ 
    var id=$(this).val(); 
    var dataString = 'id='+ id; 
    $.ajax({ 
     type: "POST", 
     url: "asientos.php", 
     data: dataString, 
     cache: false, 
     success: function(html){ 
      $(".asientos").html(html);} 
     }); 
    }); 
}); 
</script> 

这是第一个HTML组合框,这是完全正常:

<select name="rutas" class="rutas" > 
    <option value="">Seleccione Ruta</option>; 
    <?php include 'rutas.php'; ?> 
</select> 

这里是第二HTML组合框,我想从价值并将其发送到与第一个相同的php文件:

Clase: <select name="clase" class="clase"> 
    <option value="A">Clase Ejecutiva</option>; 
    <option value="B">Clase Media</option>; 
    <option value="C">Clase Economico</option>; 
</select> 

任何帮助将不胜感激,谢谢!

回答

1

发送多个值AJAX使用object

var data = {field1: "value1", field2: "value2"}; 

在你的情况,你应该使用form

<form id="myForm"> 
<select id="select1"></select> 
<select id="select2"></select> 
</form> 

JavaScript代码。

$(document).ready(function(){ 
    $('#myForm').submit(function(event){ 
    event.preventDefault(); 
    var data = {field1: $("#select1").val(), field2: $("#select2").val()}; 

    //Ajax code should be here 
    $.ajax({ 
     type: "POST", 
     url: "asientos.php", 
     data: data, 
     cache: false, 
     success: function(html){ 
      $(".asientos").html(html);} 
     }); 
    }); 
    }); 
}); 

编辑:按照意见

function ajaxCall(url, data){ 

    //Ajax code should be here 
    $.ajax({ 
     type: "POST", 
     url: url, 
     data: data, 
     cache: false, 
     success: function(html){ 
      $(".asientos").html(html);} 
     }); 
    }); 
} 

在每个选择变化的方法,你可以调用这个函数AJAX和填充你的下拉。

$(".rutas").change(function(){ 
    ajaxCall('demo.php', '10'); 
}); 
+0

那么我需要在代码中更改什么? –

+0

我已经更新了我的答案,并向您展示了如何使用表单提交多个数据。 –

+0

您是否检查并理解我写的内容? –