在Web上写入Firebase数据库

时间:2018-04-03 06:01:57

标签: javascript firebase firebase-realtime-database

我有一个文件form.php, 如果我在表单中输入注释并单击Web上的提交按钮,它会成功地将字典写入firebase数据库,

var dict = {
Name: writeName,
City: "111",
Country: "222",
Address: "333",
};

当然名字是“”。 enter image description here

但是,如果我在表单中键入诸如“Peter”或其他内容的内容并单击“提交”按钮,则大多数时间它将不会向数据库中写入任何内容。 请帮助解决这个问题。

这里有form.php代码。

<!DOCTYPE HTML>

<html>
    <head>
        <title></title>
        <meta charset="utf-8" />
        <meta name="viewport" content="width=device-width, initial-scale=1" />
        <!--[if lte IE 8]><script src="assets/js/ie/html5shiv.js"></script><![endif]-->
        <link rel="stylesheet" href="assets/css/main.css" />
        <!--[if lte IE 9]><link rel="stylesheet" href="assets/css/ie9.css" /><![endif]-->
        <!--[if lte IE 8]><link rel="stylesheet" href="assets/css/ie8.css" /><![endif]-->
        <link rel="shortcut icon" href="images/favicon.png" />




    </head>
    <body>
        <!-- Wrapper -->
            <div id="wrapper">

                <!-- Header -->
                    <header id="header">
                        <div class="inner">

                            <!-- Logo -->
                                <a href="" class="logo">
                                    <span class="title"></span>
                                </a>



                        </div>
                    </header>


                <!-- Main -->
                    <div id="main">
                        <div class="inner">
                            <header>

                            </header>

                                <section>


                                <form id="form1" name="form1">
                                <div class="row uniform">


                                                    <div class="6u 12u$(xsmall)">
                                                        <input type="text" name="ContactName" id="ContactName" value="" required placeholder="公司名字(必填)" />
                                                    </div>



                                        <div class="12u$">
                                            <ul class="actions">
                                            <center>
                                            <li><input type="submit" name="submit" id="submit" onClick="submitClick()" class="button special fit" form="form1" value="提交"></li>
                                            <li><input type="reset" class="button special fit" value="Reset" /></li>
                                            </center>
                                            </ul>
                                        </div>

                                </div>
                                </form>



                                </div>
                                </div>

                                </section>



                            </section>


                            </section>

                        </div>


                    </div>







                <!--


                    <footer id="footer">
                        <div class="inner">



                            <section>
                                <h2>Get in touch</h2>
                                <form method="post" action="#">
                                    <div class="field half first">
                                        <input type="text" name="name" id="name" placeholder="Name" />
                                    </div>
                                    <div class="field half">
                                        <input type="email" name="email" id="email" placeholder="Email" />
                                    </div>
                                    <div class="field">
                                        <textarea name="message" id="message" placeholder="Message"></textarea>
                                    </div>
                                    <ul class="actions">
                                        <li><input type="submit" value="Send" class="special" /></li>
                                    </ul>
                                </form>
                            </section>




                            <section>
                                <ul class="copyright">
                                    <center><small>&copy; All rights reserved     &hearts;     Grand Production House     &hearts;     <a href="mailto:gph.payment@gmail.com">Email</a></small></center>
                                </ul>



                                <ul class="icons">


                                    <li><a href="#" class="icon style2 fa-twitter"><span class="label">Twitter</span></a></li>
                                    <li><a href="#" class="icon style2 fa-facebook"><span class="label">Facebook</span></a></li>
                                    <li><a href="#" class="icon style2 fa-instagram"><span class="label">Instagram</span></a></li>
                                    <li><a href="#" class="icon style2 fa-dribbble"><span class="label">Dribbble</span></a></li>
                                    <li><a href="#" class="icon style2 fa-github"><span class="label">GitHub</span></a></li>
                                    <li><a href="#" class="icon style2 fa-500px"><span class="label">500px</span></a></li>
                                    <li><a href="#" class="icon style2 fa-phone"><span class="label">Phone</span></a></li>
                                    <li><a href="mailto:gph.payment@gmail.com" class="icon style2 fa-envelope-o"><span class="label">Email</span></a></li>


                                </ul>





                            </section>

                        </div>
                    </footer>

                -->






            </div>

        <!-- Scripts -->
        <script src="https://www.gstatic.com/firebasejs/4.12.1/firebase.js"></script>
        <script>
          // Initialize Firebase
          var config = {
            apiKey: "zzzzzzzzzzzzz",
            authDomain: "zzzzzzzzzzz",
            databaseURL: "zzzzzzzzzzzz",
            projectId: "zzzzzzzzzz",
            storageBucket: "zzzzzzzzzzzzzzzzzz",
            messagingSenderId: "zzzzzzzzzzzzzzzzzz"
          };
          firebase.initializeApp(config);
        </script>










        <script>


function submitClick() {

    var name = document.getElementById("ContactName");
    var writeName = name.value;

    var dict = {
        Name: writeName,
        City: "111",
        Country: "222",
        Address: "333",

    };

    firebase.database().ref().child("SUBMIT").push().set(dict);


}
        </script>

            <script src="assets/js/jquery.min.js"></script>
            <script src="assets/js/skel.min.js"></script>
            <script src="assets/js/util.js"></script>
            <!--[if lte IE 8]><script src="assets/js/ie/respond.min.js"></script><![endif]-->
            <script src="assets/js/main.js"></script>

    </body>
</html>

1 个答案:

答案 0 :(得分:1)

变化:

<li><input type="submit" name="submit" id="submit" onClick="submitClick()" class="button special fit" form="form1" value="提交"></li>

到此:

<li><input type="button" name="btn" id="btn" onClick="submitClick()" class="button special fit" form="form1" value="提交"></li>

另请参阅:

Submit and onclick not working together

onClick didn't work inside form?