I want to overwrite password pattern provided by foundation(zurb) but its not identifying my overwritten regular expression and generated error according to its by default expression.
By default,passwords validation provided by foundation is "must be at least 8 characters with 1 capital letter, 1 number, and one special character".
For that I have used following:
1)
<head>
<script>
$(document)
.foundation()
.foundation('abide', {
patterns: {
new: ^[a-zA-Z]\w{3,14}$,
}
});
</script></head>
<body>
<form class="custom" data-abide>
<div class="row">
<div class="large-12 columns">
<label>Password <small>required</small></label>
<input type="password" pattern="new" required >
<small class="error" data-error-message="">validation error.</small>
</div>
</div>
</form>
</body>
2)
<form class="custom" data-abide="">
</form>
3)Directly used pattern in input tag:
<input type="password" pattern="^[a-zA-Z]\w{3,14}$" required >
But all these are not working.Please suggest me something to resolve my problem.
You can find the sample program - here
Update the value before running foundation:
<script>
Foundation.libs.abide.settings.patterns.password = /^\w{3,14}$/;
$(document).foundation();
</script>
Replacing pattern called password does the trick. Change
<script>
$(document).foundation();
</script>
at the bottom of index.html to the following code:
<script>
$(document)
.foundation()
.foundation('abide', {
patterns: {
password: /^\w{3,14}$/,
}
});
</script>
Note that the regex you provided (^[a-zA-Z]\w{3,14}$) should be written as /^[a-zA-Z]\w{3,14}$/ in JavaScript.
Related
I want to autosave the content of tinyMce editor
I'm using tinmce version 5.2.2 with laravel V7
tinymce configuration in app.js
require('./bootstrap');
require('tinymce/themes/silver');
require('tinymce/plugins/image');
require('tinymce/plugins/code');
require('tinymce/plugins/save');
import tinymce from 'tinymce';
tinymce.init({
selector:'textarea#inputQuestionTitle',
height:400,
setup: function(editor) {
editor.on('Change Keyup', function () {
editor.save();
//tinyMCE.triggerSave() <-- also tried
});
}
With following View
#extends('dashboard.layout')
#section('content')
<form id='addQ' action="{{route('questions.store')}}" method="post" enctype="multipart/form-data" >
#csrf
<div class="form-row align-items-center " >
<div class="col-md-12">
<label class="sr-only" for="inputQuestionTitle">Title</label>
<textarea name="title" class="form-control mb-2 " id="inputQuestionTitle" placeholder="Question Title"> </textarea>
</div>
</div>
<div class="form-row">
<button type="submit" class="btn btn-primary mb-2">Add new category </button>
</div>
</form>
<script type="text/javascript" src="{{asset('js/app.js')}}"></script>
<script type="text/javascript">
$(function(){
$('#addQ').submit(function(e){
e.preventDefault();
var frmdata = $(this).serialize();
console.log(frmdata);
});
});
</script>
#endsection
Outputs
I had using jquery to show input request with console.log
As showed in output title field does not returns any value
Please tell me how i autosave the content of tinymce editor and send it with input request ..
I had also tried to tinymce.triggerSave() before serialize() method of ajax so that input request will take tinymce content but not works
Instead of trying to update the textarea via the triggerSave() or save() methods while someone is editing the content I would just place tinymce.triggerSave() at the very beginning of the function that submits the page. This will ensure that the triggerSave() is called directly before you grab the content from the textarea.
I have given a rough code to understand what I need to perform,
/app/route1/controller.js
export default Controller.extend({
test: function(id) {
$.ajax({
.....
.....
.....
}).then(() => {
set('message','successfully added');
});
}
});
/app/route1/template.hbs
<div class="ui container">
<div class="ui segment"
<button class="ui button" {{action "test" model.id}}>Submit</button>
</div>
</div>
<div class="ui container">
<div class="ui modal">
<div class="header"
Message
</div>
<div class="content"
{{message}}
</div>
<div class="actions">
<div class="ui ok button">OK</button>
</div>
</div>
</div>
<script type="text/javascript">
$.ajax({
if(message) {
$('.ui.modal').modal('show');
}
})
</script>
If I set a message in controller then, I have to show this message in the MODAL. The Ajax command that I've written is not correct., Please help to solve this issue.
Thanks in advance
First, you must not use <script> tags with ember. This won't work as expected and is in no way supported.
If you have to manually access DOM you should use the didInsertElement of a component.
Are you absolutly sure you want to build your modal yourself? There are many addons providing a nice API for modals. If you can use one of them. If you cant you basically have to write your own modal component.
I will not instruct your in detail how to do this, because this seems not to be your primary question.
Now about your test function. first you seem to try to use it as an action:
{{action "test" model.id}}
however for this you must place the function under the actions hash.
Next this line is wrong:
set('message','successfully added');
you either must use this.set('message','successfully added'); or set(this, 'message','successfully added');
Then you can display your message like this:
{{#if message}}
{{#modal-dialog
onClose=(action (mut isShowingBasic) false)
}}
{{message}}
{{/modal-dialog}}
{{/if}}
And it will work as expected.
I want to prepare a site similar to Datacamp or Codeacademy for our students. I made lots of research on code editors and now I use ACE editor. I can operate the ACE editor input but now I need some guidance how to validate and run the code which I text and run.
Until now I have solution to run my code:
<form>
<div id="editor" style="height: 100px; width: 100px"> </div>
<input type="hidden" name="editor" style="display: none;">
<input type="submit" value="Submit">
</form>
<script>
$(function(){
var $editor = $('#editor');
if ($editor.length > 0) {
var editor = ace.edit('editor');
editor.session.setMode("ace/mode/css");
editor.getSession().setMode("ace/mode/javascript");
var input = $('input[name="editor"]');
editor.getSession().on("change", function () {
input.val(editor.getSession().getValue());
console.log(input.val(editor.getSession().getValue()));
$editor.value = editor.getSession().getValue();
});
}
});
</script>
When I type "2+3", I see console result:
2
2+
2+3
What I want is to get the result of the arithmetic operator which is "5".
How can I make it work and If it possible to run Python code?
Thanks
To tun python code you need to either send it to server and evaluate it there or use something like https://github.com/replit/jsrepl
How to design your own parsley.js pattern? Like I want pattern for phone number and CNIC:
Phone number= XXXX XXXXXXX (0321 5464695)
CNIC= XXXXX XXXXXXX X (38560 6665849 1)
You can accomplish this by crafting your own validator.
As the documentation refers, you can do something like this:
<form method="post" action="" id="target">
<input type="text" name="cnic" value="" data-parsley-cnic />
<input type="submit" value="Submit">
</form>
<script type="text/javascript">
$(document).ready(function() {
window.ParsleyValidator
.addValidator('cnic', function (value, requirement) {
var patt = /^\d{5} \d{7} \d{1}$/i;
return patt.test(value);
}, 32)
.addMessage('en', 'cnic', 'This value is incorrect');
$("#target").parsley();
});
</script>
You can see this working with this jsfiddle
I want to access my Powerschool (powerschool.avon.k12.ct.us), and I find the need to type in my password and username every time rather tedious. To try and fix this I downloaded the page's source in Chrome, below:
<!DOCTYPE html>
<!-- saved from url=(0052)http://powerschool.avon.k12.ct.us/guardian/home.html -->
<html><head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Parent Sign In</title>
<meta http-equiv="X-UA-Compatible" content="IE=8">
<meta name="robots" content="noindex">
<link href="./Powerschool_files/screen.css" rel="stylesheet" type="text/css" media="screen">
<meta name="viewport" content="width=device-width">
<script src="./Powerschool_files/jquery-1.4.2.min.js"></script><style type="text/css"></style>
<script language="JavaScript" src="./Powerschool_files/md5.js" type="text/javascript"></script>
<script language="JavaScript" type="text/javascript"><!--
var pskey = "4EDE156E2FAD0F1A427D2AD066530F496ADC3EEA78CE43E70F28053576FD4EA1";
//-->
</script>
<script language="JavaScript" type="text/javascript">
function deleteCookie(cookieName){
var cookieDate = new Date();
cookieDate.setTime(cookieDate.getTime()-1);
document.cookie = cookieName + "=; expires='" + cookieDate.toGMTString()+"'; path=/";
}
deleteCookie("InformAuthToken");
function getURLParameter(name) {
return unescape(
(RegExp(name + '=' + '(.+?)(&|$)').exec(location.search)||[,null])[1]
);
}
var $j = jQuery.noConflict();
$j(document).ready(function() {
// Hide or show the translator login input field
// if the URL parameter "translator" is present
var translator = getURLParameter("translator");
if (translator == "null") {
$j('#translatorInput').hide();
} else {
if (translator == "true") {
$j('#translatorInput').show();
} else {
$j('#translatorInput').hide();
}
}
$j('a.popWin').click(function(){
var winURL = $j(this).attr('href');
window.open(winURL);
return false;
});
});
</script>
</head>
<body class="pslogin" id="palogin">
<div id="container">
<div id="branding-powerschool"><img src="./Powerschool_files/ps7-logo-lrg.png" alt="PowerSchool" width="280" height="41"></div>
<div id="content" class="group">
<form action="./Powerschool_files/Powerschool.htm" method="post" name="LoginForm" target="_top" id="LoginForm" onsubmit="doPCASLogin(this);">
<input type="hidden" name="pstoken" value="2465670387a1nxrEimrKqPMN0c7QbxxKLNZe16PRC">
<input type="hidden" name="contextData" value="4EDE156E2FAD0F1A427D2AD066530F496ADC3EEA78CE43E70F28053576FD4EA1">
<input type="hidden" name="dbpw" value="">
<input type="hidden" name="translator_username" value="">
<input type="hidden" name="translator_password" value="">
<input type="hidden" name="translator_ldappassword" value="">
<input type="hidden" name="returnUrl" value="">
<input type="hidden" name="serviceName" value="PS Parent Portal">
<input type="hidden" name="serviceTicket" value="">
<input type="hidden" name="pcasServerUrl" value="/">
<input type="hidden" name="credentialType" value="User Id and Password Credential">
<h2>Parent Sign In</h2>
<!--box content-->
<div id="noscript" class="feedback-alert" style="display: none;"> To sign in to PowerSchool, you must use a browser that supports and has JavaScript enabled. </div>
<fieldset id="login-inputs" class="group">
<div>
<label>Username</label>
<input type="text" id="fieldAccount" name="account" value="" size="39">
</div>
<div>
<label>Password</label>
<input type="password" name="pw" value="" size="39"><div id="login-help">Having trouble signing in?</div>
</div>
<div id="translatorInput" style="display: none;">
<label>Translator Sign In</label>
<input type="password" name="translatorpw" value="" size="39">
</div>
<div class="button-row">
<button type="submit" id="btn-enter" title="Sign In To PowerSchool Parent Access" value="Enter" border="0">Sign In</button>
</div>
</fieldset>
<!-- box content-->
</form>
</div>
<div id="footer" class="group">
<p>Copyright© 2005 - 2013 Pearson Education, Inc., or its affiliate(s). All rights reserved.</p>
<p id="pearsoncorplink">Join us on Facebook</p>
</div>
</div>
<div id="branding-pearson">
<div id="logo-pearson"></div>
<div id="tagline-pearson"></div>
</div>
<script type="text/javascript">
/**
* Set the page's locale via a request_locale URL parameter. If there is already a URL parameter by
* this name, then substitute it with the passed-in locale. NOTE: This function will actually cause the page
* to be re-submitted with the new locale, so it really should not be used with pages submitted via POST
* requests (if there are any, which I hope there are not).
* #param locale the locale to set (e.g. en_US)
*/
function setPageLocale (locale) {
var c=String (window.location);
var rlpos = c.indexOf("request_locale=");
var afterPart = "";
if (rlpos > 0) {
var afterBegin = c.indexOf("&", rlpos);
if (afterBegin > 0) {
afterPart = c.substring(afterBegin);
}
c = c.substring(0, rlpos-1);
}
var s=(c.indexOf('?') > 0 ? '&' : '?');
var np = c + s + 'request_locale=' + locale + afterPart;
window.location = np;
}
function jsCheck() {
document.getElementById("login-inputs").className = 'group';
}
jsCheck();
</script>
<script>
$j('#noscript').hide();
function jsEnabled() {
if(typeof $j != 'function'){
alert('Developer: This page is missing key components required for functionality!\n\nPossible causes include:\n - Commonscripts might be missing.\n - Page customization might enabled, and incomplete.');
//document.write('<script...');
} else {
$j('#login-inputs').removeClass('hide');
$j("#fieldAccount").focus();
}
}
$j(document).ready(function(){
jsEnabled();
});
</script>
</body></html>
I was wondering if it was possible to directly modify the downloaded source to automatically fill the input boxes (the below block is where I think it would be done) to always fill in the username and pass fields with "myUsername" and "myPassword," or something like that. I tried setting the value of the Input and Username fields, but that (chrome) gave me an, shown here:
No webpage was found for the web address: file:///C:/Users/Me/Desktop/Powerschool_files/Powerschool.htm
Error 6 (net::ERR_FILE_NOT_FOUND): The file or directory could not be found.
Do you guys know how this could be done?
Instead of copying the entire page, it's probably simpler to make a bookmarklet that fills in the form. Just edit a normal bookmark and change the link to be this:
javascript:(function() { document.forms[0].elements[0].value="hi" })()
That will set the value of the first field in the first form. (It may take some experimenting to see which form number and which field number.)
You can probably use Chrome to remember your passwords for you automatically, but what you have should actually work. You just need to change any paths to urls for it to work perfectly. One that you definitely need to change is the form action:
- ./Powerschool_files/Powerschool.htm
+ https://example.com/Powerschool_files/Powerschool.htm
This should allow you to submit directly to that site unless they have a CSRF token in the form that I don't see.