2014-02-04 2 views
0

Нажмите или отправить событие не срабатывает вскоре после провала проверки текстового поля происходитКендо Textbox Проверка: нажмите дважды выдавать

Пожалуйста, попробуйте эту link воспроизвести проблему.

HTML:

<div id="tickets"> 
    <table> 
     <tr> 
      <td style="vertical-align:text-top;">Document Name&nbsp;*</span> 
      </td> 
      <td style="width:435px;"> 
       <input name="Name" required></input> 
      </td> 
     </tr> 
    </table> 
    <button class="k-button" id="btnSubmit">Click me</button> 
</div> 

JS:

$(document).ready(function() { 
    var validator = $("#tickets").kendoValidator().data("kendoValidator"); 

    $("#btnSubmit").click(function (event) { 
     alert("Select valid value"); 
     event.preventDefault(); 
    }); 
}); 

Шаги

  1. Фокус на текстовом поле, щелкнув по нему
  2. Попробуйте нажать кнопку с текстовым полем пустой, проверка отображает как ожидалось.
  3. типа в некоторых значений в текстовое поле
  4. Нажмите кнопку еще раз, «нажмите кнопку» событие не срабатывает, как и ожидалось (но хорошо работает, когда пользователь нажимает во второй раз)

Это странно, когда пользователю необходимо дважды нажать кнопку отправки, чтобы выполнить действие после отказа проверки.

Я нашел это поведение в основном с помощью управления текстовыми полями.

+0

У меня такая же проблема, но я не много заботиться о нем. Если вы настаиваете на решении этой проблемы, вы можете попробовать показать сообщение проверки справа от текстового поля, поэтому кнопка не будет идти вниз, и вы можете щелкнуть в первый раз – MustafaP

+0

@ user2413664 Это не проблема в событии фокуса текстового поля. Kendo script remove required валидация, поэтому ваше событие клика не является огнем. Потому что оба события огонь в то же время. поэтому не беспокойтесь, это поведение кендо. – Jaimin

+0

, поскольку вы уже знаете jsfiddle: попробуйте использовать кнопку «Tidy Up» в верхнем меню –

ответ

0

Я попытался воспроизвести текущую версию пользовательского интерфейса Kendo и не смог. Это здесь будет работать, как и ожидалось (проходящие через ваши шаги, он будет печатать «не действует», то «действует»):

$(document).ready(function() { 
    var validator = $("#tickets").kendoValidator().data("kendoValidator"); 

    $("#btnSubmit").click(function (event) { 
     if (validator.validate()) { 
      console.log("valid"); 
     } else { 
      console.log("not valid"); 
     } 
    }); 
}); 

(demo)

+0

«Версия не была проблемой». Если вы удалите CSS из моего Jsfiddle [link] (http://jsfiddle.net/6nw8s/37/), он работает !!!!!! – user2413664

Смежные вопросы