Don't you want to put your code inside the initializer? Codes inside the initializer folder only run once whenever the application starts.

+1 to pritaeas..

I suggest you also want to look at using $('#contact-form').serializeArray() method which will return an array of names and values from elements on your form rather than selecting your form elements over and over.

Is there a requirement whether you could use a framework like jQuery or just the native one?

Basically when you click a next button, you pass some parameters (e.g. {:page => 2}) to your backend, then your backend will then do the query on the set of data you are going to display. Let's say per page you display 10 records you do some query like this.

I'm using ruby so never mind my syntax

per_page = 10
page = params[:page]
offset = per_page * page

so your query will be something like this.
Table.limit(10).offset(offset) - What this does is something like select * from table limit 10 offset 20

It will start searching data on the 20th record given the fact that you passed page 2 on your params and will return a set of 10 records.

Then return the data on your client and display the retrieved data. If no more data is returned, then that's the end of your pagination, so you may hide the next button. I hope that helps.

In addition, that is a ternary operator in JavaScript, just want to let you know. It saves a lot of lines by the way.

I'm not sure what you really want but try this.

In your JavaScript code, submit the name of your employee via form and perform an ajax call so as to not refresh the page.

jquery framework (widely used js framework that rocks!) -
jquery ujs so as to handle all ajax calls across your site -


<form action="youraction" method="post" id="form-id" "data-remote" => "true">
<input type="text" name="employee_name"/>
<div id="loader"></div>    
<button type="submit">Submit</button>

<div id="employee-data"></div>


$(document).ready(function() {

  // ajax:before is executed upon submitting your form
  // you can insert a loader here or do some validation before sending your ajax call  
  $('#form-id').on('ajax:before', function() {
    // put your code here

  // ajax:success runs when the server returns a successful call
  // display the data returned by your server here
  $('#form-id').on('ajax:success', function(event, data) {
    // put your code here
    // data depends on what kind of data your server responds (json or html format)

    // hide your loader



First of all, you don't need to use javascript to hide the logindiv upon load of the page. You may add a class "hide" or add an inline style to make the container hidden.

I'm not sure why is the logindiv is hiding after an error is shown upon looking at your code. But you may try and call the showlogindiv() function after displaying the error.

Why don't you provide a class on the body tag to identify if you are on this page rather than check your current url.


<body class="somesite">

and in your javascript you do this

$('#menu a').each(function() {
  if ($('body.somesite').length) {

Badoo has a better way of making those images protected, how, they add some text on the images they render.

Where is the problem coming from? is it from the backend side or the js side?

I agree to AleMonteiro and gon1387, you should try using what they suggested. Make sure the elements are loaded first before manipulating them.

Use "this"

this - refers to the element who clicked it
or you may use the event obj.

e.g. (this)

console.log('element who clicked', this);

e.g. (event)

$('.clear_all_slip').click(function(event) {

Looking at the code, I guess you shouldn't provide the "value" attribute unless you placed something other than an empty string. I'm not sure if that would help though.

Another tip, it's a best practice to always validate required fields on your backend. It is not safe to just put your validations via client side.

have you seen the console log of IE's web development tool?

I'm not sure what the problem might be, but window.location.href = "" is absolutely working fine across browsers.

I'm not sure why would you want to use JavaScript for making a dropdown. You can use css for this one. But here's what you need if you need a script.

This is a sample markup:

<div id="link-wrapper">
    <a href="#" id="link">Hover to show div</a>
    <div class="hide" id="some-div">
                <a href="#">link1</a>
                <a href="#">link2</a>

.hide {
    display: none;

#some-div {
    margin-top: 50px;
    background-color: #ccc;

#link-wrapper {
    width: 150px;

The sample script

$('#link-wrapper').mouseover(function() {
}).mouseout(function() {


Ruby is the best, use Rails it's a web framework and it's super easy to implement. It will change the way you code and it's community is growing bigger. Most of the projects in github are written in ruby :)

That's weird, can you send us the link of your site so we can see it in IE?

One solution is you can check it's url.

if (window.location.href.indexOf('url') >= 0) {
  //change logo for domain name with 'url'
} else {
  // change logo for the other domain

or you can check it using this method

if (document.domain === 'domain') {
    //change logo for domain name with 'url'
} else {
    // change logo for the other domain

I think the last one is better

What kind of modal window do you want to reload? What are it's content? Be specific, precise and tell more details of the things you want to happen.

That's huge bro.

You may override the default containers for the validation which might help you manipulate the provided error message with your own styling.

    errorClass: 'invalid',
    errorElement: 'label',
    wrapper: '<div class="error-inline" ></div>',

probably the plugin has default css or markup which causes it to have line breaks

JavaScript is an essential part of a web site, I think there are no more supported devices that are aren't using JavaScript.

just refactoring some code above, but that really works even without testing:

$("a.someclass span").click(function(){
    window.location.href = $(this).parent().attr('href');     

are you submitting the form via ajax? bring in the code bro

like_add.php is inside the folder ajax in your server. it will handle your ajax request, it is the backend of your ajax call.

using jQuery it easy to get what you need.

    <td><?php echo $entry_shippingtype; ?></td>
        <select name="type" id="category">
            <option value="free">Free Shipping</option>
            <option value="flat">Flat Rate Shipping</option>
            <option value="weight">Weight Based Shipping</option>
    <td><?php echo $entry_shippingamount; ?></td>
    <td><input type="text" id="shipping-amount" name="shippingamount" value="<?php echo $shippingamount; ?>" /></td>

On load of page, you may use php to set the default values. Then you may bind JavaScript events for your requirements.

var category = $('#category');

//bind the dropdown selection to change event
category.change(function(e) {
    var selected = $(this).find('option:selected');
    if (selected.val() === 'free') {
      // disable the input when free shipping is selected
      $('#shipping-amount').attr('disabled', 'disabled');


This will do it! It's pretty simple using jQuery unlike using the native JavaScript. :)

you could jQuery's extend method.

var obj1 = {"cool":"34.33","alsocool":"45454"};
var obj2 = {"coolness":"34.33"};
$.extend(obj1, obj2);

The value of the first object will contain obj2.


The above statement will log something like this:

{"cool":"34.33","alsocool":"45454", "coolness":"34.33"}

If you don't want to use jQuery, you can try the native and easy way by doing this:

json.coolness = "34.33";

Everything in JavaScript is an object, you can assign properties to objects easily and set it's value

you could use jquery.validate plugin. You can set different ways of displaying your validation. It's pretty handy and you'll have a consistent look and feel of your validations across the site.

ratanji commented: thanq but actually m learner, my sir said that do only in javascript dnt use jquery +0