Javascript 页面刷新并获得数据'；在laravel5中使用ajax插入数据时不能添加

我有一段代码，我想在Laravel5中使用ajax从数据库添加/插入数据。我是ajax和laravel的初学者，我不知道为什么它会刷新我的页面

以下是我迄今为止所做的： 在我看来，我有这样一个模式：

<div class="modal fade" id="addcategory" tabindex="-1" role="dialog" aria-labelledby="contactLabel" aria-hidden="true">
    <div class="modal-dialog">
    <div class="panel panel-primary">
        <div class="panel-heading">
            <button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
            <h4 class="panel-title" id="contactLabel"><span class="glyphicon glyphicon-info-sign"></span> Add Category</h4>
        </div>
        <form id="frmAddcategory">
        <div class="modal-body" style="padding: 5px;">
                <div class="row">
                   <div class="col-lg-12 col-md-12 col-sm-12 {{ $errors->has('email') ? ' has-error' : '' }}" style="padding-bottom: 10px;">
                        <input class="form-control" name="catname" placeholder="Category name" type="text" required />
                    </div>
                </div>
                <div class="row">
                    <div class="col-lg-12 col-md-12 col-sm-12 {{ $errors->has('email') ? ' has-error' : '' }}">
                        <textarea style="resize:vertical;" class="form-control" placeholder="Description" rows="4" name="catdesc" required></textarea>
                    </div>
                </div>                
            </div>  
            <div class="panel-footer" style="margin-bottom:-14px;">                
                <button class="btn btn-success btn-sm" onclick="addCategoryAjax()">Submit</button>
                    <!--<span class="glyphicon glyphicon-ok"></span>-->
                <input type="reset" class="btn btn-danger btn-sm" value="Clear" />
                    <!--<span class="glyphicon glyphicon-remove"></span>-->
                <button style="float: right;" type="button" class="btn btn-default btn-close btn-sm" data-dismiss="modal">Close</button>
            </div>
            {{ csrf_field() }}
        </form>
        </div>
    </div>
</div>

这是我的控制器：

 public function addCategory(Request $request) 
    {
        $stat = "published";

        DB::table('categories')->insert([
        'name'=>$request->catname, 
        'description'=>$request->catdesc, 
        'status'=>$stat,
        'created_at' =>  \Carbon\Carbon::now(), # \Datetime()
        'updated_at' => \Carbon\Carbon::now()  # \Datetime()
        ]);

    }

---

应防止按钮的默认操作，如：

e.preventDefault();

您可以将

event

传递到函数inline中，该函数将是W3C兼容浏览器中引发事件的事件对象

因此，您的代码应该是：

HTML：

<button class="btn btn-success btn-sm" onclick="addCategoryAjax(event)">Submit</button>

function addCategoryAjax(e) {
    e.preventDefault();

    $.ajax({         
        url: "{{ route('admin.addcat') }}",        
        type: "POST",
        data: $("#frmAddcategory").serialize(),
        dataType: "JSON",
        success: function(data) {

        }
    }); 
}

---

应防止按钮的默认操作，如：

e.preventDefault();

您可以将

event

传递到函数inline中，该函数将是W3C兼容浏览器中引发事件的事件对象

因此，您的代码应该是：

HTML：

<button class="btn btn-success btn-sm" onclick="addCategoryAjax(event)">Submit</button>

function addCategoryAjax(e) {
    e.preventDefault();

    $.ajax({         
        url: "{{ route('admin.addcat') }}",        
        type: "POST",
        data: $("#frmAddcategory").serialize(),
        dataType: "JSON",
        success: function(data) {

        }
    }); 
}

函数submitFormItemGroup（）{
var form_data=new FormData（document.getElementById（“itemGroup”）；
表格_数据。附加（“标签”、“网络上传”）；
$.ajax({
url:“{url:：to（'addItemGroupAjax'）}}”，
类型：“POST”，
数据：表格数据，
processData:false，//告诉jQuery不要处理数据
contentType:false//告诉jQuery不要设置contentType
}).完成（功能（数据）{
控制台日志（数据）；
})
路由：：post（'/addItemGroupAjax'，'ItemGroupsController@storeAjax');

函数submitFormItemGroup（）{
var form_data=new FormData（document.getElementById（“itemGroup”）；
表格_数据。附加（“标签”、“网络上传”）；
$.ajax({
url:“{url:：to（'addItemGroupAjax'）}}”，
类型：“POST”，
数据：表格数据，
processData:false，//告诉jQuery不要处理数据
contentType:false//告诉jQuery不要设置contentType
}).完成（功能（数据）{
控制台日志（数据）；
})
路由：：post（'/addItemGroupAjax'，'ItemGroupsController@storeAjax');

您好，先生，它工作了，您能帮我解决其他问题吗？您指的是什么“其他问题”吗？这超出了这个问题的范围，我可以再问您一次吗？您指的是插入数据库？它是否转到操作方法公共函数addCategory（Request$Request）？没有，它已经插入了。我的表单验证中有另一个问题。您好，先生，它工作了，您能帮我解决其他问题吗？您的意思是什么“其他问题”吗？这超出了这个问题的范围，我可以再问您一次吗？您的意思是插入到数据库中吗？它是否转到操作方法公共函数addCategory（Request$Request）？没有，它已经插入。我的表单验证中还有一个问题