Laravel:使用Bootstrap Modal将数据插入数据库

时间:2016-11-29 06:43:59

标签: laravel laravel-5 bootstrap-modal

我想使用Bootstrap Modal将一些数据插入数据库。但问题是Save按钮在Bootstrap Modal上无法正常工作,因为我无法通过表单将数据插入数据库。如果有人能帮我找到它的话!?

以下是刀片中的表单部分:

<div id="myAlert" class="modal hide">
    <div class="modal-header">
        <button data-dismiss="modal" class="close" type="button">×</button>
        <h3>Create User</h3>
    </div>
    <div class="modal-body">
        <div class="row-fluid">
            <div class="span12">
                <div class="widget-box">
                    <div class="widget-content nopadding">
                        <form action="#" method="get" id="userForm" class="form-horizontal">
                            <div class="control-group">
                                <label class="control-label">Name :</label>

                                <div class="controls">
                                    <input class="span11" placeholder="Name" type="text">
                                </div>
                            </div>
                            <div class="control-group">
                                <label class="control-label">Email :</label>

                                <div class="controls">
                                    <input class="span11" placeholder="Email" type="email">
                                </div>
                            </div>
                            <div class="control-group">
                                <label class="control-label">Password</label>

                                <div class="controls">
                                    <input class="span11" placeholder="Enter Password" type="password">
                                </div>
                            </div>
                            <div class="control-group">
                                <label class="control-label">Confirm Password</label>

                                <div class="controls">
                                    <input class="span11" placeholder="Confirm Password" type="password">
                                </div>
                            </div>
                        </form>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <div class="modal-footer"><a data-dismiss="modal" class="btn btn-primary" href="#">Confirm</a> <a
                data-dismiss="modal" class="btn" href="#">Cancel</a>
    </div>
</div> 

这是Ajax部分:

 $('#userForm').on('success.form.fv', function(e) {
        e.preventDefault();

        $.ajax({
            method: 'POST',
            action:"{{ url('/register') }}",
            data: $form.serialize()
        });
    });  

6 个答案:

答案 0 :(得分:0)

您需要提交按钮。尝试将此代码放在表单中。

<button type="submit" class="btn btn-primary">Register</button>

您当前的确认按钮出现问题:1)他没有type=submit; 2)他不在表格之内。

答案 1 :(得分:0)

首先将type="submit"添加到按钮

其次检查浏览器中开发工具中的网络标签,检查请求是否转到/register? 如果请求达到/register参数是什么?

答案 2 :(得分:0)

在刀片中组成部分:

<div class="modal-footer"><a data-dismiss="modal" class="btn btn-primary" id="btnAdd">Confirm</a></div> 

Ajax Part

        $('#btnAdd').click(function () {
            $.ajax({
                url: '{{url('/register')}}',
                type: 'POST',
                data: $('#userForm').serialize(),
                success: function (object) {

                },
                error: function (result) {

                }
            });
        });

答案 3 :(得分:0)

将表单方法get更改为post

我在这里回答ajax电话

Laravel ajax internal servor 500 (internal server-error)

答案 4 :(得分:0)

您的输入类型元素缺少名称属性

a = f2['values'].apply(test_function).values
print (pd.concat(a, ignore_index=True))

然后通过传递name属性的值

,使用Request或Input检索内容

答案 5 :(得分:0)

At first change your form method from get to post. Then add save button with id btnSave. Ajax :

$("#btnSave").click(function(e){
     e.preventDefault()
    var $form = $("#userForm");
    $.ajax({
        type: $form.attr('method'),
        url: $form.attr('action'),
        data: $form.serialize(),
        success: function (data, status) {
             if(data.error){
                return;
            }
            alert(data.success); // THis is success message
            $('#myModal').modal('hide');  // Your modal Id
        },
        error: function (result) {

        }
    });

 });

In controller :

public function store(Request $request)   
{   try {
    $inputs = $request->all();  
    ModelName::create($inputs);
    $data = ['success' =>'Data saved successfully'];        
    } catch (\Exception $e) {
        $data = ['error' =>$e->getMessage()];         
    }        
    return Response::json($data);     
}