CODEWITHSUNDEEP
javascripthtmlsearchweb
Matthew W.
Matthew W.

Reputation: 409

Searching for text with JavaScript

I've been trying to get this code to work:

<!DOCTYPE html>
<html>
<body>
<input name="paragraph" id="paragraph" value="Paste your paragraph here!" style="width: 800px; height: 100px;"><br>
<input name="search" id="search" value="(Case sensitive) Text to search for" style="width: 400px;"><br>
<button type="button" onclick="myFunction()">Find text</button><br>
<script>
function myFunction() {
    text = document.getElementById("paragraph");
    var textSearch = document.getElementById("search");
var hits = [];


for(var i = 0; i < text.length; i++) {
    if(text[i] == "J"){
    for (var j = i; j < (textSearch.length + i); j++) {
        hits.push(text[j]);
    }

    if (hits === 0) {
        alert('Your name isn't here')
    } else {
        alert(hits);
    }
}
</script>
</body>
</html>

Basically, what it's trying to do is for the user to enter a paragraph or big chunk of text into the top box, then some text they're trying to search for in the lower box. Then hit a button and it displays where in the code that it is (by telling the user how many characters it went through, until it hit what they were searching for). If you could improve it, or show me something from scratch that would be better!

Upvotes: 0

Views: 3934

Answers (1)

Oki Erie Rinaldi
Oki Erie Rinaldi

Reputation: 1863

Here's the fixed version of yours :D

<!DOCTYPE html>
<html>
<head>
<title>
Cari teks
</title>
<script>
function myFunction() {
    var text = document.getElementById("paragraph").value;
    var textSearch = document.getElementById("search").value;

var hits = [];
var kata = text.split(" ");
var jmlkata =  kata.length;
var i = 0;
for (i=0;i<=jmlkata-1;i++){
    if (textSearch == kata[i]){
    hits.push(kata[i]);
    }
}
var jmlfound = hits.length;
      alert("found : "+jmlfound);

}
</script>
</head>
<body>
<textarea name="paragraph" id="paragraph" style="width: 800px; height: 100px;" > 
</textarea><br>
<input name="search" id="search" style="width: 400px;"><br>
<button type="button" onclick="myFunction()">Find text</button><br>
</body>
</html>

I'm sorry about the words/language, some parts of this using Bahasa Indonesia, but it won't be a matter.
I replace your large text input with a textarea, So it would be more powerfull to have long text.
The search engine of this works looking for 1 (one) word only. So you have to develop this script.
just use it as a reference, may it helps :D

Upvotes: 2

Related Questions