在 Laravel 5 中使用下拉菜单进行高级搜索

Question

我在下拉菜单中有一个下拉菜单，有四个选项，我正在尝试根据所选选项过滤数据库中的数据，我已签入控制台数据即将到来，但在我的视图中页面数据未刷新，我已附加图片请检查一下，我很挣扎请帮忙。

这是我的 HTML 代码视图 right_side_bar latest image
check this image for html view reference

   <select id="property_id" name="property_type" onchange="property_type(this.value)">
        <option>Property Type</option>
        <option value="Single Family Home">Single Family Home</option>
        <option value="Multi_Family_Home">Multi Family Home</option>
        <option value="Condominium">Condominium</option>
        <option value="Townhome">Townhome</option>
   </select>

这是我的右侧代码

          @if (session('status'))
                <div class="alert alert-danger">
               {{ session('status') }}
                </div>
            @endif  
      @foreach($row as $val)
    <div class="property-box">
        <div class="property-box-inner">

            <div class="property-box-picture">
                <div class="property-box-price">
                <a href="#">{{$val->state}}</a></div>
                <div>
                    <a href="#" class="property-box-picture-target">
                    <img src="../images/test/{{$val->image}}" />
                    </a>
                </div>
            </div>

           <div class="property-box-meta" id='basic-modal'>
                <div class="property-box-meta-item col-xs-3 col-sm-3">
                    <strong>{{$val->property_room}}</strong>
                    <span>Bedroom</span>
            </div>

      <div class="property-box-meta-item col-xs-3 col-sm-3">
                <strong>{{$val->property_baths}}</strong>
                <span>Bath</span>
            </div>

         <div class="property-box-meta-item col-xs-3 col-sm-3">
                <strong>{{$val->property_size}}</strong>
                <span>Area</span>
            </div>
          <div class="property-box-meta-item col-xs-3 col-sm-3">
                <strong>{{$val->property_baths}}</strong>
                <span>Garages</span>
            </div>
             <a href="{{ URL::to('pages/property_details', array('id'=>$val->id)) }}" class='basic'>More Details</a>

            </div>
       </div>
    </div>
    @endforeach
</div>

这是我的控制器代码，用于从数据库中获取数据

 public function property_type()
         {
          $term=Input::get('ptyname');
          $data = array();
          $display = DB::table('property_details')
                    ->where('property_type', 'LIKE', '%'.$term.'%')
                    ->Where('sale_or_rent', '=', 'sale')
                    ->get();
          var_dump($display);  
        if(count($display)!=0)
            {    
  return View::make('/pages/property_home', array('row'=>$display));
            }
            else
            {
            session::flash('status', 'No Records Found!!!');
    return View::make('/pages/property_home', array('row'=>$display));
            }
   }

This is My Ajax 加载控制器

        <script>
       (function($) {
           $('#property_id').on('change', function() {
                var optionSelected = $(this).find("option:selected");
                 var prop_type = optionSelected.val();
            $.ajax({
                   type: "GET",
                   url: "{{URL::to('/property_type') }}",
                   dataType: "json",
                   data: {ptyname: prop_type},
                   success:function(row)
                {

                     $('#getRequestdata').html(row.html);

                }
             }); 
         });

    })(jQuery);
</script>

这是我的路线

  Route::get('/property_type', array('as' => 'property_type', 'uses' => 'PageController@property_type'));

像这样我在控制台中获取我的数据 数组（2）{ [0]=> 对象（stdClass）#293 (24) { ["id"]=>int(3) ["sale_or_rent"]=>string(4) "sale" ["property_type"]=>string(11) "公寓" ["property_room"]=>字符串(1) "2" ["property_baths"]=> 字符串(1) "2" ["property_size"]=>string(8) "200 平方英尺" ["property_garage"]=>字符串(1) "2" ["property_year"]=>string(4) "1959" ["property_floor"]=>字符串(1) "4" ["sale_by"]=>string(5) "所有者" ["property_price"]=>string(7) "$200000" ["电话号码"]=>字符串(10) "9941661138" ["address"]=>string(47) "610 Airport Rd, Nenana, AK 99760, United States" ["lat"]=>字符串(10) "64.5486956" [“日志”]=>字符串（12）“-149.0927984” ["state"]=>string(6) "阿拉斯加" ["city"]=>string(6) "男子气概" ["邮编"]=>字符串(6) "600097" ["description"]=>string(34) "这是我的财产 ....联系我" [“图像”]=>字符串（25）“2016-01-22-06-34-16-8.jpg” ["amenties"]=>string(63) "空调,出口后清洁,洗碗机,烧烤,上网," ["user_id"]=>字符串(0) "" [“created_at”]=>字符串（19）“2016-01-22 07:53:05” ["updated_at"]=>字符串(19) "2016-01-22 07:53:05" } }

Answer 1

您必须为您的视图分配响应，您应该创建一些 div 来附加/替换您的响应

例如：在您的视图中，在您的选择下拉列表下方创建 div，例如 <div id="search-response"> </div>

<script>
   (function($) {
       $('#property_id').on('change', function() {
            var optionSelected = $(this).find("option:selected");
             var prop_type = optionSelected.val();
        $.ajax({
               type: "GET",
               url: "{{URL::to('pages/property_type') }}",
               dataType: "json",
               data: {ptyname: prop_type},
               success:function(row)
            {
                alert(val);
                //update your code by this
                // this will assign response to div
                //<div id="search-response"> </div>
                $("#search-response").html().html(row);
            }
         }); 
     });
})(jQuery);