Week 2 : My Homestay Validate Admin Page JQuery

by - June 12, 2014

  • Create admin table.
  • Generate login page for administration page
  • Generate admin page and edit profile page with JQuery
  • Add one attribute at admin table to track when the last is updated.
  • Create the login page with validation. The error message should show with red color.
  • Add on Admin_Image at admin table and while upload the image it will directly save into folder not database.
This is the admin that add normal admin in the system. The add normal admin will only display if the admin level is master admin in MyHomestay.
sample using JQuery validation

<pre style="background:#0c1021;color:#f8f8f8"><span style="color:#aeaeae">//validate functions</span>
    <span style="color:#fbde2d">function</span> <span style="color:#ff6400">validateName</span>()
    {
        <span style="color:#aeaeae">//if it's NOT valid</span>
        <span style="color:#fbde2d">if</span>(admin_name<span style="color:#8da6ce">.val</span>()<span style="color:#8da6ce">.length</span> <span style="color:#fbde2d">&lt;</span> <span style="color:#d8fa3c">4</span>)
        {
            admin_name<span style="color:#8da6ce">.addClass</span>(<span style="color:#61ce3c">"boxred"</span>);
            nameInfo<span style="color:#8da6ce">.html</span>(<span style="color:#61ce3c">"&lt;div class='alert alert-warning span4'>"</span><span style="color:#fbde2d">+</span>
                                <span style="color:#61ce3c">"&lt;strong>Wrong!&lt;/strong> The names must with more than 3 letters!"</span><span style="color:#fbde2d">+</span>
                            <span style="color:#61ce3c">"&lt;/div>"</span>);
            <span style="color:#8da6ce">$</span>('<span style="color:#ff6400">#update_name</span>')<span style="color:#8da6ce">.attr</span>(<span style="color:#61ce3c">"disabled"</span>, <span style="color:#d8fa3c">true</span>);
            <span style="color:#8da6ce">$</span>('<span style="color:#ff6400">#update_name</span>')<span style="color:#8da6ce">.fadeTo</span>(<span style="color:#d8fa3c">10</span>,<span style="color:#d8fa3c">0.5</span>);          
        }
        <span style="color:#aeaeae">//if it's valid</span>
        <span style="color:#fbde2d">else</span>
        {
            admin_name<span style="color:#8da6ce">.removeClass</span>(<span style="color:#61ce3c">"boxred"</span>);
            nameInfo<span style="color:#8da6ce">.html</span>(<span style="color:#61ce3c">"&lt;div class='alert alert-success span4'>"</span><span style="color:#fbde2d">+</span>
                                <span style="color:#61ce3c">"&lt;strong>Correct!&lt;/strong> Now can click the save button"</span><span style="color:#fbde2d">+</span>
                            <span style="color:#61ce3c">"&lt;/div>"</span>);     
            <span style="color:#8da6ce">$</span>('<span style="color:#ff6400">#update_name</span>')<span style="color:#8da6ce">.removeAttr</span>(<span style="color:#61ce3c">"disabled"</span>);
            <span style="color:#8da6ce">$</span>('<span style="color:#ff6400">#update_name</span>')<span style="color:#8da6ce">.fadeTo</span>(<span style="color:#d8fa3c">10</span>,<span style="color:#d8fa3c">1.0</span>);          
        }
    }
</pre>

You May Also Like

0 comments