payload: {"action":"opened","issue":{"url":"https://api.github.com/repos/axa-ch/patterns-library/issues/1138","repository_url":"https://api.github.com/repos/axa-ch/patterns-library","labels_url":"https://api.github.com/repos/axa-ch/patterns-library/issues/1138/labels{/name}","comments_url":"https://api.github.com/repos/axa-ch/patterns-library/issues/1138/comments","events_url":"https://api.github.com/repos/axa-ch/patterns-library/issues/1138/events","html_url":"https://github.com/axa-ch/patterns-library/issues/1138","id":464221932,"node_id":"MDU6SXNzdWU0NjQyMjE5MzI=","number":1138,"title":"The properties for the Datepicker component don't work in React","user":{"login":"francescoRovetto","id":5209125,"node_id":"MDQ6VXNlcjUyMDkxMjU=","avatar_url":"https://avatars0.githubusercontent.com/u/5209125?v=4","gravatar_id":"","url":"https://api.github.com/users/francescoRovetto","html_url":"https://github.com/francescoRovetto","followers_url":"https://api.github.com/users/francescoRovetto/followers","following_url":"https://api.github.com/users/francescoRovetto/following{/other_user}","gists_url":"https://api.github.com/users/francescoRovetto/gists{/gist_id}","starred_url":"https://api.github.com/users/francescoRovetto/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/francescoRovetto/subscriptions","organizations_url":"https://api.github.com/users/francescoRovetto/orgs","repos_url":"https://api.github.com/users/francescoRovetto/repos","events_url":"https://api.github.com/users/francescoRovetto/events{/privacy}","received_events_url":"https://api.github.com/users/francescoRovetto/received_events","type":"User","site_admin":false},"labels":[],"state":"open","locked":false,"assignee":null,"assignees":[],"milestone":null,"comments":0,"created_at":"2019-07-04T11:43:25Z","updated_at":"2019-07-04T11:43:25Z","closed_at":null,"author_association":"NONE","body":"Hi all- the properties like onChange and invaliddatetext don't work in the Datepicker component:\r\n\r\n                                <AXADatepickerReact\r\n                                        inputfield\r\n                                        invaliddatetext={'Date Format is wrong.'}\r\n                                        locale={\"de-CH\"}\r\n                                        onChange={date => console.log(`date changed ${date}`)}\r\n                                    />\r\n\r\nI tried to attach a file with the code but it doesn't work. So, if you want me to post more, I Need to add it in the commend.\r\n\r\nThis is the File, in which the Datepicker component is called:\r\n\r\nimport React, {Component} from 'react';\r\n import { createElement } from 'react';\r\n\r\nimport {FormattedMessage, FormattedHTMLMessage} from 'react-intl';\r\n import connect from \"unstated-connect\";\r\n\r\nimport {Route, withRouter} from 'react-router-dom';\r\n\r\nimport LimitenContainer from '../../../../containers/Limiten/LimitenContainer';\r\n\r\nimport picture from '../../../../img/g78du9cf.bmp';\r\n\r\nimport InputText from '../../../SmallComponents/InputText';\r\n import InputSelect from '../../../SmallComponents/InputSelect';\r\n\r\nimport createAXADatepickerReact from \"@axa-ch/datepicker/lib/index.react\";\r\n import createAXACheckBox from '@axa-ch/checkbox/lib/index.react';\r\n\r\nimport {\r\n AXAFormGroup,\r\n AXAInput,\r\n AXARadio,\r\n AXAButton,\r\n AXATable\r\n } from '@axa-ch/patterns-library/lib/js/react-exports';\r\n\r\nimport PolicenContainer from \"../../../../containers/Policen/policenContainer\";\r\n import DiversesContainer from \"../../../../containers/Diverses/DiversesContainer\";\r\n import VerlaengerungenErfassenContainer from \"../../../../containers/Verlaengerungen/VerlaengerungErfassenContainer\";\r\n import VerlaengerungenContainer from \"../../../../containers/Verlaengerungen/VerlaengerungenContainer\";\r\n\r\nclass NeueLimiteAngabenErfassen extends Component {\r\ncomponentWillUpdate() {\r\n    const stores = this.props.containers;\r\n    sessionStorage.setItem('neueVerlaengerungErfassen', JSON.stringify(stores[1].state));\r\n    sessionStorage.setItem('neueVerlaengerungErfassenDate', Date.now());\r\n\r\n}\r\n\r\n\r\ncomponentDidMount() {\r\n    const stores = this.props.containers;\r\n    stores[1].setState(\r\n        JSON.parse(sessionStorage.getItem('neueVerlaengerungErfassen'))\r\n    );\r\n    stores[2].setState(\r\n        JSON.parse(sessionStorage.getItem('policenAlle'))\r\n    )\r\n\r\n}\r\n\r\n\r\n\r\nrender() {\r\n\r\n    const stores = this.props.containers;\r\n    let adresseBlock = '';\r\n\r\n    const AXADatepickerReact = createAXADatepickerReact(createElement);\r\n    const AXACheckBox = createAXACheckBox(createElement);\r\n\r\n\r\n    console.log('limite ausgewahlt 4554', stores[1].state.adresseWahl);\r\n\r\n    if (adresseBlock === '') {\r\n\r\n        adresseBlock = (\r\n            <div>{stores[1].state.adresseWahl.firma}<br/>\r\n                {stores[1].state.adresseWahl.strasse}<br/>\r\n                {stores[1].state.adresseWahl.plz} {stores[1].state.adresseWahl.ort}<br/>\r\n                {stores[1].state.adresseWahl.land}<br/></div>)\r\n\r\n    }\r\n\r\n\r\n    return (\r\n        <div>\r\n\r\n            <div className={\"formularTitel\"}>\r\n                <img src={picture} className={'axaIcon'}/><p style={{paddingTop:\"20px\", paddingBottom:\"5px\"}}><b>NEUE VERLÄNGERUNG ERFASSEN | Kreditversicherung</b></p>\r\n            </div>\r\n            <table className={\"menuTable\"} width=\"100%\">\r\n                <tr >\r\n                    <td style={{borderRight: \"0px\", textAlign: \"right\", borderBottom: \"4px solid #F07662\"}} width=\"10%\">\r\n                        <p style={{fontSize: \"200%\", color: \"#310290\"}}>&#9312;</p>\r\n                    </td>\r\n                    <td width=\"12%\" style={{borderBottom: \"4px solid #F07662\"}}>\r\n                        <p style={{color: \"#310290\"}}>Kunde suchen</p>\r\n                    </td>\r\n                    <td style={{borderRight: \"0px\", textAlign: \"right\", borderBottom: \"4px solid #F07662\"}} width=\"2%\">\r\n                        <p style={{fontSize: \"200%\", color: \"#310290\"}}>&#9313;</p>\r\n                    </td>\r\n                    <td width=\"12%\" style={{borderBottom: \"4px solid #F07662\"}}>\r\n                        <p style={{color: \"#310290\"}}>Kunde erfassen</p>\r\n                    </td>\r\n                    <td style={{borderRight: \"0px\", textAlign: \"right\", borderBottom: \"4px solid #F07662\"}} width=\"2%\">\r\n                        <b><p style={{fontSize: \"200%\", color: \"#047281\"}}>&#9314;</p></b>\r\n                    </td>\r\n                    <td width=\"12%\">\r\n                        <b><p style={{color: \"#047281\"}}>Verlängerung erfassen</p></b>\r\n                    </td>\r\n                    <td style={{borderRight: \"0px\", textAlign: \"right\"}} width=\"2%\">\r\n                        <span style={{fontSize: \"200%\", color: \"#cccccc\"}}>&#9315;</span>\r\n                    </td>\r\n                    <td width=\"20%\">\r\n                        <p style={{color: \"#cccccc\"}}>Zusammenfassung</p>\r\n                    </td>\r\n                </tr>\r\n\r\n                </table>\r\n            <div className={'formularContent'}>\r\n                <h1>Verlängerung erfassen</h1>\r\n                <div className={'formularGrosserAbschnitt'}>\r\n                    <h2>Kunde</h2>\r\n                    <div className={'formularAbschnitt'}>\r\n                        <p>\r\n                            {adresseBlock}\r\n\r\n                        </p>\r\n                    </div>\r\n                </div>\r\n\r\n                <div className={'formularGrosserAbschnitt'}>\r\n                    <h2>Rechnungen</h2>\r\n                    <div className={'formularAbschnitt'}>\r\n                        <div style={{clear: \"left\"}}>\r\n                            <div style={{float: \"left\", paddingRight: \"30px\", width:\"40%\", marginBottom: \"40px\"}}>\r\n                                <p className={'smallTitle'}>Total aller offenen Rechnungen</p>\r\n                                <AXADatepickerReact\r\n                                    inputfield\r\n                                    invaliddatetext={'Date Format is wrong.'}\r\n                                    locale=\"de-CH\"\r\n                                    onChange={date => console.log(`date changed ${date}`)}\r\n                                />\r\n                            </div>\r\n                            <div style={{float: \"left\", width:\"40%\", marginBottom: \"15px\", paddingRight: \"30px\"}}>\r\n                                <p className={'smallTitle'}>Total aller überfälligen Rechnungen</p>\r\n                                <AXADatepickerReact\r\n                                    inputfield\r\n                                    invaliddatetext={'Date Format is wrong.'}\r\n                                    locale=\"de-CH\"\r\n                                    onChange={date => console.log(`date changed ${date}`)}\r\n                                />\r\n                            </div>\r\n                            <div style={{float: \"left\", width:\"20%\", marginBottom: \"15px\"}}>\r\n                                <InputSelect valueList={stores[1].state.waehrungen} inputTitle={'Währung'}  />\r\n                            </div>\r\n                        </div>\r\n                    </div>\r\n\r\n                    <div className={'formularAbschnitt'}>\r\n                        <div style={{clear: \"left\"}}>\r\n                            <div style={{float: \"left\", paddingRight: \"30px\", width:\"40%\", marginBottom: \"40px\"}}>\r\n                                <p className={'smallTitle'}>Datum der ältesten Rechnung</p>\r\n                                <AXADatepickerReact\r\n                                    inputfield\r\n                                    invaliddatetext={'Date Format is wrong.'}\r\n                                    locale=\"de-CH\"\r\n                                    onChange={date => console.log(`date changed ${date}`)}\r\n                                />\r\n                            </div>\r\n                            <div style={{float: \"left\", width:\"35%\", marginBottom: \"15px\"}}>\r\n                                <p className={'smallTitle'}>Fälligkeit der ältesten Rechnung</p>\r\n                                <AXADatepickerReact\r\n                                    inputfield\r\n                                    invaliddatetext={'Date Format is wrong.'}\r\n                                    locale=\"de-CH\"\r\n                                    onChange={date => console.log(`date changed ${date}`)}\r\n                                />\r\n                            </div>\r\n\r\n                        </div>\r\n                    </div>\r\n                    <div className={'formularAbschnitt'}>\r\n                        <div style={{clear: \"left\"}}>\r\n                                <p className={'smallTitle'}>Datum der neuesten Rechnung</p>\r\n                                <AXADatepickerReact\r\n                                    inputfield\r\n                                    invaliddatetext='Date Format is wrong.'\r\n                                    locale=\"de-CH\"\r\n                                    onChange={date => console.log(`date changed ${date}`)}\r\n                                />\r\n\r\n\r\n                        </div>\r\n                    </div>\r\n                </div>\r\n                <br/>\r\n                <br/>\r\n                <div className={'formularGrosserAbschnitt'}>\r\n                    <h2>Verlängerung der Frist</h2>\r\n                    <div className={'formularAbschnitt'}>\r\n                        <div style={{clear: \"left\"}}>\r\n                            <p className={'smallTitle'}>Gewünschte Verlängerung bis</p>\r\n\r\n                            <AXADatepickerReact\r\n                                    inputfield\r\n                                    invaliddatetext={'Date Format is wrong.'}\r\n                                    locale={\"de-CH\"}\r\n                                    onChange={date => console.log(`date changed ${date}`)}\r\n                                />\r\n\r\n\r\n                        </div>\r\n                    </div>\r\n                </div>\r\n\r\n                <br/>\r\n                <br/>\r\n                <br/>\r\n                <div className={'formularGrosserAbschnitt'}>\r\n                    <h2>Gründe für Nichtzahlung</h2>\r\n                    <div className={'formularAbschnitt'}>\r\n                        <div style={{clear: \"left\"}}>\r\n                            <AXACheckBox onChange={() => console.log('date changed')} label={\"I'm a checkbox\"}/>\r\n                            <AXACheckBox onChange={() => console.log('date changed')} checked={() => console.log('date changed')} label={\"I'm a controlled checkbox\"}/>\r\n                        </div>\r\n                    </div>\r\n                </div>\r\n\r\n                <br/>\r\n                <AXAButton tag=\"button\" className={'buttonLinks'} onAXAClick={() => {stores[1].navigiereZurueck(this.props)}}>zurück</AXAButton> <AXAButton tag=\"button\" className={'buttonLinks'} onAXAClick={() => {stores[1].zurueckZuVerlaengerungUebersicht(this.props, 'neueVerlaengerungErfassen')}} color=\"red\">abbrechen</AXAButton><AXAButton onAXAClick={ () => {stores[1].verlaengerungErfassenAbschluss(this.props, '/verlaengerungErfassen/verlaengerungAbschliessen')}} tag=\"button\"  style={{float: 'right'}} >weiter</AXAButton>\r\n            <br/>\r\n\r\n            </div>\r\n\r\n\r\n        </div>\r\n\r\n    );\r\n\r\n}\r\n\r\n\r\n}\r\n\r\nexport default connect([VerlaengerungenContainer, VerlaengerungenErfassenContainer, PolicenContainer, DiversesContainer])(withRouter(NeueLimiteAngabenErfassen));\r\n\r\n"}}
other: {"actor":{"display_login":"francescoRovetto"}}