无法在模式对话框的文本字段中输入输入值

时间:2015-12-02 14:02:24

标签: jquery

我无法在模式对话框的输入字段中输入值。我正在附加我的代码与这个问题。它没有显示任何错误,但输入字段不可编辑。我已经搜索了这个问题,并找到了增加z-Index值的解决方案。我做到了,但它不起作用。

代码: -

<!DOCTYPE html>
<!-- saved from url=(0040)http://getbootstrap.com/examples/signin/ -->
<html lang="en"><head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <!-- The above 3 meta tags *must* come first in the head; any other head content must come *after* these tags -->
    <meta name="description" content="">
    <meta name="author" content="">
    <link rel="icon" href="http://getbootstrap.com/favicon.ico">

    <title>Signin Template for Bootstrap</title>

    <!-- Bootstrap core CSS -->
    <link href="./Signin Template for Bootstrap_files/bootstrap.min.css" rel="stylesheet">

    <!-- IE10 viewport hack for Surface/desktop Windows 8 bug -->
    <link href="./Signin Template for Bootstrap_files/ie10-viewport-bug-workaround.css" rel="stylesheet">

    <!-- Custom styles for this template -->
    <link href="./Signin Template for Bootstrap_files/signin.css" rel="stylesheet">

    <!-- Just for debugging purposes. Don't actually copy these 2 lines! -->
    <!--[if lt IE 9]><script src="../../assets/js/ie8-responsive-file-warning.js"></script><![endif]-->
    <script src="./Signin Template for Bootstrap_files/ie-emulation-modes-warning.js"></script>

    <!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries -->
    <!--[if lt IE 9]>
      <script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script>
      <script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
    <![endif]-->
    <script src="js/jquery-1.11.3.min.js"></script>
 <script src="//code.jquery.com/jquery-1.10.2.js"></script>
  <script src="//code.jquery.com/ui/1.11.4/jquery-ui.js"></script>
  <link href="//ajax.googleapis.com/ajax/libs/jqueryui/1.11.1/themes/ui-darkness/jquery-ui.min.css" rel="stylesheet">
  </head>

  <body>

    <div class="container">

      <form class="form-signin" id="#sign-in">
        <h2 class="form-signin-heading">Please sign in</h2>
        <label for="inputEmail" class="sr-only">Email address</label>
        <input type="email" id="inputEmail" class="form-control" placeholder="Email address" required="" autofocus="">
        <label for="inputPassword" class="sr-only">Password</label>
        <input type="password" id="inputPassword" class="form-control" placeholder="Password" required="">
        <div class="checkbox">
          <label>
            <input type="checkbox" value="remember-me"> Remember me
          </label>
        </div>
        <button class="btn btn-lg btn-primary btn-block" type="button" id="btn1">Sign in</button>
      </form>

    </div> <!-- /container -->
     <div id="dialog" title="Dialog Form"></div>
     <div id="dialog-form" title="Create new user">


    <label for="name">Name</label>
    <input type="text" name="name" id="name" required="true"/>
      <br/>
      <label for="email">Email</label>
    <input type="text" name="email" id="email" required="true" email="true"/>
    <br/>
      <label for="password">Password</label>
    <input type="password" name="password" id="password"/>


</div>



    <!-- IE10 viewport hack for Surface/desktop Windows 8 bug -->
    <script src="./Signin Template for Bootstrap_files/ie10-viewport-bug-workaround.js"></script>
    <script>
      $(document).ready(function()
       {       
                 $('#btn1').click(function() {
        $( "#dialog-form" ).dialog( "open" );
        if($("#name").val()!='Srivatsava')
        {
            alert('you fool');
        }
      });

    //code for dialog
    $( "#dialog-form" ).dialog({
      autoOpen: false,     
      height: 300,
      width: 350,
      modal: true,
      zIndex: 1,
      buttons: {
        "Save": function() { //on click of save button of dialog
            if($('#sign-in').valid()){  //call valid for form2 and show the errors
               alert('submit form');  //only if the form is valid submit the form
                $( this ).dialog( "close" );
            }
        },
        Cancel: function() {
          $( this ).dialog( "close" );
        }
      }

    });
});


    </script>


</body></html>

0 个答案:

没有答案