I have a simple text input in which I only want to allow floats and ints (watch out: jade)
input.form-control(type="text", ng-model='usd', ng-pattern="nums",ng-change='convert_to_btc()', placeholder="USD")
However it doesn't work, I can always insert any character in the input (do I need to do more in order to display something? e.g. a red border if it's incorrrect? or should then just those characters not even be able to be entered?)
The pattern is a regex and thus not a string, so that should be fine???
Here's the controller:
app.controller("AppCtrl", function AppCtrl($scope, $http, $interval ) {
//lots of other stuff
$scope.nums = /^\-?\d+((\.|\,)\d+)?$/; //note no string, it's a regex
}
This is the generated HTML. Could this be the problem? The generated HTML actually has a string, not a regex!?
<input type="text" ng-model="usd" ng-pattern="/^\-?\d+((\.|\,)\d+)?$/" ng-change="convert_to_btc()" placeholder="USD" class="form-control ng-dirty ng-valid-parse ng-touched ng-invalid ng-invalid-pattern">
I hope this is what you are trying to do.
Please have a look at the below link
http://plnkr.co/edit/BGzLbQHy0ZtHYmom8xA3
<!DOCTYPE html>
<html ng-app="">
<head>
<script data-require="angular.js#1.3.x" src="https://code.angularjs.org/1.3.13/angular.js" data-semver="1.3.13">
</script>
<style>
.ng-invalid-pattern {
border:1px solid #f00;
}
</style>
</head>
<body>
<p>Hello</p>
<form name='myform'>
<input type="text" name='ip' ng-model="usd" ng-pattern="/^\-?\d+((\.|\,)\d+)?$/"
ng-change="convert_to_btc()" placeholder="USD"/>
<p ng-show='myform.ip.$invalid'>Error</p>
</form>
</body>
</html>
If you are trying to block the user from being able to enter character/letters and only allowing them to enter numbers into the input, then change the <input type="text" to <input type="number"
Here's a link to the Angular Doc page on inputs that should only allow numbers: input[number]
Related
I recently setup associated domains and added password autofill, but I am now wondering how I can autofill their first and last name as seen on some webpages such as below in HTML:
<!DOCTYPE html>
<html>
<head>
<script>
function formSubmit() {
document.forms["myForm"].submit();
}
</script>
</head>
<body>
<h1>The form name attribute</h1>
<form name="myForm" action="/action_page.php" method="get">
<label for="fname">First name:</label>
<input type="text" id="fname" name="fname"><br><br>
<label for="lname">Last name:</label>
<input type="text" id="lname" name="lname"><br><br>
<input type="button" onclick="formSubmit()" value="Send form data!">
</form>
<p>Notice that the JavaScript in the head section uses the name of the form to specify which form to submit.</p>
</body>
</html>
If you are on iPhone and tap in the textbox above, it shows you your first name in some cases for a quick autofill. Now my questions is, how can I use swiftUI to produce to same concept as above.
Here is my code in SwiftUI so far:
#State var displaynamefirst = ""
TextField("First Name",text:self.$displaynamefirst)
.autocapitalization(.words)
.padding()
.background(RoundedRectangle(cornerRadius:6).stroke(Color("Dominant"),lineWidth:2))
.padding(.top, 0)
.submitLabel(.done)
For TextField you can use the .textContentType(_:) modifier.
documentation
One of the content types available in the UITextContentType structure that identify the semantic meaning expected for a text-entry area. These include support for email addresses, location names, URLs, and telephone numbers, to name just a few.
list of possible contentTypes
Example:
TextField("First Name",text:self.$displaynamefirst)
.autocapitalization(.words)
.padding()
.textContentType(.givenName)
.background(RoundedRectangle(cornerRadius:6).stroke(Color("Dominant"),lineWidth:2))
.padding(.top, 0)
.submitLabel(.done)
I need to include jinja templating in element.innerHTML but jinja is not working.
Code script.js:
contentDiv.innerHTML = getContent(fragmentId);
function getContent(fragmentId) {
var pages = {
quad1: `
<form class="form-inline" method="POST" id="form1">
<h3>
<input type="number" id="quad_a1" name="input_a" class="form-control mx-2 col-1" placeholder="a">
<b>x² +</b>
<input type="number" id="quad_b1" name="input_b" class="form-control mx-2 col-1" placeholder="b">
<b>x +</b>
<input type="number" name="input_c" class="form-control mx-2 col-1" placeholder="c">
<b>=</b>
<input type="number" name="input_d" class="form-control mx-2 col-2" placeholder="Default(0)">
<button type="submit" class="btn btn-primary float-right mr-5" onclick="return empty_quad()">Solve</button>
</h3>
</form>
{{ sol }}
`,
.
.
.
};
return pages[fragmentId];
}
But the output is literally {{ sol }}, not the value of sol:
So how to access the variable sol passed through flask's render_template() in script.js?
You can't use jinja2 template in your js file.
First method: You have to use inline javascript in html file using <script></script> tag, and then you can access the sol variable by assigning it to javascript variable
<script> sol = "{{sol}}" </script> // {{sol}} should be between quotation marks
Second method: If you have seperate js file. you can make a div tag, define it's class and set it's id to {{sol}}. get the element by class name and then get it's id.
Html
<div class="myclass" id="{{sol}}" style="display:none"></div>
javascript
elem= document.getElementsByClassName("myclass") ;
console.log(elem.id) // this is the sol value.
json_script
Safely outputs a Python object as JSON, wrapped in a <script> tag, ready for use with JavaScript.
Argument: HTML “id” of the <script> tag.
For example:
{{ value|json_script:"hello-data" }}
If value is the dictionary {'hello': 'world'}, the output will be:
<script id="hello-data" type="application/json">{"hello": "world"}</script>
The resulting data can be accessed in JavaScript like this:
const value = JSON.parse(document.getElementById('hello-data').textContent);
XSS attacks are mitigated by escaping the characters “<”, “>” and “&”. For example if value is {'hello': 'world</script>&'}, the output is:
<script id="hello-data" type="application/json">{"hello": "world\\u003C/script\\u003E\\u0026amp;"}</script>
This is compatible with a strict Content Security Policy that prohibits in-page script execution. It also maintains a clean separation between passive data and executable code.
django doc
I would know if it's possible to find all elements that match a certain string, using xpath.
For example, suppose I have this page:
<html>
<head>
<title></title>
</head>
<body>
<form id="form1">
</form>
<p class="test"></p>
<p class="test"></p>
<p class="test"></p>
<p class="test"></p>
</body>
</html>
If I search for this string<form id="form1"> I would get the first form element, instead if I search for this string <p class="test"></p> I would get all the paragraphs elements. Is it possible?
Something like //*[matches(., string)]
I'm at the beginning, so any suggestions will be appreciated.
Try this using xpath :
//form[#id="form1"]
Output :
<form id="form1">
</form>
The rest :
//p[#class="test"]
and if you want a partial match :
//p[contains(#class, "tes")]
I'm trying to autoformat an input tag to display decimal places.. I first thought that maybe I should use Javascript but after some research I discovered that it could be done using html5 specifically using the pattern attribute. I was told that you can assign a regex expression in it but I could not find any.
this is my input tag
<input type='text' name='amount' id='amount'/>
you could use the 'number' type
<style>
input:valid +p { display:none }
input:invalid +p { display:block }
</style>
<form>
<input type="number" min="0.5" max="3.14" step="0.01" required ></input>
<p>Must be provided and be a decimal.</p>
</form>
To test a xss attack,i have the following code :
<html>
<head><title>test xss</title></head>
<body>
<input type="text" id="my_user_name_show" value="">
<script>
var s = '"/><script>alert(\'xss\');</script><br class="';
document.getElementById('my_user_name_show').value= s;
</script>
</body>
</html>
why can't the code trigger the alert(xss)?
XSS attacks against input form values have to be triggered from the backend when the actual HTML is changed, thus causing
<input type="text" id="my_user_name_show" value=""/>
<script>alert('xss');</script>
<br class="">
to be written, which obviously will cause it to trigger an alert. On the other hand your code will simply cause
<input type="text" id="my_user_name_show" value="\"/><script>alert('xss');</script><br class=\"">
to be placed inside the DOM, thus not causing any alert, because no script element is added to the DOM.