使用ajax中的数据在Laravel中创建输入

时间:2014-05-22 21:22:05

标签: javascript jquery ajax laravel-4

。您好yall,我正在尝试使用ajax运行搜索,然后让它返回搜索结果页面的链接,每个结果旁边都有一个复选框,以便用户可以选择要打印的订单。

我想出了链接部分,但我不确定如何使用每个搜索结果来制作一个复选框。

我尝试使用JS中ajax的“success:”部分,但不能每次都打破它。

理想情况下,当ajax全部完成后,它会有一个link_to("/{$search_table}/{$result->id}/", $result->street_address)链接,然后是一个带有id =“$ search_table +'_'+ $ result”的复选框(例如,id为“order_123TestStreet” “)。

任何指针或助手都将不胜感激!非常感谢!

JS:

$(document).ready(function(){
    $("#search_form").submit(function(e) {
        e.preventDefault();
    //form_data
    var form_data = $('#search_form').serializeArray();

    $.ajax({
        url: 'search',
        type: "POST",
        dataType: "html",
        data: form_data,
        success: function(data){


            $("#search_results").html(data);
            $("#search_results").addClass('panel callout radius');
        },
        error: function(xhr, status, error){
            console.log(xhr);
            console.log(status);
            console.log(error);
        }
    });
});
});

控制器:

 public function search(){
        $validator = Validator::make(
            array(
                'search_table' => Input::get('search_table'),
                'search_column' => Input::get('search_column'),
                'search_input' => Input::get('search_input'),
                ),
            array(
                'search_table' => 'required',
                'search_column' => 'required',


        'search_input' => 'required',
            )
        );

    if($validator->fails()){
        exit;
    }   else   {
        /*Run Search Query*/

        $search_table       = Input::get('search_table');
        $search_column      = Input::get('search_column');
        $search_input       = Input::get('search_input');
        $search_results     = DB::table($search_table)->where($search_column, 'LIKE', "%{$search_input}%")->get();

        foreach($search_results as $result){
            $result_street_address = $result->street_address;
            echo link_to("/{$search_table}/{$result->id}/", $result->street_address) . "<br>" . "<br>";
        }
    }   
}

1 个答案:

答案 0 :(得分:1)

我认为你的问题是使用HTML而不是JSON,你也应该考虑使用模板而不是在PHP代码中实现HTML代码。这将是一个很长的答案,请耐心等待。

首先,您应该将JS代码切换为正确的AJAX调用。

<!-- index.blade.php -->

<form id="search_form">
    {{Form::text('search_table', Input::old('search'))}}<br />
    {{Form::text('search_column', Input::old('search'))}}<br />
    {{Form::text('search_input', Input::old('search'))}}<br />

    <button id="search_button" type="button" class="btn btn-default">
        Search
    </button>
</form>

<div id="search_results" style="display: none;">&nbsp;</div>

<script type="text/javascript" src="/bower_components/requirejs/require.js"></script>
<script type="text/javascript" src="/js/global.js"></script>
<script type="text/javascript">
//  My testing system uses require, just use jQuery as you used to.
require(["jquery"], function($) {
    $("#search_button").click(function() {
        $.ajax({
            url: '/test',
            type: "post",
            dataType: "json",
            data: $('#search_form').serializeArray(),
            success: function(json) {
                // Just use json.data so we can add more details if we want to.
                if (json.data) {
                    /**
                     * Actually you don't have to addClass to your div, you can
                     * just show or hide it when you don't need it.
                     */
//                      $("#search_results").html(json.data).addClass('panel callout radius');
                    $("#search_results").html(json.data).show();
                }

                // Let's give feedback to user that they have gone off route ;)
                if (json.error) {
                    alert(json.error);
                }
            }
        }).always(function(xhr, status, error) {
            console.log(xhr);
            console.log(status);
            console.log(error);
        });
    });
});
</script>

我为你创建了一个控制器,你可以根据自己的需要改变它。

<?php
// TestController.php
use Illuminate\Database\Eloquent\Collection;

class TestController extends Controller {

    public function getIndex() {
        $layout = View::make("test.index");

        return $layout->render();
    }

    public function postIndex() {
        /*
         * Sorry for shortening the code, you can just fix it as you go.
         */
        $f = Input::all();
        $rules = [
            'search_table' => 'required',
            'search_column' => 'required',
            'search_input' => 'required',
        ];

        $validator = Validator::make($f, $rules);
        if ($validator->fails()) {
            return \Response::json(['error' => 'You have to fill all the fields.']);
        } else {
            /*
             * We have a global array called $f now.
             */
            $term = str_replace(" ", "%", $f["search_input"]);
//          $search_results = DB::table($f["search_table"])->where($f["search_column"], 'LIKE', "%" . $term . "%")->get();

            /*
             * I created a result just for testing.
             */
            $search_results = new Collection();

            $results = [
                ['id' => 1, 'street_address' => 'Baker Street'],
                ['id' => 2, 'street_address' => 'Abbey Road'],
            ];
            foreach ($results as $result) {
                $newRow = new Collection();
                $newRow->id = $result["id"];
                $newRow->street_address = $result["street_address"];

                $search_results->add($newRow);
            }

            /*
             * Now comes the tricky part.
             */
            $layout = View::make("test.results");
            $layout->results = $search_results;

            return \Response::json(['data' => $layout->render()]);
        }
    }

}

现在我们可以为搜索结果创建一个布局。您可以在此文件中创建表单,添加复选框,表单字段等,使用一些cookie和一些会话使用您可以使页面记住您搜索的内容并执行更多技巧。

<!-- results.blade.php -->
@foreach ($results as $result)
<a href="/some/url/{{$result->id}}">
    {{$result->street_address}}
</a>
<br />
@endforeach
你应该在routes.php文件中添加

;

Route::controller("test", "TestController");

我猜这些应该可以帮到你。

祝你好运!