Когда я звоню ajax, он перезагружает окно - PullRequest
0 голосов
/ 16 июня 2020

Когда я звоню ajax, чтобы отправить данные формы, он перезагружает окно. как я могу это остановить?

Это регистрационный код для клиента. Я использую модальное окно для отправки данных. Пожалуйста, дайте мне какое-нибудь решение этой проблемы.

My HTML

<form  id="newregister">
<div class="form_content clearfix">

    <div class="form-group">
        <label for="firstname">First Name</label>
        <input type="text" class="form-control" " id="firstname_page" name="firstname_page" required>
    </div>

    <div class="form-group">
        <label for="lastname">Last Name</label>
        <input type="text" class="form-control" " id="lastname_page" name="lastname_page"  required>
    </div>
    <div class="form-group">
        <label for="compnay_name">Company Name</label>
        <input type="text" class="form-control" id="compnay_name" name="compnay_name"   required>
    </div>
    <div class="form-group">
        <label for="country_name">Country Name</label>
        <input type="text" class="form-control" id="country_name" name="country_name"   required>
    </div>
    <div class="form-group">
        <label for="email_create">Email address</label>
        <input type="text" class="form-control" id="email_create" required name="email_address_page" >
    </div>
    <div class="form-group">
        <label for="phone_no">Phone No</label>
        <input type="number" class="form-control" id="phone_no"  required name="phone_no" >
    </div>

    <div class="form-group">
        <label for="passwd">Password</label>
        <input class="form-control" type="password"  id="password_page" name="password_page" >
    </div>

    <div class="form-group">

        <button class="btn btn-default button button-medium exclusive" id="SubmitCreates" onclick="newRegister()"> <span>
            <i class="icon-user left"></i>Create an account </span>
        </button>
    </div>
</div>
</form>

My Javascript

function newRegister()
{
    $.ajaxSetup({
        headers: {
            'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
        }
    });
    $.ajax({
        url:'{{ route('web.new.register') }}',
        data:$("#newregister").serialize(),
        type:'post',
        success:function(response)
        {
            alert(response);
        }
    });
}

My Controller

public function newregister(Request $request)
{
    return response()->json('true');
}

Я также использовал этот метод jquery.

My HTML

<div class="form-group">
    <button class="btn btn-default button button-medium exclusive" type="submit" id="SubmitCreate" onclick="DoLogin()"> <span>
        <i class="icon-user left"></i>Login </span>
    </button>
</div>

My Jquery

$(document).ready(function(){
    $('#SubmitCreates').on('click', function(){
        $.ajaxSetup({
            headers: {
                'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
            }
        });
        $.ajax({
            url:'{{ route('web.new.register') }}',
            data:$("#newregister").serialize(),
            type:'post',
            success:function(response)
            {
                alert(response);
                return false;
            }
        });
    });
});

, но это тоже не работает. Пожалуйста, дайте мне подсказку или решение, чтобы решить эту проблему.

Ответы [ 3 ]

0 голосов
/ 16 июня 2020

Кнопка может запускать событие отправки формы, которое по умолчанию загружает страницу. Вы можете переопределить это, указав элемент формы, например:

<form onsubmit="return false">
0 голосов
/ 16 июня 2020

Просто используйте метод предотвращения событий по умолчанию

$(document).ready(function(event){
event.preventDefault();
$('#SubmitCreates').on('click', function(){
    $.ajaxSetup({
        headers: {
            'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
        }
    });
    $.ajax({
        url:'{{ route('web.new.register') }}',
        data:$("#newregister").serialize(),
        type:'post',
        success:function(response)
        {
            alert(response);
            return false;
        }
    });
});

});

0 голосов
/ 16 июня 2020

Вам необходимо предотвратить поведение кнопки по умолчанию: https://developer.mozilla.org/ru/docs/Web/API/Event/preventDefault

function newRegister(clickEvent)
{
    clickEvent.preventDefault();

    $.ajaxSetup({
        headers: {
            'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
        }
    });
    $.ajax({
        url:'{{ route('web.new.register') }}',
        data:$("#newregister").serialize(),
        type:'post',
        success:function(response)
        {
            alert(response);
        }
    });
}
...