Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Add disabled attribute to select? #415

Closed
sharpmachine opened this issue Jun 3, 2015 · 3 comments
Closed

Add disabled attribute to select? #415

sharpmachine opened this issue Jun 3, 2015 · 3 comments

Comments

@sharpmachine
Copy link

Hi there,

I'd like the first option of a select field to act more a placeholder, like 'Select a source'. The issue I don't want this to be a valid option. Currently with angular schema form it will validate as successful.

I'm thinking I need to add a 'disabled' attribute to it, but don't know how to do with angular schema form.

@stramel
Copy link
Contributor

stramel commented Jun 3, 2015

@sharpmachine This seems related to #216 unless I misunderstood what you were trying to get at.

@sharpmachine
Copy link
Author

Hi, I've tried the suggestion in the original issue and it's not exactly working. It's not selecting N/A as the default. It just adds a blank option:

screen shot 2015-06-03 at 4 44 39 pm

Here's my code:

  var createTitleMap = function(x, arr) {
    var result = [];
    result.push({name: x, value:'?'});
    for(var i = 0; i < arr.length; i++) {
      result.push({name: arr[i], value:arr[i]});
    }
    return result;
  };

    var races = ['White', 'Black or African American', 'American Indian or Alaskian Native', 'Asian', 'Native Hawaiian or other Pacific Islander', 'Hispanic or Latino', 'Other', 'Unknown'];

  $scope.subjectBasicInfoForm = [
    {
      key: 'firstName',
      type: 'input'
    },
    {
      key: 'middleName',
      type: 'input'
    },
    {
      key: 'lastName',
      type: 'input'
    },
    {
      key: 'dateOfBirth',
      type: 'date',
      title: 'Date of Birth'
    },
    {
      key: 'gender',
      type: 'radios'
    },
    {
      key: 'race',
      type: 'select',
      titleMap: createTitleMap('N/A', races),
    },
    {
      type: 'template',
      templateUrl: 'views/templates/next_pager.tmpl.html',
      nextLabel: 'Contact Info',
      nextState: 'subject.edit.contactInfo'
    }
  ];

  $scope.subjectContactInfoForm = [
    {
      key: 'streetAddress',
      type: 'input'
    },
    {
      key: 'secondaryAddress',
      type: 'input'
    },
    {
      key: 'city',
      type: 'input'
    },
    {
      key: 'state'
    },
    {
      key: 'county',
      type: 'input'
    },
    {
      key: 'zipCode',
      type: 'input'
    },
    {
      key: 'cellPhone',
      type: 'input'
    },
    {
      key: 'homePhone',
      type: 'input'
    }
  ];

  $scope.subjectSchema = {
    type: 'object',
    properties: {
      firstName: {
        type: 'string',
        title: 'First Name',
        validationMessage: 'Gotta have a first name',
        minLength: 2
      },
      middleName: {
        type: 'string',
        title: 'Middle Name'
      },
      lastName: {
        type: 'string',
        title: 'Last Name'
      },
      dateOfBirth: {
        type: 'date',
        title: 'Date of Birth'
      },
      gender: {
        type: 'string',
        title: 'Gender',
        enum: ['Male', 'Female']
      },
      race: {
        type: 'string',
        title: 'Race',
        enum: races
      },
      streetAddress: {
        type: 'string',
        title: 'Address'
      },
      secondaryAddress: {
        type: 'string',
        title: 'Secondary Address'
      },
      city: {
        type: 'string',
        title: 'City'
      },
      state: {
        type: 'string',
        title: 'State',
        default: 'CA',
        enum: [
         'CA',
         'WA',
         'MT',
         'TX'
        ]
      },
      county: {
        type: 'string',
        title: 'County'
      },
      zipCode: {
        type: 'string',
        title: 'Zip Code'
      },
      cellPhone: {
        type: 'string',
        title: 'Cell Phone'
      },
      homePhone: {
        type: 'string',
        title: 'Home Phone'
      }
    },
    required: [
      'firstName'
    ]
  };

@davidlgj
Copy link
Contributor

It's not a disabled attribute you want but an extra option tag. I've been working of and on merging this PR #294 that fixes it. But I like a bit cleaner solution to the problem. I can't give any estimates on when, but its coming.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

3 participants