We Keep Coding

Combine two field in email field

laravel
I'm struggling to put the result of two concatme fields in another field input.
I would like to put the results of response in the email field input.
The thing I would like to achieve is to make it easier for the user to log in to the system without putting the whole email address john#box.domain.com.
here is the code so far.
#extends('layouts.app')
#section('content')
<div class="container">
<div class="row">
<div class="col-md-8 col-md-offset-2">
#include('auth/banner')
<div class="panel panel-default panel-shaded">
<div class="panel-body">
#action('login_form.before')
<form class="form-horizontal margin-top" method="POST" action="{{ route('login') }}">
{{ csrf_field() }}
<div class="form-group{{ $errors->has('email') ? ' has-error' : '' }}">
<label for="email" class="col-md-4 control-label">{{ __('Email Address') }}</label>
<div class="col-md-6">
<!-- SCRIPT -->
<script type="text/javascript">
function concatme()
{
var num1 = document.getElementById("num1").value;
var num2 = document.getElementById("num2").value;
document.getElementById("response").innerText = num1 + '' +num2;
}
</script>
<!-- FIN SCRIPT -->
<!---- INICIO---->
<input type="text" name="num1" class="form-control" id="num1" placeholder="USER">
<input type="text" name="num2" class="form-control" id="num2" value="#box.domain.com" placeholder="Number 2">
<!---FIN-->
<!-- RESUTLADO PREVIEW -->
<p id="response"></p>
<!-- RESULDADO PREVIEW -->
<input id="email" type="email" class="form-control" name="email" value="{{ old('email') }}" required autofocus>
#if ($errors->has('email'))
<span class="help-block">
<strong>{{ $errors->first('email') }}</strong>
</span>
#endif
</div>
</div>
<div class="form-group{{ $errors->has('password') ? ' has-error' : '' }}">
<label for="password" class="col-md-4 control-label">{{ __('Password') }}</label>
<div class="col-md-6">
<input id="password" type="password" class="form-control" name="password" required>
#if ($errors->has('password'))
<span class="help-block">
<strong>{{ $errors->first('password') }}</strong>
</span>
#endif
</div>
</div>
<div class="form-group">
<div class="col-md-6 col-md-offset-4">
<label class="checkbox">
<input type="checkbox" name="remember" {{ old('remember') ? 'checked' : '' }}> {{ __('Remember Me') }}
</label>
</div>
</div>
<div class="form-group">
<div class="col-md-8 col-md-offset-4">
<button type="submit" onclick="concatme()" class="btn btn-primary">
{{ __('Login') }}
</button>
#if (Eventy::filter('auth.password_reset_available', true))
<a class="btn btn-link" href="{{ route('password.request') }}">
{{ __('Forgot Your Password?') }}
</a>
#endif
</div>
</div>
</form>
<p>Hola</p>
#action('login_form.after')
</div>
</div>
</div>
</div>
</div>
#endsection

I think its working but you are not able to see it because you have use form and called javascript function on submit button.
What happens is its sending request to given route and refreshing page thats make paragraph tag to empty again. Remove type submit from submit button and then confirm if its working or not.

How to add my ajax data to bootstrap4 cards

This is my part of html(ejs) file and I have multiple card forms(such as ID =myContent1, myContent2, myContetn3 ...) they receive ajax data when the i class=icon... is toggled. when the function(toggle) is activated, received ajax data mapping with myContent No. (ex. received ajax data ID 1 with myContent1 and 2 for myContent2 ... so on).
What I want to do is that, ajax data should be loaded when my html file is executed and automatically mapping with my card forms(based on card Id no)
need your kind help.
<div class="col-sm-6">
<div class="card">
<div class="card-header" id="cardHeader3" style="visibility: hidden;">unSaved</div>
<div class="card-body">
<i class="icon-plus icons font-2xl" id="icon3" style="font-size: 5rem !important;margin-left: 46%;cursor:pointer;" onclick="toggler('myContent_3');"></i>
<div id="myContent_3" class="card-title" style="display: none;">
<form action="" method="post">
<div class="form-group">
<div class="input-group">
<div class="input-group-prepend">
<span class="input-group-text">sequence</span>
</div>
<input type="text" id="notiSeq_3" name="notiSeq" class="form-control" value="">
<div class="input-group-append">
<span class="input-group-text">
<i class="fa fa-sort-numeric-asc"></i>
</span>
</div>
</div>
</div>
<div class="form-group">
<div class="input-group">
<div class="input-group-prepend">
<span class="input-group-text">title</span>
</div>
<input type="text" id="title_3" name="title" class="form-control" value="">
<div class="input-group-append">
<span class="input-group-text">
<i class="fa fa-tumblr"></i>
</span>
</div>
</div>
</div>
<div class="form-group">
<div class="input-group">
<div class="input-group-prepend">
<span class="input-group-text">Link</span>
</div>
<input type="text" id="link_3" name="link" class="form-control" value="">
<div class="input-group-append">
<span class="input-group-text">
<i class="fa fa-hand-o-left"></i>
</span>
</div>
</div>
</div>
<div class="form-group">
<div class="input-group">
<div class="input-group-prepend">
<span class="input-group-text">exposureTime</span>
</div>
<input type="text" id="notiTime_3" name="notiTime" class="form-control" value="" readonly style="background-color:#FFFFFF">
<div class="input-group-append">
<span class="input-group-text">
<i class="cui-calendar"></i>
</span>
</div>
</div>
</div>
<div class="form-group">
<div class="input-group">
<div class="input-group-prepend">
<span class="input-group-text">Urgency</span>
</div>
<select class="form-control" id="viewYn_3" defaultValue="N">
<option value="N">N</option>
<option value="Y">Y</option>
</select>
<div class="input-group-append">
<span class="input-group-text">
<i class="icon-eye icons"></i>
</span>
</div>
</div>
</div>
<div class="form-group form-actions">
<button type="button" class="btn btn-primary" onclick ="save('3')">Save</button>
<button type="button" class="btn btn-secondary" onclick="del('3')">Delete</button>
</div>
</form>
</div>
</div>
</div>
</div>
And This is my part of js file. it currently works with when the card forms are toggled.
function toggler(divId) {
var tempId = divId.slice(-1);
var x = document.getElementById("icon" + tempId);
var y = document.getElementById("cardHeader" + tempId);
$.ajax({
url: GW_URL+'/myRestAPI/get/'+tempId,
type:'get',
contentType: "application/json",
dataType : "json",
cache: false,
success : function(data){
$("#notiSeq_" + tempId).val(data.exposureNo);
$("#title_" + tempId).val(data.title);
$("#link_" + tempId).val(data.link);
$("#notiTime_" + tempId).val(data.exposureTime + " - " + data.exposureTime2);
$("#viewYn_" + tempId).val(data.urgency);
},
error : function(jqXHR, textStatus, errorThrown){
console.log(jqXHR.responseText);
}
});

Reload modal window after click on a button

how I can reload a modal window after click on a button?
Here there is the controller of modal window
(function(){
'use strict';
angular
.module('casalibroApp')
.controller('ModificaAggiungiLibroController', ModificaAggiungiLibroController);
ModificaAggiungiLibroController.$inject = ['$uibModalInstance', 'entity', '$scope', 'Libro', 'CancellaAutore', '$state'];
function ModificaAggiungiLibroController($uibModalInstance, entity, $scope, Libro, CancellaAutore, $state){
var vm = this;
vm.itemsPerPage = 1;
vm.currentPage = 1;
vm.nuovoAutore = false;
vm.libro = entity;
vm.clear = function() {
$uibModalInstance.dismiss('cancel');
}
vm.save = function() {
vm.isSaving = true;
if (vm.libro.id !== null) {
Libro.update(vm.libro).$promise
.then(function(result){
$scope.$emit('casalibroApp:libroUpdate', result);
$uibModalInstance.close(result);
vm.isSaving = false;
}, function(){
vm.isSaving = false;
});
}else{
Libro.save(vm.libro).$promise
.then(function(result){
$scope.$emit('casalibroApp:libroUpdate', result);
$uibModalInstance.close(result);
vm.isSaving = false;
}, function(){
vm.isSaving = false;
});
}
}
vm.test = function(autoreId, libroId){
console.info("AUTORE ID: ", autoreId);
console.info("LIBRO ID: ", libroId);
CancellaAutore.get({libroId: libroId, autoreId: autoreId}).$promise
.then(function(){
console.info("CURRENT: ", $state.current);
$state.go('welcome.book-edit', {}, {reload: true});
}, function(error){
AlertService.error(error.data.message);
});
}
}
})();
The function vm.test is the action that run on a click on button. The function work correctly and also the reload
$state.go('welcome.book-edit', {}, {reload: true});
but this open a new modal window on top of the other modal window
HTML for modal window
<form name="editForm" role="form" novalidate ng-submit="vm.save()" show-validation>
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-hidden="true"
ng-click="vm.clear()">
×
</button>
<div ng-switch="vm.libro.id">
<h4 ng-switch-default class="modal-title" id="windowTitle">
Modifica libro {{vm.libro.titolo}}
</h4>
<h4 class="modal-title" id="windowTitle" ng-switch-when="null">
Aggiungi un libro alla libreria
</h4>
</div>
</div>
<div class="modal-body">
<uib-tabset active="activeForm">
<uib-tab index="0" heading="Libro">
<ng-form name="nestedForm">
<div class="form-group" ng-show="vm.libro.id != null">
<label for="libroId">ID</label>
<input type="text" class="form-control" ng-model="vm.libro.id" readonly="true" name="libroId"/>
</div>
<div class="form-group">
<label for="libroTitolo">Titolo</label>
<input type="text" name="libroTitolo" class="form-control" ng-model="vm.libro.titolo"/>
</div>
<div class="form-group">
<label for="libroGenere">Genere</label>
<input type="text" name="libroGenere" class="form-control" ng-model="vm.libro.genere.genere"/>
</div>
<div class="form-group">
<label for="libroPagine">Numero di pagine</label>
<input type="text" name="libroPagine" class="form-control" ng-model="vm.libro.numero_pagine"/>
</div>
<div class="form-group">
<label for="libroAnnoPubblicazione">Anno di pubblicazione</label>
<input type="text" class="form-control" name="libroAnnoPubblicazione" ng-model="vm.libro.anno_pubblicazione"/>
</div>
<div class="form-group">
<label for="libroDescrizione">Descrizione</label>
<textarea rows="5" cols="65" maxlength="250" ng-trim="false" ng-model="vm.libro.descrizione" name="libroDescrizione" class="form-control"></textarea>
<p>Totale caratteri inseriti: {{vm.libro.descrizione.length}}/250</p>
</div>
<div class="form-group">
<label for="libroCopertina">Copertina</label>
<input type="text" class="form-control" name="libroCopertina" ng-model="vm.libro.copertina_url"/>
</div>
</ng-form>
</uib-tab>
<uib-tab index="1" heading="Autore" disable="vm.libro.titolo === null">
<div ng-repeat="autore in vm.libro.autores.slice(((vm.currentPage-1)*vm.itemsPerPage), ((vm.currentPage)*vm.itemsPerPage))">
<div class="form-group">
<label for="autoreNome">Nome</label>
<input type="text" name="autoreNome" class="form-control" ng-model="autore.nome"/>
</div>
<div class="form-group">
<label for="cognomeAutore">Cognome</label>
<input type="text" class="form-control" name="cognomeAutore" ng-model="autore.cognome"/>
</div>
<div class="form-inline">
<button type="button" class="btn btn-danger" ng-show="vm.libro.autores.length > 0" ng-click="vm.test(autore.id, vm.libro.id)">
<span class="glyphicon glyphicon-remove-circle"></span>
<span>Elimina autore</span>
</button>
<button type="button" class="btn btn-primary" ng-click="vm.nuovoAutore=true">
<span class="glyphicon glyphicon-plus"></span>
<span>Aggiungi autore</span>
</button>
</div>
</div>
<uib-pagination total-items="vm.libro.autores.length" ng-model="vm.currentPage" ng-change="vm.transition()" boundary-link-numbers="true" previous-text="Previous" next-text="Next" first-text="First" last-text="Last" items-per-page="vm.itemsPerPage"></uib-pagination>
</uib-tab>
<uib-tab index="2" heading="Casa Editrice" disable="vm.libro.titolo === null">
<div class="form-group" ng-show="vm.libro.id != null">
<label for="casaEditrice">Nome</label>
<input type="text" name="casaEditrice" class="form-control" ng-model="vm.libro.casaEditrice.nome"/>
</div>
<div class="form-row" style="margin-top: 5px;">
<button type="button" class="btn btn-primary" ng-show="vm.libro.id == null">
<span class="glyphicon glyphicon-plus"></span>
<span>Aggiungi casa editrice</span>
</button>
</div>
</uib-tab>
</uib-tabset>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-default" data-dismiss="modal" ng-click="vm.clear()">
<span class="glyphicon glyphicon-ban-circle"></span> <span>Cancel</span>
</button>
<button type="submit" ng-disabled="editForm.$invalid || vm.isSaving" class="btn btn-primary">
<span class="glyphicon glyphicon-save"></span> <span>Save</span>
</button>
</div>
</form>

modal keep open during validation

I'm doing a record with a modal boostrap laravel performing validation. sending data via jquery ajax realize it. the problem I have is that pressing the submit button closes the modal. how you could do to keep open modal until the end of the validacion ?? Thank you
modal:
<!--- Register Modal -->
<div class="modal fade" id="Register" role="dialog">
<div class="modal-dialog">
<!-- Modal content-->
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal">×</button>
<h4 class="modal-title">Registro</h4>
</div>
<div class="modal-body">
<form class="form" role="form" id="new-user" data-token="{{ Session::token() }}" method="post" >
{{ csrf_field() }}
<div id="error">
<!-- error will be showen here ! -->
</div>
<div class="form-group{{ $errors->has('name') ? ' has-error' : '' }}">
<label for="name">Nombre completo: </label>
<input id="name" type="text" class="form-control" name="name" value="{{ old('name') }}">
#if ($errors->has('name'))
<span class="help-block">
<strong>{{ $errors->first('name') }}</strong>
</span>
#endif
</div>
<div class="form-group{{ $errors->has('email') ? ' has-error' : '' }}">
<label for="email">Correo electronico: </label>
<input id="email" type="email" class="form-control" name="email" value="{{ old('email') }}">
#if ($errors->has('email'))
<span class="help-block">
<strong>{{ $errors->first('email') }}</strong>
</span>
#endif
</div>
<div class="form-group{{ $errors->has('password') ? ' has-error' : '' }}">
<label for="pwd">Contraseña:</label>
<input id="password" type="password" class="form-control" name="password">
#if ($errors->has('password'))
<span class="help-block">
<strong>{{ $errors->first('password') }}</strong>
</span>
#endif
</div>
<div class="form-group{{ $errors->has('password_confirmation') ? ' has-error' : '' }}">
<label >Confirmar contraseña:</label>
<input id="cpassword" type="password" class="form-control" name="cpassword">
#if ($errors->has('password_confirmation'))
<span class="help-block">
<strong>{{ $errors->first('password_confirmation') }}</strong>
</span>
#endif
</div>
<!-- <input type="hidden" name="_token" value="{{Session::token()}}"> seguridad -->
<button type="submit" class="btn btn-default" id="Submit" >Registro</button>
<div>
<!-- boton login facebook-->
<div>
Facebook</span>
</div>
<!-- boton login google-->
<div>
Google</span>
</div>
</div>
</form>
</div>
</div>
</div>
</div>
js:
function send(event){
event.preventDefault();
$.ajax({
type: 'post',
url: "{{url('/register')}}",
data: {
name: $('#name').val(),
email: $('#email').val(),
password: $('#password').val(),
cpassword: $('#cpassword').val(),
_token: $('#new-user').attr('data-token')
},
success: function (data) {
$("#error").fadeIn(1000, function () {
$("#error").html('<div class="alert alert-danger"><span class="glyphicon glyphicon-info-sign"></span> ' + data + ' !</div>');
});
}
});
}

I don't know how you call the send() js function... so I don't know if you are preventing form submission. Anyway:
Your modal should not been closed on submit the form, except if the form is really being sent and your page reloads.
To prevent your form from being submitted and the current page to reload:
$('#new-user').submit(function(e) { e.preventDefault; });
And to close the modal in your ajax.success function try to use:
$('#Register').modal('hide');

I would Just give you an easy Validation Example. You can use it your own way
and to hide the modal Just add $("#Your Modal ID ").modal("hide"); if your Modal ID is Register then Use $("#Register").modal("hide"); and it will close
function send(event){
event.preventDefault();
if((!$('#name').val())||(!$('#email').val())||(!$('#password').val()))
{
alert("Please Fill All The Details !")
}
else{
$.ajax({
type: 'post',
url: "{{url('/register')}}",
data: {
name: $('#name').val(),
email: $('#email').val(),
password: $('#password').val(),
cpassword: $('#cpassword').val(),
_token: $('#new-user').attr('data-token')
},
success: function (data) {
$("#error").fadeIn(1000, function () {
$("#error").html('<div class="alert alert-danger"><span class="glyphicon glyphicon-info-sign"></span> ' + data + ' !</div>');
});
$("#Your Modal ID ").modal("hide");
}
});
}
}

AJAX Doesn't Load the the second nested PHP function

My AJAX call gets triggered for one condition, however when it proceeds to new nested php function it showing the output is the php processing file...Below is my Code.. i am using bootstrap 3.0 framework on this one and pure javascript.
<!-- Modal Register -->
<div id="register" class="modal fade">
<div class="modal-dialog">
<div class="container">
<div class="col-xs-12 col-sm-10 col-md-8 col-md-offset-1" style="max-width:400px;">
<form role="form" method="POST" id="reg" action="reg-check.php">
<div class="panel panel-primary" style="border:1px solid black;">
<div class="panel-heading" style="background-color:black;">
<h3 class="panel-title">
Register
<button type="button" class="close" data-dismiss="modal" aria-hidden="true" style="color:white;">×</button>
</h3>
</div>
<div class="panel-body ">
<div class="login-box">
<img src="images/newlogo2.png" width="100%;"><br/><br/>
<div class="input-group">
<span class="input-group-addon">
<span class="glyphicon glyphicon-user"></span>
</span>
<input type="text" class="form-control" name="name" placeholder="Name" autofocus />
</div>
<div class="input-group">
<span class="input-group-addon">
<span class="glyphicon glyphicon-earphone"></span>
</span>
<input type="tel" class="form-control" name="mobile" placeholder="Mobile Number" required />
</div>
<div class="input-group">
<span class="input-group-addon">
<span class="glyphicon glyphicon-briefcase"></span>
</span>
<input type="email" class="form-control" name="email" placeholder="email" required/>
</div>
<div class="input-group">
<span class="input-group-addon">
<span class="glyphicon glyphicon-hand-right"></span>
</span>
<input type="password" id="pass" class="form-control" name="password" placeholder="Password" required />
</div>
<div class="input-group">
<span class="input-group-addon">
<span class="glyphicon glyphicon-hand-right"></span>
</span>
<input type="password" id = "pass1"class="form-control" name="password1" placeholder="Confirm Password" required />
</div>
<label>
<input type="checkbox" name="agree" value="agree"> I agree to the terms and conditions of the website and cookie policy</label>
</div>
<div class="panel-footer">
<div class="row">
<div class="col-xs-12 col-sm-12 col-md-12" style="text-align:center;">
<p><span id="errorMessage"></span></p>
<button id="submitreg" type="submit" class="btn btn-labeled btn-success" data-dismiss="none" onClick="javascript:ajax_post();">
<span class="btn-label">
<i class="glyphicon glyphicon-ok"></i>
</span>Submit</button>
<button type="reset" class="btn btn-labeled btn-danger" >
<span class="btn-label">
<i class="glyphicon glyphicon-remove"></i>
</span>lReset</button>
</div>
</div>
</div>
</div>
</div>
</form>
<div><p id="errorMessage"></p></div>
</div>
</div>
</div>
<!-- /.modal-dialog -->
</div>
My Ajax Scripts`
function ajax_post(){
// Create our XMLHttpRequest object
var hr = new XMLHttpRequest();
// Create some variables we need to send to our PHP file
var url = "reg-check.php?";
hr.open("POST", url, true);
// Access the onreadystatechange event for the XMLHttpRequest object
hr.onreadystatechange = function() {
if(hr.readyState == 4 && hr.status == 200) {
var return_data = hr.responseText;
console.log(return_data);
document.getElementById("errorMessage").innerHTML = return_data;
}
}
// Send the data to PHP now... and wait for response to update the status div
hr.send(); // Actually execute the request
document.getElementById("errorMessage").innerHTML = "processing...";
}
MY PHP Script
<?php
require ("/Pages/dbc.php");
if(!empty($_POST['name']) && !empty($_POST['mobile']) && !empty($_POST['email']) && !empty($_POST['password']) && !empty($_POST['password1']))
{
$name =mysql_real_escape_string($_POST['name']);
$mobile =mysql_real_escape_string($_POST['mobile']);
$email =mysql_real_escape_string($_POST['email']);
$password =mysql_real_escape_string($_POST['password']);
$password1 =mysql_real_escape_string($_POST['password1']);
$query =mysql_query("SELECT * FROM `register` WHERE `mobile`= $mobile");
$numrows =mysql_num_rows($query);
if($numrows == 0){
$query1 =mysql_query("SELECT * FROM `register` WHERE `email`= '$email'");
$numrows1 =mysql_num_rows($query1);
if($numrows1==0){
if($password == $password1){
mysql_query("INSERT INTO `cabs4rent`.`register` (`name`, `mobile`, `email`, `password`) VALUES ('$name', '$mobile', '$email', '$password');");
echo "Registration Successful";
}else{
echo "Passwords do not match";
}
}else{
echo "Emails is already registered";
}
}else{
echo "Mobile Number Already Registered";
}
}
else
{
echo 'Please fill all the details';
}
exit;
?>
I will changing to mysqli/pdo very soon.
The problem was with the action attr in my form element. hence i removed the form element and and in ajax made changes and used urlencoder to send the data... everything work smoothly..
Here is the code
function ajax_post(){
// Create our XMLHttpRequest object
//preventDefault();
var hr = new XMLHttpRequest();
var name =document.getElementById("name").value;
var mobile =document.getElementById("mobile").value;
var email =document.getElementById("email").value;
var password =document.getElementById("pass").value;
var password1 =document.getElementById("pass1").value;
var vars = "name="+name+"&mobile="+mobile+"&email="+email+"&password="+password+"&password1="+password1;
// Create some variables we need to send to our PHP file
var url = "reg-check.php?";
hr.open("POST", url, true);
hr.setRequestHeader("Content-type","application/x-www-form-urlencoded")
// Access the onreadystatechange event for the XMLHttpRequest object
hr.onreadystatechange = function() {
if(hr.readyState == 4 && hr.status == 200) {
var return_data = hr.responseText;
console.log(return_data);
document.getElementById("errorMessage").innerHTML = return_data;
}
}
// Send the data to PHP now... and wait for response to update the status div
hr.send(vars); // Actually execute the request
document.getElementById("errorMessage").innerHTML = "processing...";
}
Form without the formelement
<!-- Modal Register -->
<div id="register" class="modal fade">
<div class="modal-dialog">
<div class="container">
<div class="col-xs-12 col-sm-10 col-md-8 col-md-offset-1" style="max-width:400px;">
<div class="panel panel-primary" style="border:1px solid black;">
<div class="panel-heading" style="background-color:black;">
<h3 class="panel-title">
Register
<button type="button" class="close" data-dismiss="modal" aria-hidden="true" style="color:white;">×</button>
</h3>
</div>
<div class="panel-body ">
<div class="login-box">
<img src="images/newlogo2.png" width="100%;"><br/><br/>
<div class="input-group">
<span class="input-group-addon">
<span class="glyphicon glyphicon-user"></span>
</span>
<input type="text" class="form-control"id="name" name="name" placeholder="Name" autofocus />
</div>
<div class="input-group">
<span class="input-group-addon">
<span class="glyphicon glyphicon-earphone"></span>
</span>
<input type="tel" class="form-control" id="mobile" name="mobile" placeholder="Mobile Number" required />
</div>
<div class="input-group">
<span class="input-group-addon">
<span class="glyphicon glyphicon-briefcase"></span>
</span>
<input type="email" class="form-control" id="email" name="email" placeholder="email" required/>
</div>
<div class="input-group">
<span class="input-group-addon">
<span class="glyphicon glyphicon-hand-right"></span>
</span>
<input type="password" id="pass" class="form-control" name="password" placeholder="Password" required />
</div>
<div class="input-group">
<span class="input-group-addon">
<span class="glyphicon glyphicon-hand-right"></span>
</span>
<input type="password" id = "pass1"class="form-control" name="password1" placeholder="Confirm Password" required />
</div>
</div>
<div class="panel-footer">
<div class="row">
<div class="col-xs-12 col-sm-12 col-md-12" style="text-align:center;">
<p><span id="errorMessage"></span></p>
<button id="submitreg" type="submit" class="btn btn-labeled btn-success" data-dismiss="none" onClick="javascript:ajax_post();">
<span class="btn-label">
<i class="glyphicon glyphicon-ok"></i>
</span>Submit</button>
<button type="button" id="regReset" onclick="rested();" class="btn btn-labeled btn-danger" >
<span class="btn-label">
<i class="glyphicon glyphicon-remove"></i>
</span>Reset</button>
</div>
<p><span id="errorMessage"></span></p>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<!-- /.modal-dialog -->
</div>
No changes made to to PHP script.

It looks like you're not posting any data.
// Create some variables we need to send to our PHP file
var url = "reg-check.php?";
doesn't add any of the values to the url.
You schould do something like
var name_value=document.getElementById('name').value;
var mobile_value=document.getElementById('mobile').value;
var url = "reg-check.php?" + "name=" + name_value + "&mobile=" + mobile_val;