如何选择名称字段和说明字段并填写字段,需要单击下一步按钮

时间:2017-08-28 08:01:50

标签: jquery

how can we fill those fields using jquery selectors

html代码如下所示



$data['all_users'] = $users->get(); // all users




请帮助我使用<div class="col-xs-4 h100"> <div class="title">What do you want to name your application as ?</div> <div class="help-text tMargin10">The name you provide here will be the application name used. Typically, it is the project name or repo name.</div> <div class="row applicationName"> <form id="create-application-form"> <div class="form-group"> <label>Name your Application </label> <i class="fa fa-question-circle" title="The name you provide here will be the application name. Typically, it is the project name or repo name. Application name must begin with an alphabet and recommend not to use consecutive _, -, whitespaces. Ex - My_app_name, my app name, my-app-name are allowed. Please avoid names like my___app___name, my app name, or my-----app----name"></i> <span class="mandatory" title="Mandatory">*</span> <input class="form-control behavior-validate required" data-validation="[{"rule":"application_name"}]" minlength="4" maxlength="21" name="name" value="" type="text"> </div> <div class="form-group"> <label>Description</label> <textarea class="form-control" name="description"></textarea> <div class="help-text">This description will be displayed to users who may want to join your team. (Optional)</div> </div> </form> </div> <div class="viewActions text-right"> <button class="btn btn-primary continue next hasError" type="button" title="Mandatory field missing" disabled="disabled">Next</button> </div> </div>选择器。

1 个答案:

答案 0 :(得分:0)

您可以使用解决方案https://jsfiddle.net/s4mz5kf8/2/

var data = {name:"", description: ""}
$('input[name="name"], textarea[name="description"]').focusout(function(){
  data[$(this).attr('name')] = $(this).val();
  
  if(data.name != "" && data.description != ""){
    console.log(data);
    $('.next').removeAttr('disabled').click();
  } else {
    $('.next').attr('disabled', 'disabled');
  }
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="col-xs-4 h100">
  <div class="title">What do you want to name your application as ?</div>
  <div class="help-text tMargin10">The name you provide here will be the application name used. Typically, it is the project name or repo name.</div>
  <div class="row applicationName">
    <form id="create-application-form">
      <div class="form-group">
        <label>Name your Application </label>
        <i class="fa fa-question-circle" title="The name you provide here will be the application name. Typically, it is the project name or repo name. Application name must begin with an alphabet and recommend not to use consecutive _, -, whitespaces. Ex - My_app_name, my app name, my-app-name are allowed. Please avoid names like my___app___name, my app name, or my-----app----name"></i>
        <span class="mandatory" title="Mandatory">*</span>
        <input class="form-control behavior-validate required" data-validation="[{"rule":"application_name"}]" minlength="4" maxlength="21" name="name" value="" type="text">
      </div>
      <div class="form-group">
        <label>Description</label>
        <textarea class="form-control" name="description"></textarea>
        <div class="help-text">This description will be displayed to users who may want to join your team. (Optional)</div>
      </div>
    </form>
  </div>
  <div class="viewActions text-right">
    <button class="btn btn-primary continue next hasError" type="button" title="Mandatory field missing" disabled="disabled">Next</button>
  </div>
</div>

我正在检查input textbox,如果input textbox中的任何一个为空,则下一个button将被禁用。

希望这会对你有所帮助。