We Keep Coding

Javascript fail to redirect after firebase authentication

I'm authenticating users registered in my firebase database and i want to redirect the user after successful authentication
const txtEmail = document.getElementById('email');
const txtPass = document.getElementById('password');
const loginBtn= document.getElementById('reg');
loginBtn.addEventListener('click', e => {
const mail = txtEmail.value;
const pass = txtPass.value;
const auth = firebase.auth();
const promise = auth.signInWithEmailAndPassword(mail, pass);
if(promise){
window.location = "{{ route('users') }}";
console.log("{{ route('users') }}");
}else{
}
});
the log is successfully printed but the redirection fails may someone help
this is my form i don't know but maybe there is something wrong in it
<form class="form-horizontal m-t-20" method="post">
{{ csrf_field() }}
<div class="form-group ">
<div class="col-xs-12">
<input class="form-control" type="text" required="" id="email" placeholder="email">
</div>
</div>
<div class="form-group">
<div class="col-xs-12">
<input class="form-control" type="password" id="password" required="" name="password" placeholder="Password">
</div>
</div>
<div class="form-group ">
<div class="col-xs-12">
<div class="checkbox checkbox-custom">
<input id="checkbox-signup" type="checkbox">
<label for="checkbox-signup">
Remember me
</label>
</div>
</div>
</div>
<div class="form-group text-center m-t-30">
<div class="col-xs-12">
<button class="btn btn-custom btn-bordred btn-block waves-effect waves-light" class="reg" id="reg">
Login
</button>
</div>
</div>
<div class="form-group m-t-30 m-b-0">
<div class="col-sm-12">
<i class="fa fa-lock m-r-5"></i> Forgot your password?
</div>
</div>
</form>

Update an input value from giving data

I am working on a project with openstreetmap, leaflet and the leaflet plugin search-leaflet. I have got a search form, where the user can autocomplete their adress and the location of the marker.
The adress is then comma seperated in the input field and I want, if the user clicks on the button a second form should open, where the user can validate the adress. I guess, it is also better for storing the data in a database.
My problem is, that i don't get the value of the autocomplete form, to store the value in the input text fields.
Here my code:
HTML
<div class="col-md-8 col-md-offset-2 form-container">
<div id="map-adress"></div>
<div class="panel panel-default marker-panel">
<div class="panel-heading">Create a post</div>
<div class="panel-body">
<div class="col-md-8 col-md-offset-4">
<p>Insert the adress of the marker position<br>
(You can move the marker on the map to the right position).</p>
</div>
<div class="form-group">
<label for="findbox-adress" class="col-md-4 control-label find-label">Marker Location</label>
<div class="col-md-6">
<div id="findbox-adress"></div>
</div>
<div class="col-md-2">
<button type="submit" class="btn btn-primary user_marker_btn">
Validate
</button>
</div>
</div>
</div>
</div>
<div id="user_marker_adress" class="panel panel-default">
<div class="panel-heading">Validate the marker adress</div>
<div class="panel-body">
<form class="form-horizontal" method="POST" action="{{ route('userposts.create') }}">
{{ csrf_field() }}
<div class="form-group">
<label for="a_street" class="col-md-4 control-label">Street</label>
<div class="col-md-6">
<input id="a_street" type="text" class="form-control" name="a_street" required>
</div>
</div>
<div class="form-group">
<label for="a_street_no" class="col-md-4 control-label">Street No.</label>
<div class="col-md-6">
<input id="a_street_no" type="text" class="form-control" name="a_street_no" required>
</div>
</div>
<div class="form-group">
<label for="a_zip_code" class="col-md-4 control-label">Zip Code</label>
<div class="col-md-6">
<input id="a_zip_code" type="text" class="form-control" name="a_zip_code" required>
</div>
</div>
<div class="form-group">
<label for="a_state" class="col-md-4 control-label">State</label>
<div class="col-md-6">
<input id="a_state" type="text" class="form-control" name="a_state" required>
</div>
</div>
<div class="form-group">
<label for="a_country" class="col-md-4 control-label">Country</label>
<div class="col-md-6">
<input id="a_country" type="text" class="form-control" name="a_country" required>
</div>
</div>
<div class="form-group">
<div class="col-md-8 col-md-offset-4">
<button type="reset" class="btn btn-danger">
Clear
</button>
<button type="submit" class="btn btn-primary">
Next
</button>
</div>
</div>
</form>
</div>
</div>
Javascript/jQuery
$(document).ready(function(){
var map = new L.Map('map-adress', {zoom: 2, center: new L.latLng([24.61, -34.63]) });
map.addLayer(new L.TileLayer('http://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png', {
attribution: '© OpenStreetMap'
}));
/*var markersLayer = new L.LayerGroup(); //layer contain searched elements
map.addLayer(markersLayer);
*/
map.addControl( new L.Control.Search({
container: 'findbox-adress',
url: 'http://nominatim.openstreetmap.org/search?format=json&q={s}',
jsonpParam: 'json_callback',
propertyName: 'display_name',
propertyLoc: ['lat','lon'],
marker: L.marker([0,0], {draggable:'true'}).addTo(map).on('click', getLatLon),
autoCollapse: false,
collapsed: false,
autoType: false,
minLength: 2,
autoResize: false,
zoom: 18
}) );
$( ".search-input" ).attr( "Placeholder", "No., Street, zip code, State and country" );
function getLatLon(e) {
alert(this.getLatLng());
}
$(".user_marker_btn").click(function(){
$("#user_marker_adress").css( "display", "block" );
});
$(".user_marker_btn").click(function(){
$(".search-input").change(function(){
$(div).text($(this).val());
});
});
});
If I click on the "user_marker_btn" the value of the "search-input" should change, that i can access the value. And store it in the second form and then store it into a database.
But I don't know how? Hopefully someone can help me.

How to send contact email with node js and mailgun?

new to node js and mail gun. I am trying to send a 'contact us' email from a website that is using the following for my send button (on my index.html page).
<!-- START CONTACT SECTION -->
<section class="section-contact" id="contacts">
<div class="container">
<!-- START SECTION HEADER -->
<h2 class="reveal reveal-top">Contact Us</h2>
<div class="subheading reveal reveal-top">
Hit us up. Let us know how we can make things better ( <b>Support#mail.com </b>).
</div>
<!-- END SECTION HEADER -->
<div class="contact-form-wrapper reveal reveal-bottom">
<!-- START CONTACT FORM -->
<!-- <form method="POST" action="./scripts/writeus.php" accept-charset="UTF-8" class="contact-form" id="jvalidate" novalidate="novalidate"> -->
<form method="POST" action="./scripts/mailgun.php" accept-charset="UTF-8" class="contact-form" id="jvalidate" novalidate="novalidate">
<!-- <form method="POST" action="send_mailgun($email)" accept-charset="UTF-8" class="contact-form" id="jvalidate" novalidate="novalidate"> -->
<div class="row">
<div class="col-sm-12 col-md-4">
<div class="field-holder">
<input class="form-control input-lg field" placeholder="John Snow" name="name" type="text">
</div>
</div>
<div class="col-sm-12 col-md-4">
<div class="field-holder">
<input class="form-control input-lg field" placeholder="myReplyEmail#Address.com" name="email" type="email">
</div>
</div>
<div class="col-sm-12 col-md-4">
<div class="field-holder">
<input class="form-control input-lg field" placeholder="Subject" name="website" type="text">
</div>
</div>
<div class="col-md-12 col-xs-12">
<div class="field-holder">
<textarea class="form-control" placeholder="Some text" name="message" cols="50" rows="10"></textarea>
</div>
</div>
<div class="form-group">
<div class="col-md-12">
<div class="alert alert-success" role="alert" style="display: none;">
Message has been successfully sent.
</div>
<div class="alert alert-danger" role="alert" style="display: none;">
<div class="alert-text">Server error</div>
</div>
</div>
</div>
</div>
<div class="row">
<div class="col-md-12">
<button class="btn btn-primary btn-contact" type="submit" value="SEND MESSAGE">SEND MESSAGE</button>
</div>
</div>
</form>
<!-- END CONTACT FORM -->
</div>
</div>
</section>
<!-- END CONTACT SECTION -->
I have Node.js with Express and mailgun installed and working on my local machine with the snippet bellow hard coded as a test in my server.js
var Mailgun = require('mailgun').Mailgun;
var mg = new Mailgun('some-api-key');
mg.sendText('example#example.com', 'Recipient 1 <rec1#example.com>',
'This is the subject',
'This is the text',
'noreply#example.com', {},
function(err) {
if (err) console.log('Oh noes: ' + err);
else console.log('Success');
});
How do I get the button info and send from my index.html ?
Thanks for the help. Much appreciated.

You need create web server to receive submit from your form or ajax call. Look this: http://expressjs.com/
example:
var express = require('express');
var Mailgun = require('mailgun').Mailgun;
var app = express();
app.post('/sendMail', function (req, res) {
/*use body-parser (https://github.com/expressjs/body-parser) for parameters */
var mg = new Mailgun('some-api-key');
mg.sendText('example#example.com', 'Recipient 1 <rec1#example.com>',
'This is the subject',
'This is the text',
'noreply#example.com', {},
function(err) {
if (err) {
console.log('Oh noes: ' + err);
res.send('Error occurred');
}
res.send('Email sent');
});
app.listen(3000, function () {
console.log('Example app listening on port 3000!');
});

How to display the values passing using ajax in another php file?

I have written a code to pass values from a form using ajax but the values passed to another php page is not getting displayed there. I want to display the values passed in email.php file and send it as a mail to a email-id.
My script :
$(function() {
$('#send_message').on('click', function(e) {
var name = $('#exampleInputName1').val();
var email = $('#exampleInputEmail1').val();
var tel = $('#exampleInputTelephone1').val();
var cn = $('#exampleInputCountry1').val();
var message = $('#exampleInputMessage1').val();
e.preventDefault();
$.ajax({
type: 'post',
url: 'php/email.php',
data: {
name: name,
email: email,
tel: tel,
cn: cn,
message: message
},
success: function(data) {
alert(message);
}
});
});
});
html page:
<form name="contactForm1" id='contact_form1' method="post" action='php/email.php'>
<div class="form-inline">
<div class="form-group col-sm-12 padd">
<input type="text" class="form-control" name="name" id="exampleInputName1" placeholder="name">
</div>
<div class="form-group col-sm-12 padd">
<input type="email" class="form-control" name="email" id="exampleInputEmail1" placeholder="email address">
</div>
<div class="form-group col-sm-12 padd">
<input type="text" class="form-control" name="telephone" id="exampleInputTelephone1" placeholder="phone">
</div>
<div class="form-group col-sm-12 padd">
<input type="text" class="form-control" name="Country" id="exampleInputCountry1" placeholder="Country">
</div>
<div class="form-group col-sm-12 padd">
<textarea class="form-control" name="message" rows="3" id="exampleInputMessage1" placeholder="message"></textarea>
</div>
</div>
<div class="form-group col-xs-12 padd">
<div id='mail_success' class='success' style="display:none;">Your message has been sent successfully.
</div>
<!-- success message -->
<div id='mail_fail' class='error' style="display:none;">Sorry, error occured this time sending your message.
</div>
<!-- error message -->
</div>
<div class="form-group col-xs-8 padd" id="recaptcha2"></div>
<div class="form-group col-sm-4 padd" id='submit'>
<input type="submit" id='send_message' name="sendus" class="btn btn-lg costom-btn" value="send">
</div>
</form>
email.php
<?php
$temp = $_POST['name'];
echo $temp;
?>
Can anyone suggest how to do this ?

Angular Signup page using ui-router not able to access the html page

I have an angular sign-up page. This is the directory structure of my project:
singUpPage-Angular
bin
bower_components
model
mongodbApp.js
node_modules
**partials
fail.html
main.html
success.html**
public
images
**javascripts
signUp.js**
stylesheets
routes
index.js
users.js
**views
index.ejs**
app.js
package.json
All my html is in partials folder
The javascript controller code is in signup.js
The main html is in views index.ejs.
I have tried to acces the html using the ui router and the code is not working. I am not sure if itis an error with the path or if there is a prolem with ui-router code.
The router does not take me to the page:
When I run the code: on the address bar I get: http://localhost:3000/#/partials/main.html: but nothing from the main page get displayed. I dont seem to get an errors either.
index.ejs
<!DOCTYPE html>
<html ng-app="myApp">
<head>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css">
<link rel='stylesheet' href='/stylesheets/style.css' />
<script src="/angular/angular.js"></script>
<script src="/ui-router/release/angular-ui-router.min.js"></script>
<script src="/javascripts/signUp.js"></script>
</head>
<body ng-controller="myCtrl">
<div ui-view></div>
</body>
</html>
signUp.js
angular.module("myApp",['ui.router'])
.config(function($stateProvider, $urlRouterProvider){
$urlRouterProvider.otherwise('partials/main.html');
$stateProvider
.state('success', {
url: "/success",
templateUrl:'partials/success.html'
})
.state('fail', {
url: '/fail',
templateUrl:'partials/fail.html'
})
})
.controller("myCtrl", function($scope, SignUp,$state){
$scope.clearPerson = function(){
$scope.first = "";
$scope.last = "";
$scope.email = "";
$scope.password = "";
$scope.confirm = "";
$scope.dob = "";
}
$scope.addPerson = function(){
/* console.log($scope.first);
console.log($scope.last);
console.log($scope.email);
console.log($scope.password);
console.log($scope.confirm);
console.log($scope.dob);*/
$scope.person = {
firstName: $scope.first,
lastName: $scope.last,
email: $scope.email,
password:$scope.password,
dateOfBirth: $scope.dob
}
console.log($scope.person);
SignUp.add($scope.person).success(function(res){
$state.go("success");
console.log(res);
}).error(function(res){
$state.go("fail");
console.log("error");
})
}
})
.factory("SignUp", function($http){
return{
add: function(person){
return $http.post('/signup',person);
}
}
})
main.html
<h1>Sign up Page</h1>
<div class="new-container">
<div class="container">
<h3>Create an ID</h3>
<form class="form-horizontal" name="signup" novalidate ng-submit="addPerson()">
<div class="form-group">
<h4>Name</h4>
<label class="col-sm-2 label-control align-text" >First Name</label>
<div class="col-sm-4 text-margin" >
<input name="first" ng-maxlength=50 ng-model="first" type="text" class="form-control" required>
<div class="error"
ng-show="signup.first.$dirty && signup.first.$invalid">
<small class="error"
ng-show="signup.first.$error.required">
Your name is required.
</small>
<small class="error"
ng-show="signup.first.$error.maxlength">
Your name cannot be longer than 50 characters
</small>
</div>
</div>
</div>
<div class="form-group">
<label class="col-sm-2 label-control align-text" >Last Name</label>
<div class="col-sm-4 text-margin">
<input name="last" ng-maxlength=50 ng-model="last" type="text" class="form-control" placeholder="optional">
<div class="error"
ng-show="signup.last.$dirty && signup.last.$invalid">
<small class="error"
ng-show="signup.last.$error.maxlength">
Your name cannot be longer than 50 characters
</small>
</div>
</div>
</div>
<div class="form-group">
<h4>ID and Password</h4>
<label class="col-sm-2 align-text label-control">Username</label>
<div class="col-sm-4 text-margin">
<input name="email" ng-maxlength=56 ng-model="email" type="email" class="form-control" placeholder="Email" required>
<div class="error"
ng-show="signup.email.$dirty && signup.email.$invalid">
<small class="error"
ng-show="signup.email.$error.required">
Your email is required.
</small>
<small class="error"
ng-show="signup.email.$error.maxlength">
Your name cannot be longer than 56 characters
</small>
</div>
</div>
</div>
<div class="form-group">
<label class="col-sm-2 label-control align-text">Password</label>
<div class="col-sm-4 text-margin">
<input name="password" ng-minlength=6 ng-model="password" type="password" class="form-control al" placeholder="Password" required>
<div class="error"
ng-show="signup.password.$dirty && signup.password.$invalid">
<small class="error"
ng-show="signup.password.$error.required">
Your password is required.
</small>
<small class="error"
ng-show="signup.password.$error.minlength">
Your name cannot be atleast 6 characters long.
</small>
</div>
</div>
</div>
<div class="form-group">
<label class="col-sm-2 label-control align-text">Confirm Password</label>
<div class="col-sm-4 text-margin">
<input name="confirm" compare-to="password" ng-model="confirm" type="password" class="form-control" placeholder="Password" required>
<div class="error"
ng-show="signup.confirm.$dirty && signup.confirm.$invalid">
<small class="error"
ng-show="signup.confirm.$error.required">
Password confirmation is required.
</small>
<small class="error"
ng-show="signup.confirm.$error.errorCompareTo">
Your passwords do not match.
</small>
</div>
</div>
</div>
<div class="form-group">
<h4>Date of Birth</h4>
<label class="col-sm-2 label-control align-text">Birthday</label>
<div class="col-sm-4 text-margin">
<input ng-model="dob" type="date" class="form-control" placeholder="MM/DD/YYYY" required>
</div>
</div>
<div class="form-group" >
<div class="col-sm-offset-2 col-sm-10 float-right" >
<button type="submit" class="btn signUp" >Sign Up</button>
<button type="submit" class="btn btn-default" ng-click="clearPerson()">Clear</button>
</div>
</div>
</form>
</div>
</div>
fail.html
<h1>fail</h1>
success.html
<h1>success</h1>

Do this
$urlRouterProvider.otherwise('/');
In State
$stateProvider
.state('main', {
url: "/",
templateUrl:'partials/main.html'
})
This will open your signUpPage