4

At the base of this code there are the following 3 script tags. I dont want them within my html document, but if I try and remove them they stop my <script type="text/template" id="login-template">form from working correctly. Basically it seems to hide the input fields.

Why is this?

I've even removed the JS actual code within ` to try and resolve this.

   <script type="text/template" id="manage-todos-template"></script>
   <script type="text/template" id="item-template"></script>
   <script type="text/template" id="stats-template"></script>

<html>
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1"> 
    <meta name="description" content="fresh Gray Bootstrap 3.0 Responsive Theme "/>
    <meta name="keywords" content="Template, Theme, web, html5, css3, Bootstrap,Bootstrap 3.0 Responsive Login" />
    <meta name="author" content="Adsays"/>
    <title>Parse JavaScript Todo App</title>
    <script src="http://code.jquery.com/jquery-2.0.3.min.js"></script>
    <script src="scripts/underscore-1.1.6.js"></script>
    <script src="http://www.parsecdn.com/js/parse-1.2.13.min.js"></script>
    <script src="scripts/todos.js"></script>

    <link rel="shortcut icon" href="favicon.png"> 

    <!-- Bootstrap core CSS -->
    <link href="css/bootstrap.css" rel="stylesheet">

    <!-- Custom styles for this template -->
    <link href="css/login-theme-1.css" rel="stylesheet">
    <!-- 

    -->


    <!-- HTML5 shim and Respond.js IE8 support of HTML5 elements and media queries -->
    <!--[if lt IE 9]>
      <script src="js/html5shiv.js"></script>
      <script src="js/respond.min.js"></script>
      <link href="css/animate-custom.css" rel="stylesheet"> 
      <![endif]-->



      <script src="js/custom.js" type="text/javascript" ></script>

  </head>

  <body>



    <!-- Login, sign up and lost password box-->
    <div class="container" id="login-block">
        <div class="row">
            <div class="col-sm-6 col-md-4 col-sm-offset-3 col-md-offset-4">
                <div class="page-icon-shadow animated bounceInDown" > </div>
                <div class="login-box clearfix animated flipInY">
                    <div class="login-logo">
                        <a href="#"><img src="img/login-logo.png" alt="Company Logo" /></a>
                    </div> 
                    <hr />
                    <div class="login-form content">
                        <!-- Error messages if details not entered-->
                        <div class="alert alert-danger hide">
                            <button type="button" class="close" data-dismiss="alert"> &times;</button>
                            <h4>Error!</h4>
                            Your Error Message goes here
                        </div></div> </div> </div> </div> </div>
                        <!-- End Error box -->

                        <!-- This is the Parse generated code that generates from the js file to populate the page and manage Parse user authentication -->
                        <script type="text/template" id="login-template">
                        <header id="header"></header>
                        <div class="login">
                        <form class="login-form">
                        <div class="error" style="display:none"></div>
                        <input type="text" id="login-username" placeholder="User name" class="input-field" required/> 
                        <input type="password" id="login-password" placeholder="Password" class="input-field" required/> 
                        <button type="submit" class="btn btn-login">Login</button> 

                        <!--//Parse code ends here-->

                        <!--//Links to sign up and lost password pages-->

                        <div class="login-links"> 
                        <a href="forgot-password.html">
                        Forgot password?
                        </a>
                        <a href="sign-up.html">
                        Dont have an account? Click here to Sign Up
                        </a>
                        </div>

                        <!--//FB authentication button that fires the fb page to log user in --> 
                        <div class="social-login row">
                        <div class="fb-login col-lg-6 col-md-12 animated flipInX">
                        <a href="fb.html" class="btn btn-facebook btn-block">Connect with <strong>Facebook</strong></a>
                        </div>
                        </div>
                        </div>
                        </form>
                    </script>   <!--//Script must wrap around all the above code to display it correctly on screen -->          


    <!--XXXXX -->                   


    <script type="text/template" id="manage-todos-template"></script>
                    <script type="text/template" id="item-template"></script>
                        <script type="text/template" id="stats-template"></script>          


                </body>

                </html>
Dano007
  • 1,604
  • 6
  • 22
  • 55
  • have you seen this ?http://stackoverflow.com/questions/4912586/explanation-of-script-type-text-template-script – anurupr Feb 20 '14 at 12:33
  • @anurupr Thanks very interesting. I might be being slow, but I don't see how that answer explains the issue I'm having above? surely I should just be able to remove the script tags I indicated with out any impact? – Dano007 Feb 20 '14 at 13:54
  • let me try to explain. these tags that you are trying to remove are being used by a templating engine, which is why removing it causes your page to work incorrectly. there might be no content in the script but its probably adding / manipulating content within that. you need to check if any content is being added to those tags when you run the page with those tags still intact. only then can you be sure – anurupr Feb 20 '14 at 14:36
  • Ok, I understand now. Do you want to add this as the answer and I will accept it. Cheers for the help. – Dano007 Feb 20 '14 at 14:52

1 Answers1

2

these tags that you are trying to remove are being used by a templating engine, which is why removing it causes your page to work incorrectly.

there might be no content in the script but its probably adding / manipulating content within that. you need to check if any content is being added to those tags when you run the page with those tags still intact.

anurupr
  • 2,186
  • 2
  • 18
  • 26