如何基于来自Javascript的值以模态形式标记复选框?

时间:2016-04-20 04:45:38

标签: javascript html node.js pug bootstrap-modal

如何在Javascript的模态窗体上设置输入复选框的值?以下是我正在做的事情,但没有标记复选框。

我的Javascript :(复选框是安全帽,靴子和状态)

var $modal = $('#editJob');
$modal.find('input#jobTitle').val(thisJobObject.title);
$modal.find('input#payRate').val(thisJobObject.payrate);
$modal.find('input#startDate').val(thisJobObject.durationstart);
$modal.find('input#endDate').val(thisJobObject.durationend);
$modal.find('input#workingHours').val(thisJobObject.workinghrs);
$modal.find('input#location').val(thisJobObject.location);
$modal.find('input#experience').val(thisJobObject.experience);
$modal.find('input#hardhat').prop('checked', thisJobObject.hardhat);  //I tried this based on other posts but it did not work
$modal.find('input#boots').val(thisJobObject.boots);
$modal.find('input#other').val(thisJobObject.other);
$modal.find('input#status').val(thisJobObject.status);
$modal.find('textarea#description').val(thisJobObject.description);

模态形式(以玉为单位):

#editJob.modal.fade(tabindex='-1', role='dialog', aria-labelledby='editJobLabel', aria-hidden='true')
          .modal-dialog#popupEditJob
            .modal-content#formEditJob(action='#', method='post', name='formEditJob')
              .modal-header#header
                button.close(type='button', data-dismiss='modal', aria-hidden='true', onclick='div_hide()') ×
                h4#label.modal-title Edit Job Details
              .modal-body
                #formBody(style='padding: 5px 20px;')
                  form#formFields.form-horizontal(data-parsley-validate='')
                    .form-group
                      label.col-sm-3.control-label(for='jobTitle')
                        | Job Title
                        span.required *
                      .col-sm-9
                        input#jobTitle.form-control(type='text', name='jobTitle', required='required')
                        .checkbox
                            input#status(type='checkbox', name='status', value='', class='flat')
                            |  Is this job active?
                    .x_content
                      .row   
                        label.col-sm-3.control-label 
                          | Payrate (per hr)   
                          span.required *
                        .col-md-4.col-sm-12.col-xs-12.form-group
                          input#payRate.form-control(type='text', name='payRate', required='required') 
                    .x_content
                      .row
                        label.col-sm-3.control-label 
                          | Working Hrs.
                          span.required * 
                        .col-md-4.col-sm-12.col-xs-12.form-group
                          input#workingHours.form-control(type='text', name='workingHours', required='required')
                    .x_content
                      .row
                        label.col-sm-3.control-label 
                          | Start/End Date
                          span.required *      
                        .col-md-4.col-sm-12.col-xs-12.form-group
                          input#startDate.form-control(type='date', name='startDate', required='required') 
                        .col-md-4.col-sm-12.col-xs-12.form-group
                          input#endDate.form-control(type='date', name='endDate')  
                        //TODO: style the calendar dropdowns
                        //TODO: highlight required fields on posting
                    .form-group
                      label.col-sm-3.control-label 
                        | Location
                        span.required *
                      .col-sm-9
                        input#location.form-control(type='text', name='location', required='required') 
                    .form-group
                      label.control-label.col-md-3.col-sm-3.col-xs-12 Exp. Required
                      .col-md-4.col-sm-12.col-xs-12.form-group
                        select.form-control
                          option None
                          option 0 - 1 Year
                          option 1 - 3 Years
                          option 3 - 5 Years
                          option 5+ Years
                    .form-group
                      label.col-sm-3.control-label 
                        | Description
                        span.required *
                      .col-sm-9
                        textarea#description.form-control(style='height:55px;', name='description', placeholder='Brief descrition of job duties.', required='required')
                    .form-group
                      label.col-sm-3.control-label
                      .col-sm-9
                        .checkbox
                            input#hardhat(type='checkbox', name='hardhat', value='', class='flat')
                            |  Does the employee need his own hardhat?
                    .form-group
                      label.col-sm-3.control-label
                      .col-sm-9
                        .checkbox
                            input#boots(type='checkbox', name='boots', value='', class='flat')
                            |  Does this job require steel toe boots?
                    .form-group
                      label.col-sm-3.control-label Other Equipment
                      .col-sm-9
                        input#otherEquipment.form-control(type='text', name='otherEquipment') 
                    .ln_solid
                    .form-group
                      .col-md-6.col-sm-6.col-xs-12.col-md-offset-3
                        button.btn.btn-default.antoclose#close(type='button', data-dismiss='modal', onclick='div_hide()') Close
                        button.btn.btn-primary.antosubmit#save(type='button', onclick='div_hide()') Save Changes 

我没有收到错误消息,代码编译得很好,但是没有标记复选框,即使在thisJobObject对象中标记了安全帽,引导和状态字段。

感谢您的帮助!

0 个答案:

没有答案