1
einige Benutzer (einschließlich mir) sehen das Registerformular überhaupt nicht - besonders in Chrom. ersteMeteor: Registerform wird manchmal nicht richtig dargestellt
Bitte schauen Sie in Firefox: http://openstrategynetwork.com/joinus
Was in Chrome passiert:
Die Schaltflächen und Eingabefelder erst beginnen, die auftreten, wenn Sie den Bereich schweben über dem:
Oder alles erscheint, wenn die Größe des Browserfensters geändert wird.
Die seltsamsten - und ein bisschen gespenstisch - was ist, wenn ich wieder nach oben bewegen, ich habe das Anmeldeformular im Hintergrund zu sehen:
ich das useraccounts Paket mit bin.
Hinweis: Hier ist die all source.
Meine Konfigurationsdatei (config/at_config.js):
// Options
AccountsTemplates.configure({
// preSignUpHook: function (error, state) {
// console.log("love");
// },
// defaultLayout: 'emptyLayout',
focusFirstInput: false,
showForgotPasswordLink: true,
overrideLoginErrors: true,
enablePasswordChange: true,
sendVerificationEmail: true,
// enforceEmailVerification: true,
//confirmPassword: true,
//continuousValidation: false,
showLabels: false,
//forbidClientAccountCreation: true,
//formValidationFeedback: true,
homeRoutePath: '/',
redirectTimeout: 2000,
//showAddRemoveServices: false,
showPlaceholders: true,
negativeValidation: true,
positiveValidation: true,
negativeFeedback: true,
positiveFeedback: true,
// Privacy Policy and Terms of Use
//privacyUrl: 'privacy',
//termsUrl: 'terms-of-use',
texts: {
sep: "OR REGISTER with your social account:",
title: {
signUp: "REGISTER by creating a new account:"
},
button: {
signUp: "REGISTER"
},
socialSignUp: "",
socialWith: ""
}
});
var submitFunction = function(error, state){
// if (!error) {
// if (state === "signIn") {
// // Successfully logged in
// console.log("hook logged in");
// }
// if (state === "signUp") {
// // Successfully registered
// console.log("hook singup");
// }
// }
};
// remove fields and add them back in the right order
AccountsTemplates.removeField('email');
AccountsTemplates.removeField('password');
//all register fields
AccountsTemplates.addFields([
{
_id: 'firstName',
type: 'text',
placeholder: "First Name*",
required: true,
re: /^[^\d]{2,}$/i,
errStr: "Please enter your first name.",
},
{
_id: 'lastName',
type: 'text',
placeholder: "Last Name*",
required: true,
re: /^[^\d]{2,}$/i,
errStr: "Please enter your last name.",
},
{
_id: 'email',
type: 'email',
placeholder: "Email Address*",
required: true,
displayName: "email",
re: /[email protected](.+){2,}\.(.+){2,}/,
errStr: 'Invalid email',
},
{
_id: 'institution',
type: 'text',
placeholder: "Institution/Company*",
required: true,
// re: /^[^\d]{2,}$/i,
minLength: 2,
errStr: "Please enter the institution or company you work for.",
},
{
_id: 'interests',
type: 'text',
placeholder: "Interests regarding Open Strategy*",
required: true,
re: /^[^\d]{2,}$/i,
errStr: "Please enter the your interests in the institution/company.",
template: 'interests'
},
{
_id: 'position',
type: 'text',
placeholder: "Position",
re: /^[^\d]{2,}$/i,
errStr: "Please enter the your position in the institution/company.",
},
{
_id: 'uploadProfile',
type: 'text',
template: 'uploadInput'
},
{
_id: 'password',
type: 'password',
placeholder: "Password*",
required: true,
minLength: 6,
errStr: 'Password must be at least six characters long',
},
{
_id: 'password_again',
type: 'password',
placeholder: "Confirm Password*",
required: true,
minLength: 6,
errStr: 'Password must be at least six characters long',
}
]);
Meine Helfer-Datei (Client/templates/Konto-templates/joinus.js):
Template.joinUs.onRendered(function() {
// if scrolling is necessary $("html, body").animate({ scrollTop: 0 });
window.scrollTo(0, 0);
// SCRIPT
setInterval(function(){
if(window.location.href.split('/').pop()=='joinus'){
var pswVal = $("[name='at-field-password']")[0].value;
var pswValL = pswVal.length;
var pswAVal = $("[name='at-field-password_again']")[0].value;
var pswAValL = pswAVal.length;
if(pswVal==pswAVal && pswValL>5 && pswAValL>5){
$('.form-group:eq(15) .glyphicon.glyphicon-remove.form-control-feedback').removeClass('glyphicon-remove').addClass('glyphicon-ok').css("color","green");
$('.form-group:eq(15) .help-block').addClass('hide');
$("[name='at-field-password_again']").css({"border-style":"solid", "border-color":"green"})
}else{
$("[name='at-field-password_again']").css({"border-style":"", "border-color":""});
$('.form-group:eq(15) .glyphicon.glyphicon-remove.form-control-feedback').removeClass('glyphicon-ok').css("color","");
$('.form-group:eq(15) .help-block').removeClass('hide');
}
}
}, 10);
});
Template.joinUs.events({
'click .js-scrollToForm': function (evt, tpl) {
evt.preventDefault();
$('html, body').animate({
scrollTop: $('#js-scrollStop').offset().top - 35
}, 2000);
}
});
Meine HTML-Datei (Client/templates/Konto-templates/joinus.html):
<template name="joinUs">
<!-- Stage -->
<header>
<div class="header-content">
<!-- Breadcrumb -->
<ol class="breadcrumb text-left">
<li><a class="breadcrumb-link" href="{{pathFor route = 'home'}}">Home</a></li>
<li class="active">Join us</li>
</ol><!-- End of Breadcrumb -->
<div class="header-content-inner">
<h1>YOUR BENEFITS</h1>
<hr>
<h2>As a member of OSN you will become part of a thriving network of scholars interested in open strategy. There are many advantages of joining the OSN. Registration is free.</h2>
<button type="button" href="#joinus" class="btn btn-primary btn-xl page-scroll js-scrollToForm">JOIN US</button>
</div>
</div>
</header> <!-- ./Stage -->
<!-- Services Section -->
<section id="services">
<div class="container">
<div class="row text-center extra-spacing-top extra-spacing-bottom joinus-icons">
<div class="col-sm-4">
<span class="fa-stack fa-4x">
<!-- <i class="fa fa-circle fa-stack-2x"></i> -->
<i class="fa fa-bullhorn fa-stack-1x fa-inverse"></i>
</span>
<h4 class="service-heading">News</h4>
<p class="text-muted">As a member you can submit news to the whole Open Strategy community and disseminate related research findings.</p>
</div>
<div class="col-sm-4">
<span class="fa-stack fa-4x">
<!-- <i class="fa fa-circle fa-stack-2x text-primary"></i> -->
<i class="fa fa-comments-o fa-stack-1x fa-inverse joinus-icons"></i>
</span>
<h4 class="service-heading">Collaborations</h4>
<p class="text-muted">Collaborate internationally by searching for data on OSN members.</p>
</div>
<div class="col-sm-4">
<span class="fa-stack fa-4x">
<!-- <i class="fa fa-circle fa-stack-2x text-primary"></i> -->
<i class="fa fa-newspaper-o fa-stack-1x fa-inverse"></i>
</span>
<h4 class="service-heading">Literature</h4>
<p class="text-muted">Search for Open Strategy literature on specific topics within the Bibliography</p>
</div>
</div>
</div>
</section>
<!-- <div id="js-scrollStop"></div> -->
<!-- Registration Form -->
<section class="bg-light-gray extra-spacing-top" id="js-scrollStop">
<div class="container">
<form>
{{> atForm state='signUp'}}
</form>
</div>
</section>
</template>
EDIT:
Dank @ Jeremy Iglehart der Fehler kann bis zu dieser Datei gekocht werden:
Client/templates/Konto-templates/at_form_mod.html:
<template name="myAtForm">
{{#unless hide}}
<div class="at-form">
<!-- {{#if showTitle}}
{{> atTitle}}
{{/if}} -->
{{#if showError}}
{{> atError}}
{{/if}}
{{#if showResult}}
{{> atResult}}
{{/if}}
{{#if showPwdForm}}
{{> atPwdForm}}
{{/if}}
{{#if showTermsLink}}
{{> atTermsLink}}
{{/if}}
{{#if showSignUpLink}}
{{> atSignupLink}}
{{/if}}
<!-- {{#if showServicesSeparator}}
{{> atSep}}
{{/if}} -->
{{#if showOauthServices}}
{{> atOauth}}
{{/if}}
<!-- {{#if showSignInLink}}
{{> atSigninLink}}
{{/if}} -->
</div> <!-- end main div -->
{{/unless}}
</template>
Die .Weniger Datei finden Sie hier (zu lang, um hier einzufügen): client/templates/styles/styles.less
Amir, Zunächst einmal - tolles Design ... weiter so, Sie werden dort ankommen. Das fühlt sich für mich wie ein schelmisches CSS-Problem an, nicht wahr? Etwas wird versteckt oder etwas eingestellt. Hast du irgendwelche CSS drin, die das machen könnten? –
Es sieht aus wie https://github.com/OpenStratNet/OSN/blob/master/client/templates/account-templates/at_form_mod.html ist, wo Ihr Problem sein könnte - die '{{#unless hide}} und unter dem, wo Sie die {{#if 'showOauthServices}}' wo definieren Sie 'verstecken' und' showOauthServices'? –
@ JeremyIglehart: Danke für Ihre motivierenden Worte. Sehr nett von dir :) Obwohl ich dachte, nach diesem Projekt aufhören zu programmieren :(Leider weiß ich nicht, wo dies definiert ist. Es ist in der Useraccounts-Paket. Aber es ist schon ein guter Hinweis. Vielen Dank :) Amir PS: Ich frage mich nur, warum Chrome Probleme hat –