Develop Reference

Using Regex inside a textarea in Angular template driven form

I have a list
list = [
"Nrvana",
"Red Hot Chilli Peppers",
"R.E.M",
"Reef"
]
and on the html I am rendering the contents of this list.
<div *ngFor= "let x of list" > {{x}}
</div>
<hr/>
<div>
<textarea></textarea>
</div>
I also have a textArea , where a user can write anything he/she wants. Here is the tricky part and something I am unable to figure out. If a user uses syntax <<userText>> , a validation error should pop up stating Please use text from list inside <<>>. I can do this part but I can't figure out if I need to make a regex and if yes, please help me with it. Please ask if you need any more information.
p.s this is just something I created to get an idea of my problem, the actual project is a very long one and I am using template-driven forms
Here is a https://stackblitz.com/edit/angular-t4cfqc

Depends how you want to accomplish this and what you are exactly trying to do but you could do something like this
HTML
<textarea [(ngModel)]="textAreaText" [(ngModelChange)]="checkText()"></textarea>
.TS
textAreaText: string;
// ...
checkText() {
const regex = /(?:^|\s)<<(.*?)>>(?:\s|$)/g;
// If you only want to use certain keywords you could do something like this
const regex = /(?:^|\s)<<((keyword1)|(keyword2)|(keyword3))>>(?:\s|$)/g;
if (regex.test(this.textAreaText)) {
// do something
} else {
// do something else
}
}

You can make use of pattern attribute too. Example below
<textarea pattern="/(?:^|\s)<<(.*?)>>(?:\s|$)/g" [(ngModel)]="myTextArea" #myTextAreaModel="ngModel" required></textarea>
<div *ngIf="myTextAreaModel.errors.pattern">Your error msg here</div>

How to post process bound data in angularjs

Is it possible to post process data bound with angularjs?
I am writing simple search page and i have generated results with code:
...
<div class="row" ng-repeat="document in sc.searchResult.content">
<blockquote>
{{document.content}}
</blockquote>
</div>
...
The problem is that I need to bold specific words in every result (the words from query box - like in google below)
How to reach that effect?

controller.js
$scope.document.content = someSearchContent.replace(/<searchTerm>/g, '<strong>' + <searchTerm> + '</strong>')
searchTerm is the string that you need to modify. You can use RegExp() to create a regular expresion.
template
<blockquote ng-bind-html="document.content"></blockquote>

Convert HTML text area value to jqmath formula

I am new to jqmath; I have contained a textarea field in my HTML:
<textarea cols="30" rows="2" id="mathSrc1"></textarea>
I will set mathematical formula in the text area so that it will be displayed in <div> tag:
<div id="mathTgt1"></div>
This code is available in http://mathscribe.com/author/jqmath.html. But I don't know how to use it. Please help me.
Thank you.

i got solution
<input type="textarea" name="formula" id="test_formula" onkeyup="paste_formula()" />
<span id="formula_print"></span>
script code
function paste_formula() {
var val = document.getElementById("test_formula").value;
val = "$$" + val + "$$";
var di = document.getElementById("formula_print");
di.innerHTML = val;
M.parseMath(di);
}

I like Nathan's question - what exactly are you trying to do? The normal case is to have some math in your static web page, which you just surround with $s and it gets parsed and formatted at load time. If you want to create mathematical expressions dynamically (after load time), see Jqmath - apply after page load. You can also look at the jqmath source to see how http://mathscribe.com/author/jqmath.html does it. All these methods end up calling the same functions to do the actual work (parsing and formatting).

Input HTML into included index page

I am trying to improve an old website which has been created by having one index.php
Which is behaving like a parent to several sub sites which then
insert their specific contents into the parent using javascript (getElement, add all sorts of content and then appendChild).
This results in a huge code to just create a little form, which can be done far neater with HTML.
Thus my question;
how can I input HTML content into a parent file's elements without creating these contents all with javascript?
I am looking for a solution like:
<?php
include_once('index.php');
?>
<ul id="nav">
<li class="navi">Log uit</li>
</ul>
<script>
somehow insert newly created unsorted list "nav" into the included index.php
</script>
I hope I have formulated my question clearly and am looking forward to your answers!

I thing best to use angularJs for this.

I have found what I was looking for, it was innerHTML
This way I can simply type an HTML code inside javascript which is then inputted into the included php as I wanted.
Example;
document.getElementById('databox').innerHTML =
'<div class = "selectform">' +
'<form id="login" method="post" action="requestklant.php">' +
'<select name="klantdropdown"></select>' +
'<button type="submit">Opvragen</button>'+
'</form>' +
'</div>';
Thank you for your suggestions and effort, though.

How can i use html tags in javascript

I wrote an ajax program.when i am getting response, at that time i will display
that content in my web page using html tags.
So how can I use html tags in javascript?

A sample data you get from server, and a sample html you want to add would make it easier for people to help you.
The basic steps are
1.Get a reference to the html node you want to put the new data in. There are multiple strategies to get reference to the node. If it has an id, it's most starightforward.
2.set innerHTML property.
eg
var node = document.getElementById("targetNode");
node.innerHTML = "<div>data</div>";

Well... Not much detail so not much of an answer...
Easy way
document.write("<body> <div> this is on my page! </div> </body>
or you can edit the innerhtml of an element to place things inside it
document.getElementById("id").innerHTML = "<div>This is inside my element with id="id" </div>"
Answers the question, no?

Instead of embedding html into javascript, you could make a bunch of predefined javascript functions and then use them outside of the script tags. For example, here's how to display a picture while still using the javascript functions.
<html>
<script type="text/javascript">
function display_message()
{
alert("This is a message.");
};
</script>
<body>
<img src="image.jpg">
<form>
<input type="button" value="Click me!" onclick="display_message()" />
</form>
</body>
</html>

I know this is an old post, but this could be helpful...
Using jquery is great way to combine html elements with script
Note: This would be used in the body, if using it in the be sure to enclose it in
$(document).ready (function(){ YOUR CODE });
// Create an object:
var url = {
link: "https://stackoverflow.com/questions/2834929/how-can-i-use-html-tags-in-javascript"
};
// Display URL object:
$('#panel').html('<a href=' + url.link + '>' + url.link + '</a>');
//Note: the # denotes id, if you want to use a class it would be:
//$('.panel').html('<a href=' + url.link + '>' + url.link + '</a>');
//your html would be: <div id="panel"></div> or whatever you choose ie <p> and so //forth