Вопрос

Может кто-нибудь посмотреть на этот код. Я использую два плагина в форме. Один для проверки полей формы и других полей формы стиля.

Валидация формы проверяет форму, если я комментирую форму стилейки формы. (// $ ('. UL'). JQF1 ();) Я хочу, чтобы оба плагина работают вместе.

<link href="css/jqf1.css" rel="stylesheet" type="text/css" />
<script src="js/jquery.js"></script>
<script type="text/javascript" src="js/jqf1.english.js"></script>
<script src="js/jquery.validate.js"></script>
<script type="text/javascript">
$(document).ready(function(){
  $('.ul').jqf1();
$("#priceform").validate({
      rules: {
    email: {
      email: true,
      required: false
    },
    wordcount: {
     required: true,
     number: true
    },
    prating: {
    number: true
    }
  }
});});
</script>


<form action="" method="post" id="priceform">

<ul class="ul">
    <li><label for="Name">Name:</label></li><br/>
    <li><input type="text" id="name" size="20" name="name" maxlength="100" style="width:250px;" /></li>
</ul>

<ul class="ul">
    <li><label for="Email">Email:</label></li><br/>
    <li><input type="text" id="email" size="20" name="email" class="required" maxlength="20" style="width:250px;"/></li>
</ul>

<ul class="ul">
    <li><label for="username">UserName: <span class="optional">(Optional)</span></label></li><br/>
    <li><input type="text" id="username" size="20" name="username" maxlength="20" style="width:250px;"/></li>
</ul>

<ul class="ul">
    <li><label for="wordcount">Paper Word Count:</label><br/><a href="#">Calculate Word Count</a></li>
    <li style="padding-left:12px;"><input type="text" id="wordcount" size="20" name="wordcount" maxlength="20" style="width:50px;"/><span class="cumpolsory">*</span></li>
    <li style="color:green"><label id="totalPrice">$1000</label></li>   
    <li><label style="font-weight: 500; font-size:10px; color: gray;" for="totalprice">(Total Price)</label></li>
</ul>

<ul class="ul">
    <li><label>Plagiarism Rating:</label><br/><a href="#">Free Assessment</a></li>
    <li style="padding-left:15px;"><input type="text" id="prating" size="20" name="prating" maxlength="20" style="width:50px;"/><label>%</label></li>
</ul>

<ul class="ul" style="border-bottom:none;">
    <li><input type="Submit" id="name" size="20" name="name" value="Reset" maxlength="20" style="font-weight:700" /></li>
    <li style="float:right;"><input type="Submit" id="name" size="20" name="name" value="Place Order" maxlength="20" style="font-weight:700" /></li>
</ul>
</form>
Это было полезно?

Решение

Этот URL (http://www.webreference.com/programming/javascript/jquery/form_validation/) является ссылкой для вас.

Вы можете попытаться поставить этот, чтобы увидеть, как он отвечает на странице.

<Тип стиля = "Текст / CSS"> #priceform label.Error {Ширина: 250px; Дисплей: блок; плыть налево; красный цвет; прокладки слева: 10px; } </ Style>

Другие советы

Разве вы добавили код CSS «LIART.ERROR» в файле CSS, чтобы показать код ошибки?

Попробуйте: 1. Переместите звонок для стиля после проверки.

или

  1. Заставьте некоторые действия, такие как оповещение после стайлинга, чтобы убедиться, что сценарий тихо не бомбился до того, как произойдет назначение проверки.
Лицензировано под: CC-BY-SA с атрибуция
Не связан с StackOverflow
scroll top