Question

I am using the ajax call from json. I call the hotel list from the ajax call but now I have to call the price for particular hotel. Kindly support.

Code for Hotel List is as follows:
HTML

<td style="color: #993300"><strong>Add Services<input name="add-service" id="add-service" type="button" value="+" style="background-color: #993300; color: #FFFFFF;" /></strong></td>

JQuery For calling ajax to get hotel list:

$('#cmb_service').bind('change', function(){

        var value = $(this).val();
        var destination = $( "#destination" )
        $.ajax({
                type : 'POST',
                url : '../enquiries/getpricebyajax',
                dataType : 'json',
                data: {
                        service : value,
                        destno : destination.val()
                },
                success : function(data) {
                       $('#waiting').hide(500);
                       $('#divserviceprovider').text('');
                       $('#divserviceprovider').append(data.msg);
                       $('#divserviceprovider').show(500);
                       if (data.error === true)
                            $('#divserviceprovider').show(500);
                },
                error : function(XMLHttpRequest, textStatus, errorThrown) {
                        $('#waiting').hide(500);
                        $('#divserviceprovider').removeClass().addClass('error')
                            .text('There was an error.').show(500);
                        $('#divserviceprovider').show(500);
                }
        });
        return false;
});`

PHP code to response of hotel list is as follows:

function getpricebyajax()

{
            $str="";$substr="";
            if(!empty($_POST['service']))
                {
                    switch ($_POST['service']) {
                        case "3":
                            {
                                $rshotels=$this->Enquiry->query("SELECT id, name FROM hotels where destination_id=".$_POST['destno']);
                                foreach($rshotels as $hotel){
                                        $substr.='<option value="'.$hotel['hotels']['id'].'">'.$hotel['hotels']['name'].'</option>';
                                }
                                $str.= '<select id="cmb_hotel" name="cmb_hotel">'.$substr.'</select>';
                                $str.= '<div id="divhotel_details"></div>';
                            }
                            break;
                        default:
                            break;
                    }
                    $return['error'] = true;
                    $return['msg'] = $str;
                }
            exit(json_encode($return));
    }

`

I direct paste the code of html in div. It is well showing the hotel list. But what will be the code for the select “divhotel_details”. When I click on divhotel_details I have to call ajax again to generate the price for that hotel.

Please suggest me.

Thanks in advance.

Answer 1

you can check it here the correct way to call a json service 🙂 – https://rvieiraweb.wordpress.com/2013/01/21/consuming-webservice-net-json-using-jquery/

Edit:

<script>

function AjaxCall(){
  var hotel_val = $("#ddl_hotel").val();

   //do service ajax call passing the hotel val 

   success: function(response) {
     $("#display_info").empty();
     //this 
     $("#display_info").append(response.Yourfields);
     //or LOOP and show in div
   }, 
   error: function(response) {
       $("#display_info").append("No info for this hotel");
   }
}
</script>

<select id="ddl_hotel" onchange="AjaxCall();">
  <option value="hotel1">Hotel 1</option>
  <option value="hotel2">Hotel 2</option>
  <option value="hotel3">Hotel 3</option>
</select>

<div id="display_info">