Semantic-UI 避免為某些點擊事件觸發表單驗證

Question

我在 angular.js 中使用 semantic-ui，並且在 Semantic 的表單驗證方面遇到了一些問題。

我的表單有一些按鈕，單擊其中任何一個都會觸發驗證。 我需要避免他們中的一些人這樣做，因為它是一個只打開一個模式面板的按鈕。

   //NEED TO AVOID TRIGGER VALIDATION FOR THESE TWO BUTTONS
    <button class="mini ui positive  button">
        <div class="agregar linea std">
            <i class="add square medium icon"></i>
        </div>
    </button>
    <div class="or"></div>
    <button class="mini ui red button">
        <div class="agregar linea nostd">
            <i class="add square medium icon"></i>
        </div>
    </button>

//This must trigger validation, and it does !
<div class="ui green ok submit button " ng-click="save(pedido, false, true)" ng-disabled="creating">Guardar</div>

我點擊了與打開模式的按鈕相關聯的事件。

// buttons to open modal
$('.agregar.linea.std')
    .popup({
        inline   : true,
        hoverable: true,
        position : 'bottom right',
        delay: {
            show: 300,
            hide: 300
        },
        content: 'Agregar linea estandard'
    })
    .click(function(){
        $scope.modalType = 'std';
        $scope.modalInitialize();
        $('.ui.modal').modal('show');
    });
$('.agregar.linea.nostd')
    .popup({
        inline   : true,
        hoverable: true,
        position : 'bottom right',
        delay: {
            show: 300,
            hide: 300
        },
        content: 'Agregar linea no estandard'
    })
    .click(function(){
        $scope.modalType = 'nostd';
        $scope.modalInitialize();
        $('.ui.modal').modal('show');
    });

來自語義文檔：

內置事件：表單會自動將事件附加到特別標記的表單字段

• 按下退出鍵時字段會模糊
• 字段將在輸入時提交表單
• 提交事件將附加到單擊帶有類提交的表單內的任何元素
• 重置事件將附加到單擊具有類重置的表單內的任何元素
• Clear 事件將附加到單擊class clear的表單內的任何元素

據我所知，打開模態對話框的按鈕不符合這些條件中的任何一個，但是當您單擊其中任何一個時都會觸發驗證。

我不知道為什么在這些情況下要進行驗證，而且我試圖避免它但沒有成功。

我在這里缺少什么？

謝謝 ！

Answer 1

我找到了解決辦法。 您必須使用輸入而不是按鈕。 您可以通過應用“ui button”類使它們看起來與常規按鈕相同，如下所示：

<input type="button" class="mini ui positive  button"></input>