按下提交按钮时没有任何反应

时间:2017-04-26 02:13:31

标签: html

我不知道我做错了什么,这在索引页面上非常有效,当然还有另外一些代码,更小的代码,但是表单提交了。

这里我试图用表单创建一个模态,表单将用于创建一个新文章,但提交按钮不起作用,按下时没有任何事情发生。我真的不知道它有什么不对。

代码:

<div class="modal fade" id="createArticle" role="dialog">
        <div class="modal-dialog modal-lg">


          <div class="modal-content">
            <div class="modal-header">
              <button type="button" class="close" data-dismiss="modal">&times;</button>
              <h4 class="modal-title">Create a new article</h4>
              <small style="color:orange">Please add only important articles to the quick links</small>
            </div>
            <div class="modal-body">
              <form onsubmit="return validate();" action="" method="post">
                <div class="form-group">
                  <label for="createArticleTitle">Title:</label>
                  <input type="input" class="form-control" id="createArticleTitle" name="createArticleTitle" maxlength="250" placeholder="Insert Article Title...">
                </div>

          <!-- /.box -->

          <div class="box">
            <div class="box-header">
              <h3 class="box-title">Article Message:<br>
              <small><u>Text Formatting</u><br><br>
              Use <code>[center] Your text here [/center]</code> to center your message.<br>
              Use <code>[b] Your text here [/b]</code> to make your message <strong>bold</strong>.<br>
              Use <code>[i] Your text here [/i]</code> to to make your message <i>italic</i>.<br>
              Use <code>[u] Your text here [/u]</code> to underline your message.<br>
              Use <code>[img] img url here [/img]</code> to insert a image.<br>
              Use <code>[rigt/left] Your text here [/right/left]</code> to align your message on the right or on the left.<br>
              Use <code>[ul] Your text here [/ul]</code> for a unordered list, use <code>[*]</code> to add items.<br>
              Example: <code>[ul][*] Apple[/ul]</code> - dotes<br>
              Example: <code>[ol][*] Apple[/ol]</code> - numbers<br><br>
              Use <code>[quote] Your text here [/quote]</code> to add a quote.<br>
              Use <code>[url=link] Your url title here [/url]</code> to insert a url.<br>
              Use <code>[code] Your code here [/code]</code> to insert code.</small>
              </h3>
              <!-- tools box -->
              <div class="pull-right box-tools">
                <button type="button" class="btn btn-default btn-sm" data-widget="collapse" data-toggle="tooltip" title="Collapse">
                  <i class="fa fa-minus"></i></button>
              </div>
              <!-- /. tools -->
            </div>
            <!-- /.box-header -->
            <div class="box-body pad">
              <form>
                <textarea class="textarea" placeholder="Insert the article here..." id="createArticleMes" name="createArticleMes" maxlength="10000" style="width: 100%; height: 200px; font-size: 14px; line-height: 18px; border: 1px solid #dddddd; padding: 10px;"></textarea>
              </form>
            </div>
            <br>
            <div class="custom-controls-stacked">
                <label for="createArticleQuick">Do you want to show this article to the Quick Links in the footer?</label>
                <br>
              <label class="custom-control custom-radio">
                <input id="createArticleQuick" name="createArticleQuick" type="radio" class="custom-control-input">
                <span class="custom-control-indicator"></span>
                <span class="custom-control-description">Yes</span>
              </label>
            </div>
          </div>
                <button type="submit" name="createArticleButton" class="btn btn-default">Create</button>
              </form>
            </div>
            <div class="modal-footer">
              <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
            </div>
          </div>

        </div>
      </div>

这也是功能:

<script>
function validate(){
    var n1 = document.getElementById("createArticleTitle");
    var n2 = document.getElementById("createArticleMes");
    if(n1.value != "" && n2.value != ""){
        return true;
    }
    alert("You must add a title and a message atleast.");
    return false;
}
</script>

2 个答案:

答案 0 :(得分:0)

不使用没有任何属性的<form>标记,而是尝试使用类似

的内容
<form action="welcome.php" method="post">

答案 1 :(得分:0)

问题在于我使用了两次

<div class="box-body pad">
                  <form>
                    <textarea class="textarea" placeholder="Insert the article here..." id="createArticleMes" name="createArticleMes" maxlength="10000" style="width: 100%; height: 200px; font-size: 14px; line-height: 18px; border: 1px solid #dddddd; padding: 10px;"></textarea>
                  </form>
                </div>