Pablo Juarez
Pablo Juarez

Reputation: 3

Uncaught ReferenceError: function is not defined

I've been having a problem calling a function declared in an external .js file. I've made an include of the .js file in the main page, but apparently it works in part (Just one function it is called correctly, the others generate an "Uncaught ReferenceError: function is not defined ")

Here's the Js file:`

<script type="text/javascript">

var maxAmount = 170;
// Modify the counter textField by given the textField to control and his counter

function textCounter(id_Tf, id_Cd) {
    // Method that is called succesfully
    var element = document.getElementById(id_Tf);   
    var nameLenght  = element.value.length;    
    var countDisplay = document.getElementById(id_Cd);  
    if(nameLenght <= maxAmount){
        countDisplay.value = maxAmount - nameLenght;
    }
    else{
        countDisplay.value = "0";
}


function titleShow(){
    theTitle = val('title').replace(/^\s+|\s+$/g,"");
    get('out_title').innerHTML = theTitle;
    if(get('check_bold').checked == true){
        highlightTerms('out_title');
    }
}

function snippetShow(){
    console.log("I've entered here");
    theSnippet = val('description').replace(/^\s+|\s+$/g,"");
    if(theSnippet.length + dateLength <= 156){
        get('out_snippet').innerHTML = theSnippet;}
    else{
        var snipLimit = 153 - dateLength;
        snippetSpace = theSnippet.lastIndexOf(" ",snipLimit);
        get('out_snippet').innerHTML = theSnippet.substring(0,snippetSpace).concat(ellipsis.bold());}
}

function urlFunction(){
    var theURL = val('in_url');
    theURL = theURL.replace('http://','');
    theURL = theURL.replace(/^\s+|\s+$/g,"");
    get('out_url').innerHTML = theURL;
    if(get('check_bold').checked == true){
        highlightURL();}}

And here's the Main page: '

<?php
    include('Code/Php_code.php');
    include('Code/Js_code.js');
?>

<!DOCTYPE html>
<html>
     <head>
        <title><?php echo $title ?></title>
     </head>
     <body>
        <form action="Database_Interface.php" method="post"><br>
          Title:<br>
          <input type="text" id="title" name="title" size="150" maxlength="150" value="<?php echo $title ?>" onKeyUp='textCounter("title","countDisplay");'><br>
          <input readonly type="text" id="countDisplay" size="3" maxlength="3" value="150"> Characters Remaining
          <br><br>
          Description:<br>
          <input type="text" id="description" name="description" size="150" value="<?php echo $tags['description'] ?>" onKeyUp='textCounter("description","countDisplay2");'><br>
          <input readonly type="text" id="countDisplay2" size="3" maxlength="3" value="150"> Characters Remaining
          <br><br>
          Keywords:<br>
          <input type="text" id="keywords" name="keywords" size="150" value="<?php echo $tags['keywords'] ?>" onKeyUp='textCounter("keywords","countDisplay3");'><br>
          <input readonly type="text" id="countDisplay3" size="3" maxlength="3" value="150"> Characters Remaining
          <br><br>
          <input type="submit" value="Carica sul database">
          <input type="button" value="see" onclick='snippetShow();'>
    </form><br>


    <div style="background-color:#f2f2f2; border:1px solid; border-color: black; position:relative;">
        <h3><a href="#" onclick="return false;" class="l"><span id="out_title"></span></a></h3>
        <div>
            <cite><span id="out_url" ><?php echo $site ?></span></cite>
        </div>
        <div>
            <span id="out_snippet">sdsdsdfvbfbf</span>
        </div>
    </div>

The answer is: why just the first method is called successfully while the other two generate an error?

Upvotes: 0

Views: 2903

Answers (2)

Haresh Vidja
Haresh Vidja

Reputation: 8496

First of all close <script> tage at end of your js.php file byv </script>

Do not include js file before <doctype> tag.

include it in <head> tag OR before </body>

Upvotes: 0

Bart
Bart

Reputation: 1609

Your first function seems to lack a closing } bracket. The last bracket is from the else block. Fixed:

function textCounter(id_Tf, id_Cd) {
    // Method that is called succesfully
    var element = document.getElementById(id_Tf);   
    var nameLenght  = element.value.length;    
    var countDisplay = document.getElementById(id_Cd);  
    if(nameLenght <= maxAmount) {
        countDisplay.value = maxAmount - nameLenght;
    }
    else {
        countDisplay.value = "0";
    }
}

Upvotes: 2

Related Questions