Question

我在表单中有一个按钮。当我点击它时，评论应该与电子邮件和一个小头像一起出现。我的问题是我必须两次点击按钮。我在选项请求方面遇到了一些问题。我使用CORS插件来执行应用程序，因为json文件位于另一个域中。现在请求的类型是POST，但需要2次点击才能使其正常工作。

这是控制器的功能。在视图中，我只有一个input type=submit，其中包含ng-click。

$scope.envoyer_comment = function() {

    $scope.c = $scope.commentaire;
    $scope.e = $scope.email;

    var comment = {
      article_id: $scope.article.Article.id,
      titre: $scope.article.Article.titre,
      content: $scope.article.Article.content,
      commentaire: $scope.commentaire,
      email: $scope.email
    }

    if ($scope.flag == 0) {
      $.ajax({
        type: "POST",
        url: "https://www.yabiladi.com/newsapi/post.json",
        data: comment,
        datatype: "json",
        success: function(res) {
          $scope.d = 0;

        },
        error: function() {
          console.log("Erreur");
        }


      })
    }

视图中的部分包括使用函数

<div ng-if="flag==0">

  <label for="field2"><span style="margin-left:18px;">Commentaire:</span><textarea ng-trim="false" ng-model="$parent.commentaire" class="textarea-field outer" ng-maxlength="3000" required>Hello</textarea></label>
  <span style="margin-right:130px;">{{3000 - text.length}} caractères restants</span>

  <br/>

  <label for="field3"><span style="margin-left:18px;">email:</span><input type="text" class="input-field outer" ng-model="$parent.email" style="width:50%" required></label>

  <br/>

  <label><input type="checkbox" class="input-checkbox" name="checkbox1" style="margin-left:18px;"> 

Je souhaite recevoir un email à chaque commentaire<br/>&nbsp &nbsp &nbsp sur cet article
</label>
  <br/>

  <label><span>&nbsp</span><input type="submit" data-ng-click="envoyer_comment()" value="Envoyer" style="margin-left:-20%" ng-disabled="commentaire_article.$invalid"/></label>

  <br/>
  <br/>
  <br/>
  <div ng-hide="d">
    <ion-item style="border:0px;font-size:10px;margin-left:-50px;margin-top:-30px" class="item-text-wrap">
      <div class="form-style-2-heading" style="background-color: #fbf8f7;color:black;height:47px;margin-bottom:6px;margin-top:6px">
        <div style="margin-left:-240px;padding-top:5px"><img ng-src="img/sans titre.png" height="41" width="35" style="margin-left:-85px;margin-bottom:12px" style="border:0px">
          <div style="margin-left:45px;margin-top:-50px">{{e}}</div><br/>
          <div style="margin-left:90px;margin-top:-10px"> Date:{{timeNow|date:"d/m/y à HH:mm":"UTC"}}</div>
        </div>
      </div>
      <div style="padding-right: 50px;margin-bottom:30px" align="left">{{c}}</div>
    </ion-item>
  </div>
  <ion-list ng-repeat="article2 in article1.comments">



    <ion-item style="border:0px;font-size:10px;margin-left:-50px;margin-top:-30px" class="item-text-wrap">
      <div class="form-style-2-heading" style="background-color: #fbf8f7;color:black;height:47px;margin-bottom:6px;margin-top:6px">
        <div style="margin-left:-240px;padding-top:5px"><img ng-src="{{article2.avatar}}" height="41" width="35" style="margin-left:-85px;margin-bottom:12px" style="border:0px">
          <div style="margin-left:45px;margin-top:-50px">{{article2.PhorumMessage.author}}</div><br/>
          <div style="margin-left:90px;margin-top:-10px"> Date:{{article2.PhorumMessage.datestamp * 1000|date:"d/m/y à HH:mm":"UTC+0100"}}</div>
        </div>
      </div>
      <div style="padding-right: 50px;margin-bottom:30px" align="left">{{article2.PhorumMessage.body}}</div>
    </ion-item>
  </ion-list>

</div>

变量flag用于语言，变量d用于显示新评论。

开发工具的截图 ss dev tools

Answer 1

使用如下

<button type="button" onclick="yourfunction()">

<script>
    function yourfunction (){
        document.forms[0].submit();
    }
</script>

Answer 2

您能否提供有关html代码的更多详细信息？

我假设没有任何改变“$ scope.flag”变量的路径，并且你已经检查了第一次执行中是否有任何错误。

如果可以，请发布网页代码。

Answer 3

我通过尝试所有内容和任何东西来解决它。我在请求体中添加了async：false并且它工作了。谢谢所有帮助过的人

我必须两次点击按钮才能添加评论

3 个答案: