Skip to main content

Return to Question

Added some react form code
Source Link
Bitz
Bitz
  • 1.1k
  • 13
  • 39

This is the code that react is using to build the component:

function LastNameComponent(_ref) {
    var index = _ref.index,
        isFirstField = _ref.isFirstField,
        formatValue = _ref.formatValue;

    var minLength = 2;
    var maxLength = 80;
    return _react2.default.createElement(
        'div',
        { className: 'form--item span3' },
        _react2.default.createElement(
            'label',
            { className: 'search-label small field__icon_group' },
            _react2.default.createElement(
                'span',
                null,
                '*'
            ),
            'Last Name',
            _react2.default.createElement(_TextInput2.default, {
                id: "last-name-[" + index + "]",
                model: "searchParams.searches[" + index + "].fields.lastName",
                validators: { required: function required(value) {
                        return !value || value.length < minLength || value.length > maxLength;
                    } },
                formatValue: formatValue
            }),
            _react2.default.createElement(_ErrorMessage2.default, {
                model: "searchParams.searches[" + index + "].fields.lastName",
                messages: { required: "Please enter the member's Last Name" }
            })
        )
    );
}

This is the code that react is using to build the component:

function LastNameComponent(_ref) {
    var index = _ref.index,
        isFirstField = _ref.isFirstField,
        formatValue = _ref.formatValue;

    var minLength = 2;
    var maxLength = 80;
    return _react2.default.createElement(
        'div',
        { className: 'form--item span3' },
        _react2.default.createElement(
            'label',
            { className: 'search-label small field__icon_group' },
            _react2.default.createElement(
                'span',
                null,
                '*'
            ),
            'Last Name',
            _react2.default.createElement(_TextInput2.default, {
                id: "last-name-[" + index + "]",
                model: "searchParams.searches[" + index + "].fields.lastName",
                validators: { required: function required(value) {
                        return !value || value.length < minLength || value.length > maxLength;
                    } },
                formatValue: formatValue
            }),
            _react2.default.createElement(_ErrorMessage2.default, {
                model: "searchParams.searches[" + index + "].fields.lastName",
                messages: { required: "Please enter the member's Last Name" }
            })
        )
    );
}
Source Link
Bitz
Bitz
  • 1.1k
  • 13
  • 39

Filling a react form using JQuery

So I am in the process of attempting to use some simple code injection to populate a form and submit it, in most cases, I am able to have the textbox revalidate by firing the blur event, but in the case of a react form build on redux, it does not validate in the same manner.

I tried using the following code, but it does not work:
top.jQuery('input#last-name-\\[0\\]').val('Smith').attr('value','Smith').trigger('blur');

Is there an event that I should be firing instead of the input event?

The values are not detected as firing the click event on the submit fails validation, as though no data has been entered in the form.

I tried a number of triggers including keyup, keydown, keypress, focus, blur, and changed.

Please note that using default values are not an option, because I am injecting the form data into a website that is not my own.