将选定的表单值解析为jQuery.ajax调用

时间:2015-02-19 22:07:10

标签: javascript php jquery ajax

我有这个下拉表单 - 进行排序调用。

我无法做的是从ajax中的表单解析当前选定的值。 URL。

表格:

<form name="sortby">
    <select name="order_by" onchange="myFunction()">
        <option<?php if(isset($_GET['order_by']) && $_GET['order_by'] == 'choose') echo ' selected="selected"'; ?> value="choose">Sort By</option>
        <option<?php if(isset($_GET['order_by']) && $_GET['order_by'] == 'OVERALL_VALUE') echo ' selected="selected"'; ?> value="OVERALL_VALUE">Most Popular</option>
        <option<?php if(isset($_GET['order_by']) && $_GET['order_by'] == 'PRICE') echo ' selected="selected"'; ?> value="PRICE">Price (low to high)</option>
        <option<?php if(isset($_GET['order_by']) && $_GET['order_by'] == 'PRICE_REVERSE') echo ' selected="selected"'; ?> value="PRICE_REVERSE">Price (high to low)</option>
        <option<?php if(isset($_GET['order_by']) && $_GET['order_by'] == 'QUALITY') echo ' selected="selected"'; ?> value="QUALITY">Rating</option>
    </select>
</form>

ajax。

    <script>
    function myFunction() { 
    $('.searchtable').addClass('hide');
    $('.spinner').removeClass('hide');

    $.ajax({
        type: 'GET',
        data: {'name':'<?php echo $name;?>','arrival':'<?php echo $arrival;?>','departure':'<?php echo $departure;?>','guests':'<?php echo $numberOfGuests;?>','order_by':$('#order_by').value},
        url: 'hotels/hotelSortBy.php',


        success: function (data) {
            //alert('data loaded succesfully');
            alert(this.url);

            $('.searchtable').replaceWith(data);

        },
        error: function (xhr) {
                                   alert('data not loaded');

            // do what ever you want to do when error happens
        }
 })

 .done(function() {
 $('.spinner').addClass('hide');
 $('.searchtable').removeClass('hide');
 });

 }
 </script> 

hotelSortBy.php

<?php 
$url  = 'xxx';
$url .= '&cid=55505';
$url .= 'xxxx';
//$url .= '&customerUserAgent='[xxx]
//$url .= '&customerIpAddress='[xxx]
$url .= '&locale=da_DK';
$url .= '&currencyCode=DKK';
$url .= '&destinationString=' .  strval($_GET['name']);
$url .= '&supplierCacheTolerance=MED_ENHANCED';
$url .= '&searchRadius=50';
$url .= '&arrivalDate=' . strval($_GET['arrival']);
$url .= '&departureDate=' . strval($_GET['departure']);
$url .= '&room' . strval($_GET['rooms']) . '=' . strval($_GET['numberOfGuests']) . ',,';
$url .= '&sort='. strval($_GET['order_by']);
$url .= '&numberOfResults=20';
$header[] = "Accept: application/json";
$header[] = "Accept-Encoding: gzip";
$ch = curl_init();
curl_setopt( $ch, CURLOPT_HTTPHEADER, $header );
 curl_setopt($ch,CURLOPT_ENCODING , "gzip");
 curl_setopt($ch, CURLOPT_CUSTOMREQUEST, 'GET');
 curl_setopt( $ch, CURLOPT_URL, $url );
 curl_setopt( $ch, CURLOPT_RETURNTRANSFER, true );
 $response = json_decode(curl_exec($ch), true);
 include '/hotelTables.php';

 ?>

表单中的Order_by值未粘贴到要应用于网址的ajax数据中。

2 个答案:

答案 0 :(得分:0)

首先,您需要id而不仅仅是name属性:

<select id="order_by" name="order_by" onchange="myFunction()">

         ^^^^ id

然后将order_by的值放在data部分,而不是网址。混合数据部分并在网址中明确地放置查询参数是一个坏主意,因为有些参数在某些浏览器中可能会丢失。选择一个或另一个:

$.ajax({
    type: 'GET',
    data:
    {
       'order_by':$('#order_by').val(),
       'name': '<?php echo $name;?>',
       'arrival': '<?php echo $arrival;?>',
       'departure': '<?php echo $departure;?>',
       'guests': '<?php echo $numberOfGuests;?>'
    },
    url: 'hotels/hotelSortBy.php',
    .....

我质疑在那里打印所有PHP的智慧。我认为可能那些应该是表单中的字段,即使是隐藏字段(即<input type='hidden' />)。

答案 1 :(得分:0)

$.ajax({
    type: 'GET',
    data: {'name':'<?php echo $name;?>','arrival':'<?php echo $arrival;?>','departure':'<?php echo $departure;?>','guests':'<?php echo $numberOfGuests;?>'},
    url: 'hotels/hotelSortBy.php?&order_by='+$('form').find('select').val(),