Jquery 如何在创建表单时添加必填字段？

这是我的代码：

  <div class="form-group">
    <div class="col-md-4">
      <label class="control-label">Mobile Number:</label>
    </div>
    <div class="col-md-8">
      {!! Form::input('number', 'mobile',  null, ['type' => 'number', 'min' => 0, 'id' => 'mobile', 'class' => 'input-lg form-control TabOnEnter', 'placeholder' => 'Eg: 9876543210', 'tabindex' => 15]) !!}
    </div>
  </div>

手机号码：
{！！Form:：input（'number'，'mobile'，null，['type'=>'number'，'min'=>0，'id'=>'mobile'，class'=>'input lg Form control Tabonener'，'placeholder'=>'例如：9876543210'，'tabindex'=>15]）

在这里，我想根据需要提供此手机号码字段，如何将其添加到我的代码中？

---

在创建表单的过程中，我有3个步骤，在步骤1中我有手机号码，当我单击“下一步”按钮而不添加手机号码时，它应该会显示一条警告消息。现在，它只在最后一步单击“提交”按钮（即）后显示所需手机字段的警告消息在步骤3.

中，向数组中添加

'required'=>true

：

{!! Form::input('number', 'mobile',  null, ['required' => true, 'type' => 'number'....

---

将

'required'=>true

添加到数组中：

{!! Form::input('number', 'mobile',  null, ['required' => true, 'type' => 'number'....

---

您需要使用

jquery

  <div class="form-group">
    <div class="col-md-4">
      <label class="control-label">Mobile Number:</label>
    </div>
    <div class="col-md-8">
      {!! Form::input('number', 'mobile',  null, ['type' => 'number', 'min' => 0, 'id' => 'mobile', 'class' => 'input-lg form-control TabOnEnter', 'placeholder' => 'Eg: 9876543210', 'tabindex' => 15]) !!}

    <button style="margin-right:20px;" class="next_button btn btn-info active nextBtn btn-md pull-right" type="next" >Next</button>
    </div>
  </div>

$(document).ready(function(){
   $('.next_button').click(function(event){
        if ($('#mobile').val() == ""){
            event.preventDefault();
            alert('Enter the number');
        }
    });
});

手机号码：
{！！Form:：input（'number'，'mobile'，null，['type'=>'number'，'min'=>0，'id'=>'mobile'，class'=>'input lg Form control Tabonener'，'placeholder'=>'例如：9876543210'，'tabindex'=>15]）
下一个
$（文档）.ready（函数（）{
$（'.next_按钮'）。单击（函数（事件）{
如果（$（'#mobile'）.val（）=“”）{
event.preventDefault（）；
警报（“输入号码”）；
}
});
});

---

在现有代码中添加了

next\u按钮

类

您需要使用

jquery

  <div class="form-group">
    <div class="col-md-4">
      <label class="control-label">Mobile Number:</label>
    </div>
    <div class="col-md-8">
      {!! Form::input('number', 'mobile',  null, ['type' => 'number', 'min' => 0, 'id' => 'mobile', 'class' => 'input-lg form-control TabOnEnter', 'placeholder' => 'Eg: 9876543210', 'tabindex' => 15]) !!}

    <button style="margin-right:20px;" class="next_button btn btn-info active nextBtn btn-md pull-right" type="next" >Next</button>
    </div>
  </div>

$(document).ready(function(){
   $('.next_button').click(function(event){
        if ($('#mobile').val() == ""){
            event.preventDefault();
            alert('Enter the number');
        }
    });
});

手机号码：
{！！Form:：input（'number'，'mobile'，null，['type'=>'number'，'min'=>0，'id'=>'mobile'，class'=>'input lg Form control Tabonener'，'placeholder'=>'例如：9876543210'，'tabindex'=>15]）
下一个
$（文档）.ready（函数（）{
$（'.next_按钮'）。单击（函数（事件）{
如果（$（'#mobile'）.val（）=“”）{
event.preventDefault（）；
警报（“输入号码”）；
}
});
});

---

在现有代码中添加了

next_按钮

类

尝试以下操作：

{{Form:：text（'key'，'value'，['required']）}

或在[]参数列表中执行以下操作：`required'=>''.@SorangwalaAbbasali，它不起作用。。当用户单击下一步按钮时，您可以添加一些

javascript

来检查验证。尝试以下操作：

{{Form:：text（'key'、'value'、['required']）}

或者在[]中执行以下操作：`required'=>'`参数列表。@SorangwalaAbbasali，它不起作用。。当用户单击“下一步”按钮时，您可以添加一些

javascript

来检查验证。下一步不坏。。现在它显示警报，但当我们在警报中单击“确定”时，它会移动到下一步，并且不允许输入我们的手机号码。。这可能是因为您有“下一步按钮”类它不应该让你进入下一步，而类nextBtn可能让你进入下一步。下一步按钮的代码在哪里？如果它也在Javascript中，那么在它引导你进入第二步之前添加此代码还不错。现在它会显示警报，但当我们在警报中单击“确定”时，它会移动到下一步，并且不允许进入我们的手机这可能是因为你有“下一步按钮”课它不应该让你进入下一步，而类nextBtn可能让你进入下一步。下一步按钮的代码在哪里？如果它也在Javascript中，那么在它引导你进入下一步之前添加此代码2@ManiRajMurugan你有什么错误吗？什么是HTML输出？@ManiRajMurugan我很确定这个错误与我答案中的代码。它也会出现这样的错误：“一个名为`mobile`的无效表单控件不可聚焦。”@ManiRajMurugan你有什么错误吗？HTML输出是什么？@ManiRajMurugan我很确定这个错误与我答案中的代码无关。它也会出现这样的错误，“名为='mobile'的无效表单控件不可聚焦。”