additionalInputsProps

[quangas]

additionalInputsProps (using the sample on README.md) or requiresPostalCode are not working.

Does anyone have an example where this works?

It seems the props are not rendered

[trev91]

+1 Same prob

[smerkousdavid]

The issue I'm having is that the additionalInputProps are being overridden by the CCInput props. A lot of the properties that most people will change such as custom value handling, placeholders, etc. The properties that are passed in are in the first of the merge change and it actually reduces what keys people can override. So some keys will and some won't work.

<TouchableOpacity onPress={this.focus}
        activeOpacity={0.99}>
        <View style={[containerStyle]}>
          { !!label && <Text style={[labelStyle]}>{label}</Text>}
          <TextInput ref="input"
            {...additionalInputProps}
            keyboardType={keyboardType}
            autoCapitalise="words"
            autoCorrect={false}
            style={[
              s.baseInputStyle,
              inputStyle,
              ((validColor && status === "valid") ? { color: validColor } :
              (invalidColor && status === "invalid") ? { color: invalidColor } :
              {}),
            ]}
            underlineColorAndroid={"transparent"}
            placeholderTextColor={placeholderColor}
            placeholder={placeholder}
            value={value}
            onFocus={this._onFocus}
            onChangeText={this._onChange} />
        </View>

[noorulain17]

I am also facing the same problem.

I am trying to restrict the library to enter only English numerals using keyboardType: ascii-capable as the additionalInputProps but it is not working. Also, in the library, when I try to enter Arabic numbers, then onSubmit -> Arabic numbers are not received. See the gif attached below.

Any help regarding this will be much appreciated.

[Utkarshnamdeo]

+1

[caike]

I was able to get it to work doing something like this:

<CreditCardInput
  onChange={customFunctionUpdatesState}
  additionalInputsProps={
    {
      "number": {
        onEndEditing: () => { customFunctionReadsFromState }
      }
    }
  }
/>

What took me some time to figure out was the object format that additionalInputsProps expects (i.e. "number", "expiry", "cvc"). In this example I am using onEndEditing, but you can change this to any other event supported by TextInput

[harshvitra]

I still cant get through this, I tried changing style but its not working. What is the correct syntax for writing additionalInputProps ?