display a div based on url parameter

Question

My website is trackschoolbus.com. You can see a login form at the top right. What I have set up is when a wrong input is given it redirects to home page with a parameter as ?er=1 i.e. http://www.trackschoolbus.com/?er=1. I need to display a error message when the error url comes so I have written

<script type="text/javascript"> 
   $(function(){ 
           if (document.location.href.indexOf('er=1') > 0) 
$("#display").show(); 
   }); 
</script>

and the html is

<div id="display" style="display:none;">wrong input</div>

my login form is

<form name="login-form" id="login-form" method="post" action="http://www.trackschoolbus.com/vehicleTracking/index.php">
    <input name="LoginForm[username]" id="LoginForm_username" type="text" placeholder="Registered Email" value="" class="error" required/>
    <input maxlength="30" name="LoginForm[password]" id="LoginForm_password" type="password" placeholder="Password" value="" class="error" required />
    <input type="submit" onclick="this.disabled=true;this.form.submit();" name="yt0" class="btn-submit" value="Login" />
</form>

still it shows display none.

Is the `$("#display").show(); ` inside `if{ }` or the code formatting is so? — Shaunak D, Apr 14 '15 at 09:36
You have _Uncaught TypeError: undefined is not a function_ error on this page. What about fixing it? — Regent, Apr 14 '15 at 09:38
`$("login-form").on("submit",function() { $("input[name='yt0']").hide();});` — mplungjan, Apr 14 '15 at 09:49
Because a) you may interfere in the submission by submitting while submitting. b) some browsers will see you disabled the submit button and will then not submit — mplungjan, Apr 14 '15 at 11:13

madalinivascu · Accepted Answer · 2015-04-14T09:49:56.727

use php

    <form name="login-form" id="login-form" method="post" action="http://www.trackschoolbus.com/vehicleTracking/index.php">
            <input name="LoginForm[username]" id="LoginForm_username" type="text" placeholder="Registered Email" value="" class="error" required/>
            <input maxlength="30" name="LoginForm[password]" id="LoginForm_password" type="password" placeholder="Password" value="" class="error" required />
            <input type="submit" onclick="this.disabled=true;this.form.submit();" name="yt0" class="btn-submit" value="Login" />
            <?php if (isset($_GET['er']) && $_GET['er'] == 1) {
                echo '<div id="display">wrong input</div>';
            }?>
            </form>

score 1 · Answer 2 · answered Apr 14 '15 at 09:38

1

You can use this code

if ($_REQUEST['er']==1)
{
   echo '<script type="text/javascript"> 
      $("#display").show(); 
   </script>';
}

answered Apr 14 '15 at 09:38

Sunil Pachlangia

2,033
2
15
25

It may work, but it's less elegant than just generating the div with PHP (Madalin's solution). Your solution injects a script that shows an existing div, that's two steps instead of one. – Jeremy Thille Apr 14 '15 at 09:41
@JeremyThille I think his answer will always make display:none of div – Sunil Pachlangia Apr 14 '15 at 09:42
All the more reason :) – Jeremy Thille Apr 14 '15 at 09:46

score 1 · Answer 3 · edited May 23 '17 at 10:29

This is relatively simple in javascript.

Using the code snippet in this thread: How can I get query string values in JavaScript?

function getParameterByName(name) {
    name = name.replace(/[\[]/, "\\[").replace(/[\]]/, "\\]");
    var regex = new RegExp("[\\?&]" + name + "=([^&#]*)"),
        results = regex.exec(location.search);
    return results === null ? "" : decodeURIComponent(results[1].replace(/\+/g, " "));
}
if (getParameterByName("er") == "1") 
    $("#display").show(); 
});

display a div based on url parameter

3 Answers3