Question

谢谢你们查看我的问题。我有这个表单，我使用ajax使用laravel提交到mysql数据库。我正在尝试提取用户提交的最新条目。我没有错误，但是我在用户提交表单之前得到了最新版本。我在IndexController中编写了代码。也许我应该使用Jquery / Java？这就是我所拥有的：

路线：

Route::resource('/', 'IndexController');

的IndexController：

 public function index()
{
    $recent = Contact::orderby('created_at', 'desc')->first();
    return view('index', compact('recent'));
}

HTML

<div class ="row">
                <div class ="col-lg-12 contact">
                   <div id = "ctn-box" class = "row pad-med">
                   {!!Form::open(array('url' => 'contacts', 'class' => 'contacting')) !!}
                    <h1 class = "txtc">CONTACTO</h1>
                    <div class = "form-group col-xs-3">
                        {!!Form::label('name', 'Nombre:')!!}
                        {!!Form::text('name', null, ['class'=> 'form-control area'])!!}
                    </div>

                    <div class = "form-group col-xs-3">
                        {!!Form::label('email', 'Email:')!!}
                        {!!Form::email('email', null, ['class'=> 'form-control area', 'placeholder' => 'example@gmail.com'])!!}
                    </div>
                    <div class = "form-group col-xs-3">
                        {!!Form::label('phone', 'Número de Teléfono:')!!}
                        {!!Form::text('phone', null, ['class'=> 'form-control area', 'placeholder' => '657-084-052'])!!}
                    </div>
                    <div class = "form-group col-xs-3">
                        {!!Form::submit('Contacto', ['class'=> 'btn btn-danger outline form-control contact', 'id' => 'fuck'])!!}
                    </div>
                    {!! Form::close() !!}
                    <div id = "thankCtn" class = "txtc">
                        <h1>Muchas Gracias {{$recent->name}}!</h1>
                        <p>Siguemos en contacto. Mientras tanto, visítanos en nuestro officina abajo.</p>
                    </div>
                   </div>
                   <div class = 'contact-info'>
                    <iframe class = "googimg" frameborder="0" scrolling="no"  src="https://maps.google.com/maps?hl=en&q=Passatge hort dels velluters, 5&ie=UTF8&t=roadmap&z=15&iwloc=B&output=embed"><div><small><a href="http://embedgooglemaps.com">embedgooglemaps.com</a></small></div><div><small><a href="http://www.premiumlinkgenerator.com/">multihoster premium</a></small></div></iframe>
                    <div class = "address txtc">
                        <h1 class = "contacts">Passatge Hort dels Velluters<br> 5, 08008 Barcelona</h1>
                        <h2 class = "contacts">657-084-052</h2>
                    </div>
                   </div>
                </div>
             </div>

的Ajax：

    //INDEX CONTACT SUBMISSION//

$('.contacting').on('submit', function(e) {
    var base_url = 'http://rem-edu-es.eu1.frbit.net/';
    e.preventDefault();
    var data = $(this).serialize();
    $.ajax({
        type: "POST",
        url: base_url + "contacts",
        data: data,
        success: function (data) {
            $('.contacting').css('opacity', '0');
            $('.contacting').animate({
                top: '50px'
            }, 100, function(){
                $('#thankCtn').fadeIn(500);
                $('#thankCtn').css('top', '-100px');
            });
        }

    });
});

Answer 1

在提出任何建议之前，我应该告诉您网站可能存在一些问题。我点击了＆＃34;联系人＆＃34;没有填写字段的按钮。你猜怎么着？我收到了回复：＆＃34; Muchas Gracias New Guy ......＆＃34;我猜最后一个人使用了＃34; New Guy＆＃34;作为他的名字。听起来不安全吗？！

现在，在我的回答中，我建议你在success回调$.ajax()中使用jQuery。像这样：

<强>的IndexController

public function index()
{
    $recent = Contact::orderby('created_at', 'desc')->first();
    return json_encode(compact('recent'));        // Returning view(...) means the ajax call will receive HTML page content
}

<强> HTML

<div id = "thankCtn" class = "txtc">
    <h1>Muchas Gracias <span id = "newGuy"></span>!</h1>
    <p>Siguemos en contacto. Mientras tanto, visítanos en nuestro officina abajo.</p>
</div>

<强>的jQuery

success: function (res) {                 // note that I'm changing "data" to "res". It is the result of the ajax call
    $('.contacting').css('opacity', '0');
    $('.contacting').animate({
        top: '50px'
        }, 100, function(){
            $('#newGuy').text(res.name);
            $('#thankCtn').fadeIn(500);
            $('#thankCtn').css('top', '-100px');
        });
    }

Laravel Ajax成功消息：返回联系表单名称输入

1 个答案: