mardi 5 mars 2019

Can't able to Pass value from ajaxfunction to laravel api

I'm trying to pass the value to my backend(API developed using laravel 5.7) but I'm not able to pass the value. If I use button for submit then the value won't get passed, if I'm using "input" instead of "button" then being able to pass the value. and I'm not getting the response value. Any help for this issue is appreciated

my HTML code

 <form>

                        <div class="form__wrapper wow fadeInDown" data-wow-delay="0.5s" id="getvalue">
                            <input type="text" class="form__input" id="uname" name="username" required
                                onkeypress="return isAlphabet(event)" maxlength="30">
                <label class="form__label" for="uname">
                                <span class="form__label-content">What we calls you?</span>
                            </label>
                        </div>
                        <div class="form__wrapper wow fadeInDown" data-wow-delay="0.5s" id="getvalue">
                            <input type="tel" class="form__input" id="mobile" name="phonenumber" required
                                onkeypress="return isNumberKey(event);" maxlength="10">
                            <div id="error"></div>

                            <label class="form__label" for="uno">
                                <span class="form__label-content">What's your number?</span>
                            </label>

                        </div>
                        <div class="form__wrapper wow fadeInDown" data-wow-delay="0.5s" id="getvalue">
                            <input type="email" class="form__input" id="email" name="email"
                            pattern="[^@]+@[^@]+\.[a-zA-Z]{2,6}">

                            <label class="form__label" for="uemail">
                                <span class="form__label-content">What's your Email?</span>
                            </label>

                        </div> 
                        <button type="submit" class="col-md btn btn-default bg-orange btn-lg wow fadeInUp form_input">Get
                            Notified</button>
                         </form>

My Jquery code

$("form").submit(function (event) {
    event.preventDefault();
    $('#mobile').val().length != 10 ? ($('#errorID') ? $("#mobile").after('<div id="errorID" class="alert alert-danger">Please enter Valid mobile</div>') : null) : ($("div").remove("#errorID"), mob = ($("#mobile").val()));
    $.ajax({
        type: "POST", url: "localhost:8000/api/astroinfo", data: { username: $("#uname").val(), phonenumber: mob, email: $("#email").val() },
        success: function (data) {
            $("div").remove(".modal-body");
            if (data.status == '0') {
                $(".modal-header").after('<div id="errorID" class="alert alert-success">Successfully Submitted<br>We will revote you soon</div><div class="modal-footer"><button type="button" class="btn btn-info" data-dismiss="modal">Close</button></div>');
            } else if (data.status == '1') {
                $("modal-header").after('<div id="errorID" class="alert alert-danger">Something Went Wrong</div><div class="modal-footer"><button type="button" class="btn btn-info" data-dismiss="modal">Close</button></div>');
            }
        },
        error: function (data) {
            $("div").remove(".modal-body");
            $(".modal-header").after('<div id="errorID" class="alert alert-danger">Sending Unsuccesful</div><div class="modal-footer"><button type="button" class="btn btn-danger" data-dismiss="modal">Close</button></div>');
        }
    });

});

Laravel code

<?php

namespace App\Http\Controllers;

use Exception;
use Illuminate\Http\Request;
use App\Http\Requests;
use App\Http\Controllers\Controller;
use App\info;
use Mail;

class AstrolgerinfoCtrl extends Controller
{
public function info(Request $request)
{


$insert=new info([
"name"=> $request->username,
"number"=> $request->phonenumber,
"email"=> $request->email
]);
$insert->save();
return response()->json(['status'=>0],200);
}
}



via Chebli Mohamed

Aucun commentaire:

Enregistrer un commentaire