need to get value of dropdown menu without using onChange callback - (material-ui reactjs)

可紊 提交于 2019-12-23 12:07:33

问题


i am using material UI dropdown component and trying to run a callback function only when user fills all the form and submits the form. On the call back function i intend to collect all the form field and generate url to call to api.

My problem is that i can not use onChange as stated solution in #560 as i want to collect all the detail only when user clicks the submit button. It is also weird that at the moment, i am able to get value of all the other form element like slider, textfield which uses material-ui but only dropdown does not seem to be working.

My call back function:

handleFilter: function(event){
event.preventDefault();
var location = this.refs.location.getValue();
var posted_date = this.refs.posted_date.getValue();
var radius = this.refs.distance.getValue();
var salary = this.refs.salary.getValue();

    var jobtype = this.refs.jobtype.getValue();
    console.log(jobtype);       
}

In the above function "location, posted_date, radius, salary" returns value but "jobtype" which happens to be dropdown does not seem to return any value. It returns this error in console: "Uncaught TypeError: this.refs.jobtype.getValue is not a function"

Here is my dropdown component :

<DropDownMenu menuItems={menuItems} ref="jobtype" />

回答1:


May not be the right way but i figured out that

console.log(this.refs.jobtype) (jobtype is the refs value of dropdown in my case)

was giving the following result.

R…s.c…s.Constructor {props: Object, context: Object, state: Object, refs: Object, _reactInternalInstance: ReactCompositeComponentWrapper}

Inpecting it i found value of payload index (index number of selected item) inside state object within "selectedIndex" property. I used following code to access the selected index:

var jobtype = this.refs.jobtype.state.selectedIndex;  

If there is a better way to do this please suggest.



来源:https://stackoverflow.com/questions/32633272/need-to-get-value-of-dropdown-menu-without-using-onchange-callback-material-u

易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!