angularjs Angular 引导模式打开输入单击

bq8i3lrv  于 2023-08-02  发布在  Angular
关注(0)|答案(1)|浏览(115)

在我的控制器中我有方法

  • $scope.openJukeboxesModalToGroup --打开模态弹出窗口
  • $scope.searchJukeboxes-在页面上搜索
  • $scope.keyPressed --捕获按键

在局部用一个形式

<form class="form-inline" role="form" ng-submit="deadForm()">
    <div class="form-group">
         <button ng-click="openJukeboxesModalToGroup()" class="btn btn-info">Add Stores to Group</button>
    </div>
    <div class="form-group">
        <input type="text" ng-model="jukeboxFilter" ng-keypress="keyPressed($event, 'search')" class="form-control" placeholder="search">
    </div>
    <button type="button" ng-click="searchJukeboxes()" class="btn btn-info"><span class="glyphicon glyphicon-search"></span></button>
    <button type="button" ng-click="resetFilter()" class="btn btn-info"><span class="glyphicon glyphicon-repeat"></span></button>
</form>

字符串
keyPressed方法

$scope.keyPressed = function($event, eventType) {
        $event.stopImmediatePropagation();
        if(eventType=='search') {
            if($event.which==13) {
                $scope.searchJukeboxes();
           }
       } 
 };


每当有人在文本栏中键入内容并单击回车时,我都试图开始搜索。但是我不知道为什么openJukeboxesModalToGroup()方法也被调用了。我试图通过调用stop事件proprpagation来停止它,更改openJukeboxesModalToGroup()方法的名称。但什么都不管用。任何帮助这一点。
deadForm()方法是impleament和我没有得到任何错误在 chrome 控制台。

mklgxw1f

mklgxw1f1#

openJukeBoxesModalToGroup()**type="button"**添加到您的按钮中:

<button type="button" ng-click="openJukeboxesModalToGroup()" class="btn btn-info">Add Stores to Group</button>

字符串
问题是你没有提供一个类型,所以它将按钮分类为提交,在这种情况下,openJukeboxesModalToGroup()将从你的enter submit事件中触发。
当你在一个表单中按回车键时,它会触发一个提交,我建议通过ng-submit指令将你的方法添加到表单本身,并使你的按钮成为提交。

<form class="form-inline" role="form" ng-submit="searchJukeboxes()">
    <div class="form-group">
         <button type="button" ng-click="openJukeboxesModalToGroup()" class="btn btn-info">Add Stores to Group</button>
    </div>
    <div class="form-group">
        <input type="text" ng-model="jukeboxFilter" ng-keypress="keyPressed($event, 'search')" class="form-control" placeholder="search">
    </div>
    <button type="submit" ng-click="searchJukeboxes()" class="btn btn-info"><span class="glyphicon glyphicon-search"></span></button>
    <button type="button" ng-click="resetFilter()" class="btn btn-info"><span class="glyphicon glyphicon-repeat"></span></button>
</form>

相关问题