Question

我在youtube中使用了此代码，在某种程度上，它无需laravel就可以工作，但是当我在laravel中使用它时，出现了一些问题。我正在尝试使用模式来编辑/更新表（html）中的数据，但问题是我在数据库（mysql）中获得的数据未出现在模式中，唯一出现的数据是项目中的ID表。另外，当我在控制台上打印数据时，它会为我提供正确的数据。香港专业教育学院花了很多时间寻找问题和解决方案，但我仍然无法继续前进，所以我尝试在这里发布。希望可以有人帮帮我。这将是极大的帮助。谢谢！

刀片文件/ HTML

<div class="modal fade" id="customerEditModal" tabindex="-1" role="dialog" aria-labelledby="" >
    <div class="modal-dialog" role="document">
        <div class="modal-content">
        <div class="modal-header" style="color: green;">
            <h5 class="modal-title" id=""><i class="fas fa-edit"></i> Edit Customer Info/Account</h5>
            <button type="button" class="close" data-dismiss="modal" aria-label="Close">
            <span aria-hidden="true" style="color: green !important;">&times;</span>
            </button>
        </div>
        <form role="form" method="POST">
        {{ csrf_field() }}
            <div class="modal-body">

                <input class="form-control" type="" name="customer_id" id="customer_id">

                <div class="form-group">
                    <label>Firstname</label>
                    <input name="firstname" id="firstname" value="" class="form-control">
                </div>
                <div class="form-group has-success">
                    <label>Lastname</label>
                    <input name="lastname" id="lastname" type="text" class="form-control" placeholder="">
                </div>
                <div class="form-group has-success">
                    <label>Address</label>
                    <input name="address" id="address" type="text" class="form-control" placeholder="">
                </div>
                <div class="form-group has-success">
                    <label>Phone Number</label>
                    <input name="phone_number" id="phone_number" type="number" class="form-control" placeholder="">
                </div>
                <div class="form-group has-success">
                    <label>Type</label>
                    <select class="form-control" name="type" id="type">
                        <option value="HO">Home Owner</option>
                        <option value="BO">Business Owner</option>
                        <option value="MRF">Material Recovery Facilitaty</option>
                    </select>
                </div>
                <div class="form-group">
                    <label for="exampleInputEmail1">Email</label>
                    <input name="email" id="email" type="text" class="form-control" placeholder="">
                </div>
                <div class="form-group">
                    <label>Password</label>
                    <input name="password" id="password" type="text" class="form-control"  placeholder="">
                </div>
                <div class="modal-footer">
                <button type="button" class="btn btn-sm btn-secondary" data-dismiss="modal">Close</button>
                <button type="submit" class="btn btn-sm btn-success">Add Customer</button>
            </div>

            </div>
        </form>

        </div>
    </div>
</div>

AJAX的脚本

$('.editbtn').click(function(){
        var customer_id = $(this).attr("id");
        console.log(customer_id);

    $.ajax({
        url:"{{ route('customerEdit') }}",
        method:"get",
        data:{customer_id:customer_id},
        dataType:"json",
        success:function(data){
                $('#customerEditModal').find('#customer_id').val(customer_id);
                // $('#customerEditModal').find('#firstname').val(data.firstname);
                $('#customerEditModal').find('#firstname').val(data.firstname);
                $('#lastname').val(data.lastname);
                $('#address').val(data.address);
                $('#phone_number').val(data.phone_number);
                $('#email').val(data.email);
                $('#password').val(data.password);
                $('#customerEditModal').appendTo('body').modal('show');
                console.log(data);
                console.log(data.firstname);

        },error:function(xhr,status,error){
            var err = eval('('+xhr.responseText+')');
            alert(err.message);
        }
    });
});

控制器（只是功能）

public function customerShowByIdToEdit(Request $request){
        $id = $request->input('customer_id');
        $customer = DB::table('customer')
        ->join('users', 'users.id', 'customer.users_id')
        ->select('customer.id',
                 'customer.firstname as firstname',
                 'customer.lastname as lastname',
                 'customer.address',
                 'customer.phone_number',
                 'customer.type',
                 'users.email',
                 'users.password')
        ->where('customer.id','=', $id)
        ->get();

        return json_encode($customer);
    }

The ROUTE（..on web.php）

Route::get('/dashboard/customerEdit', 'CustomerController@customerShowByIdToEdit')->name('customerEdit');

console.log（data）的结果： enter image description here

Answer 1

在检索特定的单行时，将查询->get();的最后一部分更改为->first();。然后尝试：

$('#customerEditModal').find('#customer_id').val(data.customer_id);
$('#customerEditModal').find('#firstname').val(data.firstname);
$('#customerEditModal').find('#lastname').val(data.lastname);
$('#customerEditModal').find('#address').val(data.address);
$('#customerEditModal').find('#phone_number').val(data.phone_number);
$('#customerEditModal').find('#email').val(data.email);
$('#customerEditModal').find('#password').val(''); //Either remove this line or ask the user to confirm the password for the update
$('#customerEditModal').modal();

Answer 2

我真的不知道发生了什么，但是您可以尝试一下。

将输入ID从名字更改为名字xxx 然后在AJAX返回上，您可以使用$('#firstnamexxx').val(data.firstname);。

由于体验中的id在加载的一页上必须是唯一的，因此即使在不同的元素（模式，形式等）中也不能相同。

如何解决我的问题，我使用ajax从数据库中获取的数据不会出现在引导模式中

2 个答案: