在 laravel 中使用 ajax 进行实时更新答案

【问题标题】：using ajax for real time update in laravel在 laravel 中使用 ajax 进行实时更新
【发布时间】：2018-12-29 18:46:54
【问题描述】：

我正在尝试通过 ajax 创建像 facebook 一样的创建和编辑。 ajax scripts 已经为我准备好了，html 如下所示......但我不知道如何为此制作函数。

HTML & .JS代码：

$(document).ready(function(){
	$(".editlink").on("click", function(e){
	  e.preventDefault();
		var dataset = $(this).prev(".datainfo");
		var savebtn = $(this).next(".savebtn");
		var theid   = dataset.attr("id");
		var newid   = theid+"-form";
		var currval = dataset.text();
		
		dataset.empty();
		
		$('<input type="text" name="'+newid+'" id="'+newid+'" value="'+currval+'" class="hlite">').appendTo(dataset);
		
		$(this).css("display", "none");
		savebtn.css("display", "block");
	});
	$(".savebtn").on("click", function(e){
		e.preventDefault();
		var elink   = $(this).prev(".editlink");
		var dataset = elink.prev(".datainfo");
		var newid   = dataset.attr("id");
		
		var cinput  = "#"+newid+"-form";
		var einput  = $(cinput);
		var newval  = einput.attr("value");
		
		$(this).css("display", "none");
		einput.remove();
		dataset.html(newval);
		
		elink.css("display", "block");
	});
});

<div id="wrapper">
        <section id="core">
            <div class="panel panel-default" style="margin-top: 30px">

                <div class="gear">
                    <label>Primary E-Mail:</label>
                    <span id="pemail" class="datainfo">myaddress@googlemail.com</span>
                    <a href="#" class="editlink">Edit</a>
                    <button type="button" class="savebtn btn btn-primary btn-xs">Save</button>

                </div>

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

输出：

控制器：

\DB::table('users')->where('id', $id)->update([
    [
        'email'      => $request->input('pemail'),
    ]
])->where('id', $id);

【问题讨论】：

您是否尝试过实现它？我的意思是，到目前为止似乎没有问题，只需向服务器写下一个简单的 ajax 请求（或只是一个表单提交），然后您就可以使用这样的模型简单地更新您的表：\App\User::find($id)->update(['fullname' => $request->input('pemail')]); '必须将fullname 属性添加到模型的protected $fillable 数组中，查看有关更新记录和使用模型的文档。
我已经这样做了fullname attribute added to the protected $fillable
但这不是唯一要做的事情，分享您在任务的另一部分的进度/努力。
我无法理解我应该在控制器中做什么，因为这是 ajax。我不知道它是否需要json 或任何东西。如何将它与 ajax 代码连接起来。 @

标签： ajax laravel vue.js

【解决方案1】：

无需使用 vue.js。只需使用如下简单的 jQuery 代码。希望是帮助。

jQuery 代码：

Add event on save button On Click
onclick="saveProfile(INPUT ID HERE, RECORD ID)"

在页脚或查看文件中添加 jquery 代码

function saveProfile(id, inputid) {
    var value = $(inputid).val();
    $.ajax({
        headers: {'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content') },
        url: "{{URL::to('admin/updateProfile')}}",
        data:{'id' : id,'value' : value,'inputid':inputid},
        method:'POST',
        success: function( resp ) {
            alert('update');                
        },
        error: function( req, status, err ) {
            console.log( 'something went wrong', status, err );
        }
    });
}

控制器代码

public function updateProfile(REQUEST $request){
    $id = $request->id;
    $value = $request->value;
    $inputid = $request->inputid;
    //for examaple - Input textbox id is : pemail-form
    if($inputid == 'pemail-form'){
        DB::table('table_name')->where('id', $id)->update(['email' => $value]);
    }
    if($inputid == 'fullname-form'){
        DB::table('table_name')->where('id', $id)->update(['fullname' => $value]);
    }
}

【讨论】：