Skip welcome & menu and move to editor
Welcome to JS Bin
File
Add library
Share
Login or Register
Blog
Help
Load cached copy from
  • Run with JS
  • Save
  • Share
  • …
 
<!DOCTYPE html>
<html>
<head>
<link href="https://code.jquery.com/ui/1.11.4/themes/smoothness/jquery-ui.min.css" rel="stylesheet" type="text/css" />
<script src="https://code.jquery.com/jquery-1.11.0.min.js"></script>
<script src="https://code.jquery.com/ui/1.11.4/jquery-ui.min.js"></script>
  <meta charset="utf-8">
  <title>JS Bin</title>
</head>
<body>
<form id="form1">
        <input type="text" id="f1" class="f1" name="nf1"></input><br /> <input
            type="text" id="f2" class="f2" name="nf2"></input><br />
    </form>
    <hr />
    <form id="form2">
        This field doesn't work, class="f1" is similar to the id of the first form.<br />
        '''<input type="text" id="f1" class="f1" name="nf1"></input><br />'''
        Here it works<br />
        <input type="text" id="f3" class="f3" name="nf3"></input><br />
    </form>
​
    <script>
        $(function() {
​
            $("#form1 .f1").datepicker();
            $("#form1 .f2").datepicker();
            
            $("#form2 .f1").datepicker();
            $("#form2 .f3").datepicker();
        });
    </script>
</script>
</body>
</html>
Output

This bin was created anonymously and its free preview time has expired (learn why). — Get a free unrestricted account

Dismiss x
public
Bin info
anonymouspro
0viewers