I have a google app engine and I recently decided to add app engine to it. I have gone through the steps, have imported my google project into firebase, added all the initialization code, and some temp functions for logging in and signing up. However, the app never goes past the points where I try to log in. I have been searching everywhere and trying everything I can. I'm sure I'm just missing something small, but could use another set of eyes. Thanks.
Here is my html file:
<!DOCTYPE html>
<html>
<head>
<title>Hello Endpoints!</title>
<script type="text/javascript" src="/js/base.js"></script>
<!-- SCRIPT FOR FIREBASE -->
<script src="https://www.gstatic.com/firebasejs/4.3.1/firebase.js"></script>
<script src="https://www.gstatic.com/firebasejs/4.3.1/firebase-app.js"></script>
<script src="https://www.gstatic.com/firebasejs/4.3.1/firebase-auth.js"></script>
<script src="https://www.gstatic.com/firebasejs/4.3.1/firebase-database.js"></script>
<script type="text/javascript" src="/js/firebaseApp.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<link type="text/css" rel="stylesheet" href="/bootstrap/css/bootstrap.css">
<link type="text/css" rel="stylesheet" href="/bootstrap/css/bootstrap-responsive.css">
<link type="text/css" rel="stylesheet" href="/css/style.css">
</head>
<body>
<div class="container">
<input id="txtEmail" type="email" placeholder="Email">
<input id="txtPassword" type="password" placeholder="Password">
<button id="btnLogin" class="btn btn-action" onclick="loginEvent()">
Log in
</button>
<button id="btnSignUp" class="btn btn-secondary" onclick="signupEvent()">
Sign Up
</button>
<button id="btnLogout" class="btn btn-action hide">
Log out
</button>
<script src="https://www.gstatic.com/firebasejs/4.3.1/firebase.js"></script>
<script>
// Initialize Firebase
var config = {
apiKey: "<API_KEY>",
authDomain: "<PROJECT_ID>.firebaseapp.com",
databaseURL: "https://<DATABASE_NAME>.firebaseio.com",
projectId: "<PROJECT_ID>",
storageBucket: "<BUCKET>.appspot.com",
messagingSenderId: "<SENDER_ID>",
};
firebase.initializeApp(config);
</script>
</div>
<div class="container">
<form action="javascript:void(0);">
<h2>Add Asteroid</h2>
<div><span class="label">Name: </span><input id="asteroidName" /></div>
<div><span class="label">Diameter: </span><input id="asteroidDiam" /></div>
<div>Dimensions:</div>
<div><span class="dimlabel">Length: </span><input id="asteroidLength" /></div>
<div><span class="dimlabel">Width: </span><input id="asteroidWidth" /></div>
<div><span class="dimlabel">Height: </span><input id="asteroidHeight" /></div>
<div><span class="label">Mean Distance From Sun: </span><input id="asteroidDist" /></div>
<div><input id="addAsteroid" type="submit" class="btn btn-small" value="Submit"></div>
</form>
<form action="javascript:void(0);">
<h2>Refresh Asteroids</h2>
<div><input id="listAsteroids" type="submit" class="btn btn-small" value="Refresh"></div>
</form>
<table id="AsteroidTable">
<tr>
<th>Asteroid</th>
<th>Diameter</th>
<th>Dimensions</th>
<th>Mean Distance From Sun</th>
</tr>
</table>
<script type="text/javascript">
function init() {
google.devrel.samples.hello.init('//' + window.location.host + '/_ah/api');
}
</script>
<script src="https://apis.google.com/js/client.js?onload=init"></script>
</div>
</body>
</html>
And here is my FirebaseApp.js:
function loginEvent()
{
const email = document.getElementById('txtEmail');
const pass = document.getElementById('txtPassword');
email.value = "HELLO";
email.value = firebase.app().name;
pass.value = "NO";
firebase.auth().signInWithEmailAndPassword(email, pass)
.catch(function(error) {
// Handle Errors here.
var errorCode = error.code;
var errorMessage = error.message;
if (errorCode === 'auth/wrong-password') {
alert('Wrong password.');
} else {
alert(errorMessage);
}
console.log(error);
});
pass.value = "YES"
}
function signupEvent()
{
const email = document.getElementById('txtEmail');
const pass = document.getElementById('txtPassword');
firebase.auth().createUserWithEmailAndPassword(email, pass).catch(function(error) {
// Handle Errors here.
var errorCode = error.code;
var errorMessage = error.message;
// ...
});
}
I was changing the values of the email and password just to make sure I was reaching that point. printing out the value of firebase.app().name returns [DEFAULT]. I also made sure email/password option was selected in Firebase. Thank you for any help you can provide.
You only need to include https://www.gstatic.com/firebasejs/4.3.1/firebase.js which contains all the modules needed. No need to include all the others: firebase-app.js, firebase-auth.js, etc.
Also signInWithEmailAndPassword and createUserWithEmailAndPassword accept string arguments. You are passing input elements instead. There should errors thrown in the console because of this. So instead of email, pass email.value.
Related
I'm having trouble with learning laravel and decided to ask my question here since I can't find an answer via Google etc.
I am trying to return a client from the database via Id, maybe later via name.
This is my form:
<<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Klant invoeren</title>
<link rel="stylesheet" href="{{asset('css/app.css')}}">
</head>
<body>
<p><<form action="{{route('client/'.$client->id.'/show/')}}"
method="get">
<div class="row">
<div class="col-md-4"></div>
<div class="form-group col-md-4">
<label for="price">Achternaam:</label>
<input type="text" class="form-control" name="id">
</div>
</div>
<div class="row">
<div class="col-md-4"></div>
<div class="form-group col-md-4">
{{csrf_field()}}
<button type="submit" class="btn btn-success" style="margin-
left:38px">Zoek klant</button>
</div>
</div>
</form></p>
</body>
</html>
Which redirects to:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Klant invoeren</title>
<link rel="stylesheet" href="{{asset('css/app.css')}}">
</head>
<body>
<div class="container">
<h2>Voer een klant in</h2><br />
<h1>Showing {{ var_dump($client) }}</h1>
</div>
</body>
</html>`
And this is the show method from the Clientcontroller:
public function show($id)
{
$client = Client::find($id);
return view('clients.show', compact('client'));
}
This is the route I'm using:
Route::get('client/{id}/show','ClientController#show');
Can someone spot my mistake, because I can't after messing with this the last few hours.
EDIT: updated code and added the route, now getting the error that the client variable isn't defined in the
You must echo the client id in the form action. So, remove the inverted comma from $client->id. Use the following code :
<form action="{{action('ClientController#show', $client->id)}}"
method="get">
Additionally, remove backtick from the code. Use the following code :
public function show($id)
{
$client = Client::find($id);
return view('clients.show', compact('client'));
}
In your routes/web.php
Route::get('client/{id}/show','ClientController#show');
In your form:
<form action="{{URL::to('client/'.$client->id.'/show/')}}"
method="get">
In your controller:
public function show($id)
{
$client = Client::find($id);
return view('clients.show', compact('client'));
}
In your Client Controller make sure you use the Model that you are referencing to
Assuming App\Client.php Change it to App\User.php if you are referring to user
ClientController
use App\Client;
public function show($id)
{
$client = Client::find($id);
return view('clients.show', compact('client'));
}
Now you can fetch the client model with $client For example $client->id
Make sure you pass the {id} parameter in the route
I used AdminLTE for Laravel 5.3. But i want to use my login page with connect to we server.
When i replace my code with auth/login.blade.php page, when i put my username and password and connect to web service, after get response from we server, i try to redirect to another page with window.location.href = "/AddStudent";. but page refresh and stay in login page. How must i do? which setting must i change?
<link rel="stylesheet" href="FileOfLogin/css/style.css">
<div class="wrapper">
<div class="container">
<h1>Welcome</h1>
<form class="form">
<input id="username" type="text" placeholder="Username">
<input id="password" type="password" placeholder="Password">
<button id="loginsubmit" type="button" id="login-button">Login</button>
</form>
</div>
<ul class="bg-bubbles">
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
</ul>
</div>
<script src='http://cdnjs.cloudflare.com/ajax/libs/jquery/2.1.3/jquery.min.js'></script>
<script src="FileOfLogin/js/index.js"></script>
<!-- jQuery 2.1.3 -->
<script src="{{ asset ("/bower_components/AdminLTE/plugins/jQuery/jQuery-2.2.3.min.js") }}"></script>
<!-- Sweet Alarm -->
<script src="SweetAlert/sweetalert-dev.js"></script>
<link rel="stylesheet" href="SweetAlert/sweetalert.css">
<script type="text/javascript">
$( "#loginsubmit" ).click(function() {
console.log('111');
var username=$('#username').val();
var password=$('#password').val();
// console.log(username);
// console.log(password);
$.ajax({
type: "POST",
url: "http://79.132.212.50:8080/SchoolServiceWebService/login",
contentType: 'application/json',
data: '{ "username": "'+username+'", "password": "'+password+'" }',
dataType: "json",
success: function (GetResult) {
// console.log(GetResult);
if (GetResult.result) {
console.log(GetResult);
console.log("8888888888888");
window.location.href = "/AddStudent";
// window.location.replace('/AddStudent');
} else {
sweetAlert("خطا", "ورود !!!!!!", "error");
}
},
error: function (xhr, ajaxOptions, thrownError) {
alert(xhr.status);
alert(thrownError);
}
})//ajax
});
</script>
One way to do it is to override the methods in "Auth\LoginController". This way, you can specify your own view and redirect to a custom page. For more information about Laravel Authentication Mechanism, check this oficial page
I have the following problem.
If I put he JavaScript code into the head or body tag, I need to click twice the submit button and then the Ajax form or whatever I need to do it does correctly, but I need to click twice.
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
<title>XXXX</title>
<!--Este es el JS que hace que funcione Phonegap-->
<script type="text/javascript" charset="utf-8" src="js/cordova.js"></script>
<!--JS específicos de Jquery Mobile-->
<script src="js/jquery-1.10.2.min.js"></script>
<script src="js/jquery.mobile-1.4.2.min.js"></script>
<!--Estos son script creados para la aplicacion-->
<script src="js/md5.js"></script>
<script src="js/login.js"></script>
<!--CSS del tema que he creado para apotecalia-->
<link rel="stylesheet" href="themes/XXXX.css" />
<link rel="stylesheet" href="themes/jquery.mobile.icons.min.css" />
<link rel="stylesheet" href="css/jquery.mobile.structure-1.4.2.min.css" />
</head>
<div id="login">
<div data-role="header" data-position="fixed">
</div>
<div data-role="content">
<form id="check-user" data-ajax="false">
<fieldset>
<div data-role="fieldcontain">
<label> Usuario </label>
<input type="text" id="correo" name="correo">
</div>
<div data-role="fieldcontain">
<label> Contraseña </label>
<input type="password" id="pwd" name="pwd" >
</div>
<input type="submit" data-role="button" value="Acceder" name="enviar" id="enviar">
</fieldset>
</form>
</div>
<div data-role="footer" data-position="fixed">
</div>
</div>
</body>
</html>
Login.js
$(function () {
$('#enviar').click( function() {
if($('#correo').val().length > 0 && $('#pwd').val().length > 0){
alert($('#correo').val() + $('#pwd').val());
}
});
});
But if I put the script code into the tag page where I need to use it, I don't need to click twice, but I cannot get the data form to do my Ajax request.
The same code, but if I put the script code into data-role="page" I have to put this code into all the tags... The alert in this case is empty.
<div id="login">
<script src="js/login.js"></script>
<div data-role="header" data-position="fixed">
</div>
<div data-role="content">
Please I don't know how to do it, I tried two weeks fixing this, I need your help.
Add simple type="button" instead of type="submit" .
<input type="button" data-role="button" value="Acceder" name="enviar" id="enviar">
$(function () {
$('#enviar').click( function() {
if($('#correo').val().length > 0 && $('#pwd').val().length > 0){
alert($('#correo').val() + $('#pwd').val());
// Add code here submit form data using Ajax
var ajax_call = your_serviceURL;
var str = $('#check-user').serialize();
$.ajax({
type: "POST",
url: ajax_call,
data: str,
dataType: "json",
success: function(response){
// It's success json response
}
}).done(function() {
})
}
});
});
Include your script in the head tag.
Declare your page container <div data-role="page" id="login">.
Change your code in login.js to:
$(document).on("pageinit", "#login", function(event, ui)
{
$(document).on("click", "#enviar", function(event)
{
if ($('#correo').val().length > 0 && $('#pwd').val().length > 0)
alert($('#correo').val() + $('#pwd').val());
});
});
I must create ModalPopupExtender. for this, I create one simple application and all my expectation wrok. But when i add my popup in master page it doesn't work, How I can fix this problem?
my popup
<asp:Button ID="Button1" runat="server" Text="Click here to show iframe in modalpopup" />
<asp:ModalPopupExtender ID="ModalPopupExtender1" BackgroundCssClass="ModalPopupBG"
runat="server" CancelControlID="btnCancel" OkControlID="btnOkay" TargetControlID="Button1"
PopupControlID="Panel1" Drag="true" PopupDragHandleControlID="PopupHeader">
</asp:ModalPopupExtender>
<div id="Panel1" style="display: none;" class="popupConfirmation">
<iframe id="frameeditexpanse" frameborder="0" src="InnerPage.aspx" height="161">
</iframe>
<div class="popup_Buttons" style="display: none">
<input id="btnOkay" value="Done" type="button" />
<input id="btnCancel" value="Cancel" type="button" />
</div>
</div>
my script in InnerPage.aspx
<script language="javascript" type="text/javascript">
function okay() {
window.parent.document.getElementById('btnOkay').click();
}
function cancel() {
window.parent.document.getElementById('btnCancel').click();
}
</script>
place this script on same page with extender
<script type="text/javascript">
function clickOk() {
$get("<%= btnOkay.ClientID %>").click();
}
function clickCancel() {
$get("<%= btnCancel.ClientID %>").click();
}
</script>
and instead of parent.window.document.getElementById().click() use parent.window.clickOk() and parent.window.clickCancel()
I am using the following technologies:
- jQuery Mobile 1.0.1
- Phonegap 1.3.0
- Xcode 4.2
When I try to submit form data to a remote server, I get success using the application through the browser.
When I try to submit form data to a remote server using the application natively, I can not send.
I need some plugin PhoneGap?
I need some setup Xcode?
The following sample code was run on the iPhone Simulator 5.0:
<html>
<head>
<title>Page Title</title>
<link rel="stylesheet" href="scripts/jquery.mobile-1.0.min.css" />
<script type="text/javascript" src="scripts/jquery.js"></script>
<script type="text/javascript" src="scripts/jquery.mobile-1.0.min.js"></script>
<script>
$(document).ready(function() {
$('#loginForm').submit(function() {
$('#output').html('Connecting....');
var postTo = 'http://myserver/login.php';
$.post(postTo,{username: $('[name=username]').val() , password: $('[name=password]').val()} ,
function(data) {
if(data.message) {
$('#output').html(data.message);
} else {
$('#output').html('Could not connect');
}
},'json');
return false;
});
});
</script>
</head>
<body>
<!-- Start of first page -->
<div data-role="page" id="foo">
<div data-role="header">
<h1>Foo</h1>
</div><!-- /header -->
<div data-role="content">
<p id="output"></p>
<form method="post" id="loginForm">
Username: <input type="text" name="username"> <br /> <br />
Password: <input type="password" name="password"> <br />
<input type="submit" value="Login">
</form>
</div><!-- /content -->
<div data-role="footer">
<h4>Page Footer</h4>
</div><!-- /header -->
</div><!-- /page -->
</body>
</html>
In my server: (login.php)
<?php
if(isset($_POST['username']) and isset($_POST['password'])) {
if ($_POST['username'] == 'test' and $_POST['password'] == 'test') {
$data['success'] = true;
$data['message'] = 'Login succesful';
} else {
$data['success'] = false;
$data['message'] = 'Login failed';
}
// return json
echo json_encode($data);
}
?>
Does anyone have any idea how to solve this problem?
Both PhoneGap and jQuery Mobile examples use AJAX request not $.post.
This blog entery uses $.ajax and jQuery Mobile
http://www.giantflyingsaucer.com/blog/?p=1948
This this other one uses a XMLHttpRequest:
http://wiki.phonegap.com/w/page/42450600/PhoneGap%20Ajax%20Sample
Hopefully that gets you pointed in the right direction.
I don't know if it's helpful but your PHP uses "and" on line 4 but I think it should use && to test if the posted variables are both called test.